合并重提
This commit is contained in:
@ -7,42 +7,33 @@
|
||||
</template>
|
||||
|
||||
<script>
|
||||
import {
|
||||
mapState,
|
||||
mapMutations,
|
||||
mapActions
|
||||
} from "vuex";
|
||||
// 组件
|
||||
// import request from "@//api/request";
|
||||
import {
|
||||
wxappAuth,
|
||||
getUser
|
||||
} from "@/api/user";
|
||||
import dayjs from "dayjs";
|
||||
import cookie from "@/utils/store/cookie";
|
||||
import {
|
||||
parseQuery,
|
||||
login,
|
||||
handleQrCode
|
||||
} from "@/utils";
|
||||
import { mapState, mapMutations, mapActions } from "vuex";
|
||||
// 组件
|
||||
// import request from "@//api/request";
|
||||
import { wxappAuth, getUser } from "@/api/user";
|
||||
import dayjs from "dayjs";
|
||||
import cookie from "@/utils/store/cookie";
|
||||
import { parseQuery, login, handleQrCode ,getCurrentPageUrl,handleUrlParam} from "@/utils";
|
||||
|
||||
export default {
|
||||
name: "Loading",
|
||||
data() {
|
||||
return {};
|
||||
},
|
||||
onShow() {
|
||||
export default {
|
||||
name: "Loading",
|
||||
data() {
|
||||
return {};
|
||||
},
|
||||
onShow() {
|
||||
|
||||
var url = handleQrCode();
|
||||
// 判断是否是分销
|
||||
if (url) {
|
||||
var spread = cookie.get("spread");
|
||||
let urlSpread = parseInt(url.spread);
|
||||
if (!Number.isNaN(urlSpread) && spread !== urlSpread) {
|
||||
cookie.set("spread", urlSpread || 0);
|
||||
} else if (spread === 0 || typeof spread !== "number") {
|
||||
cookie.set("spread", urlSpread || 0);
|
||||
}
|
||||
var url = handleQrCode();
|
||||
if(!url){
|
||||
url = handleUrlParam(getCurrentPageUrl())
|
||||
}
|
||||
// 判断是否是分销
|
||||
if (url) {
|
||||
var spread = cookie.get("spread");
|
||||
let urlSpread = parseInt(url.spread);
|
||||
if (!Number.isNaN(urlSpread) && spread !== urlSpread) {
|
||||
cookie.set("spread", urlSpread || 0);
|
||||
} else if (spread === 0 || typeof spread !== "number") {
|
||||
cookie.set("spread", urlSpread || 0);
|
||||
}
|
||||
if (this.$store.getters.token) {
|
||||
this.toLaunch();
|
||||
|
@ -111,6 +111,7 @@ export default {
|
||||
pinkT: [], //团长信息
|
||||
storeCombination: [], //拼团产品
|
||||
pinkId: 0,
|
||||
uniqueId: "",
|
||||
count: 0, //拼团剩余人数
|
||||
iShidden: false
|
||||
};
|
||||
@ -208,6 +209,7 @@ export default {
|
||||
that.$set(that, "pinkBool", res.data.pinkBool);
|
||||
that.$set(that, "isOk", res.data.isOk);
|
||||
that.$set(that, "currentPinkOrder", res.data.currentPinkOrder);
|
||||
that.$set(that, "uniqueId", res.data.uniqueId);
|
||||
});
|
||||
},
|
||||
//拼团取消
|
||||
|
@ -1,249 +1,248 @@
|
||||
<template>
|
||||
<view class="live-el mx20 mb10">
|
||||
<view class="head">
|
||||
<text class="head-title">热门直播</text>
|
||||
<view class="head-more" @tap="$yrouter.push('/pages/shop/Live/LiveList/index')">
|
||||
<text>更多</text>
|
||||
<text class="cuIcon-right"></text>
|
||||
</view>
|
||||
</view>
|
||||
<view class="content-one">
|
||||
<view class="content-one__item" v-for="live in detail" :key="live.roomId" @tap="goRoom(live)">
|
||||
<image class="item-cover" :src="live.shareImge" mode="widthFix"></image>
|
||||
<view class="item-status">
|
||||
<image class="status-img" :src="liveStatus[live.liveStatus].img" mode=""></image>
|
||||
<text class="status-text">{{ liveStatus[live.liveStatus].title }}</text>
|
||||
</view>
|
||||
<view class="item-title">{{ live.name }}</view>
|
||||
<image v-if="live.liveStatus == 101" class="like-img" src="http://Shop.7wpp.com/imgs/live/zan.gif"
|
||||
mode=""></image>
|
||||
</view>
|
||||
</view>
|
||||
</view>
|
||||
</template>
|
||||
|
||||
<script>
|
||||
import ShopLiveCard from '@/components/ShopLiveCard.vue'
|
||||
|
||||
let HAS_LIVE = false
|
||||
// #ifdef MP-WEIXIN
|
||||
HAS_LIVE = true
|
||||
let livePlayer = null;
|
||||
if (HAS_LIVE) {
|
||||
livePlayer = requirePlugin('live-player-plugin');
|
||||
}
|
||||
// #endif
|
||||
import {
|
||||
yxWechatLive,
|
||||
getLiveReplay
|
||||
} from '@/api/live';
|
||||
|
||||
let timer = null;
|
||||
export default {
|
||||
components: {
|
||||
ShopLiveCard
|
||||
},
|
||||
data() {
|
||||
return {
|
||||
liveList: [],
|
||||
liveStatus: {
|
||||
'101': {
|
||||
img: 'https://wx.yixiang.co/static/images/live.png',
|
||||
title: '直播中'
|
||||
},
|
||||
'102': {
|
||||
img: 'https://wx.yixiang.co/static/images/prevue.png',
|
||||
title: '未开始'
|
||||
},
|
||||
'103': {
|
||||
img: 'https://wx.yixiang.co/static/images/playback.png',
|
||||
title: '已结束'
|
||||
},
|
||||
'104': {
|
||||
img: 'https://wx.yixiang.co/static/images/104.png',
|
||||
title: '禁播'
|
||||
},
|
||||
'105': {
|
||||
img: 'https://wx.yixiang.co/static/images/105.png',
|
||||
title: '暂停中'
|
||||
},
|
||||
'106': {
|
||||
img: 'https://wx.yixiang.co/static/images/106.png',
|
||||
title: '异常'
|
||||
},
|
||||
'107': {
|
||||
img: 'https://wx.yixiang.co/static/images/past.png',
|
||||
title: '已过期'
|
||||
}
|
||||
}
|
||||
};
|
||||
},
|
||||
props: {
|
||||
detail: Array
|
||||
},
|
||||
created() {
|
||||
},
|
||||
mounted() {
|
||||
let that = this;
|
||||
timer = setInterval(() => {
|
||||
that.getLiveStatus();
|
||||
}, 60000);
|
||||
},
|
||||
beforeDestroy() {
|
||||
timer = null;
|
||||
},
|
||||
computed: {},
|
||||
methods: {
|
||||
// 直播列表
|
||||
getLiveList() {
|
||||
// let that = this;
|
||||
// yxWechatLive({
|
||||
// page: 1,
|
||||
// size: 10,
|
||||
// }).then(res => {
|
||||
// console.log(res)
|
||||
// })
|
||||
},
|
||||
// 轮询liveStatus
|
||||
getLiveStatus() {
|
||||
// if (HAS_LIVE) {
|
||||
// let that = this;
|
||||
// let date = '';
|
||||
// if (that.detail.liveStatus == 102) {
|
||||
// date = that.$tools.dateFormat('mm-dd HH:MM', new Date(that.detail.starttime * 1000)).replace('-',
|
||||
// '/');
|
||||
// that.liveStatus['102'].title = '预告 ' + date;
|
||||
// }
|
||||
// livePlayer
|
||||
// .getLiveStatus({
|
||||
// room_id: that.detail.roomId
|
||||
// })
|
||||
// .then(res => {
|
||||
// // 101: 直播中, 102: 未开始, 103: 已结束, 104: 禁播, 105: 暂停中, 106: 异常,107:已过期
|
||||
// that.detail.liveStatus = res.liveStatus;
|
||||
// })
|
||||
// .catch(err => {
|
||||
// console.log('get live status', err);
|
||||
// });
|
||||
// }
|
||||
},
|
||||
goRoom(live) {
|
||||
console.log(live.roomId,9999)
|
||||
wx.navigateTo({
|
||||
url: `plugin-private://wx2b03c6e691cd7370/pages/live-player-plugin?room_id=${live.roomId}`
|
||||
});
|
||||
}
|
||||
}
|
||||
};
|
||||
</script>
|
||||
|
||||
<style lang="scss">
|
||||
.live-el {
|
||||
background: #fff;
|
||||
border-radius: 20rpx;
|
||||
padding: 30rpx 20rpx 25rpx;
|
||||
|
||||
.head {
|
||||
display: flex;
|
||||
justify-content: space-between;
|
||||
align-items: center;
|
||||
|
||||
&-title {
|
||||
font-size: 32rpx;
|
||||
font-weight: bold;
|
||||
font-family: PingFang SC;
|
||||
color: rgba(51, 51, 51, 1);
|
||||
}
|
||||
|
||||
&-more {
|
||||
font-size: 26rpx;
|
||||
font-family: PingFang SC;
|
||||
font-weight: 500;
|
||||
color: rgba(51, 51, 51, 1);
|
||||
}
|
||||
}
|
||||
|
||||
// 单个大图直播
|
||||
.content-one {
|
||||
.content-one__item {
|
||||
position: relative;
|
||||
height: 280rpx;
|
||||
border-radius: 20rpx;
|
||||
margin-top: 25rpx;
|
||||
overflow: hidden;
|
||||
|
||||
.item-cover {
|
||||
background-color: #eee;
|
||||
width: 100%;
|
||||
height: 100%;
|
||||
}
|
||||
|
||||
.item-status {
|
||||
position: absolute;
|
||||
top: 20rpx;
|
||||
left: 10rpx;
|
||||
height: 40rpx;
|
||||
background: rgba(0, 0, 0, 0.4);
|
||||
border-radius: 20rpx;
|
||||
display: flex;
|
||||
justify-content: center;
|
||||
align-items: center;
|
||||
|
||||
.status-img {
|
||||
width: 38rpx;
|
||||
height: 38rpx;
|
||||
}
|
||||
|
||||
.status-text {
|
||||
font-size: 22rpx;
|
||||
font-family: PingFang SC;
|
||||
font-weight: 500;
|
||||
color: rgba(255, 255, 255, 1);
|
||||
padding: 0 10rpx;
|
||||
}
|
||||
}
|
||||
|
||||
.item-title {
|
||||
width: 680rpx;
|
||||
position: absolute;
|
||||
bottom: 0;
|
||||
line-height: 60rpx;
|
||||
padding: 0 20rpx;
|
||||
font-size: 26rpx;
|
||||
font-family: PingFang SC;
|
||||
font-weight: 500;
|
||||
color: rgba(255, 255, 255, 1);
|
||||
background: linear-gradient(transparent, rgba(#000, 0.5));
|
||||
}
|
||||
|
||||
.like-img {
|
||||
position: absolute;
|
||||
bottom: 20rpx;
|
||||
right: 10rpx;
|
||||
width: 60rpx;
|
||||
height: 130rpx;
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
// 双图直播
|
||||
.content-two {
|
||||
width: 100%;
|
||||
// -moz-column-count: 2;
|
||||
// -webkit-column-count: 2;
|
||||
// column-count: 2;
|
||||
// padding-top: 20rpx;
|
||||
display: flex;
|
||||
flex-wrap: wrap;
|
||||
|
||||
&__item {
|
||||
margin-right: 30rpx;
|
||||
margin-top: 20rpx;
|
||||
|
||||
&:nth-child(2n) {
|
||||
margin-right: 0;
|
||||
}
|
||||
}
|
||||
}
|
||||
}
|
||||
</style>
|
||||
<template>
|
||||
<view class="live-el mx20 mb10">
|
||||
<view class="head">
|
||||
<text class="head-title">热门直播</text>
|
||||
<view class="head-more" @tap="$yrouter.push('/pages/shop/Live/LiveList/index')">
|
||||
<text>更多</text>
|
||||
<text class="cuIcon-right"></text>
|
||||
</view>
|
||||
</view>
|
||||
<view class="content-one">
|
||||
<view class="content-one__item" v-for="live in detail" :key="live.roomId" @tap="goRoom(live)">
|
||||
<image class="item-cover" :src="live.shareImge" mode="widthFix"></image>
|
||||
<view class="item-status">
|
||||
<image class="status-img" :src="liveStatus[live.liveStatus].img" mode=""></image>
|
||||
<text class="status-text">{{ liveStatus[live.liveStatus].title }}</text>
|
||||
</view>
|
||||
<view class="item-title">{{ live.name }}</view>
|
||||
<image v-if="live.liveStatus == 101" class="like-img" src="http://Shop.7wpp.com/imgs/live/zan.gif"
|
||||
mode=""></image>
|
||||
</view>
|
||||
</view>
|
||||
</view>
|
||||
</template>
|
||||
|
||||
<script>
|
||||
import ShopLiveCard from '@/components/ShopLiveCard.vue'
|
||||
|
||||
let HAS_LIVE = false
|
||||
// #ifdef MP-WEIXIN
|
||||
HAS_LIVE = true
|
||||
let livePlayer = null;
|
||||
if (HAS_LIVE) {
|
||||
livePlayer = requirePlugin('live-player-plugin');
|
||||
}
|
||||
// #endif
|
||||
import {
|
||||
yxWechatLive,
|
||||
getLiveReplay
|
||||
} from '@/api/live';
|
||||
|
||||
let timer = null;
|
||||
export default {
|
||||
components: {
|
||||
ShopLiveCard
|
||||
},
|
||||
data() {
|
||||
return {
|
||||
liveList: [],
|
||||
liveStatus: {
|
||||
'101': {
|
||||
img: 'https://wx.yixiang.co/static/images/live.png',
|
||||
title: '直播中'
|
||||
},
|
||||
'102': {
|
||||
img: 'https://wx.yixiang.co/static/images/prevue.png',
|
||||
title: '未开始'
|
||||
},
|
||||
'103': {
|
||||
img: 'https://wx.yixiang.co/static/images/playback.png',
|
||||
title: '已结束'
|
||||
},
|
||||
'104': {
|
||||
img: 'https://wx.yixiang.co/static/images/104.png',
|
||||
title: '禁播'
|
||||
},
|
||||
'105': {
|
||||
img: 'https://wx.yixiang.co/static/images/105.png',
|
||||
title: '暂停中'
|
||||
},
|
||||
'106': {
|
||||
img: 'https://wx.yixiang.co/static/images/106.png',
|
||||
title: '异常'
|
||||
},
|
||||
'107': {
|
||||
img: 'https://wx.yixiang.co/static/images/past.png',
|
||||
title: '已过期'
|
||||
}
|
||||
}
|
||||
};
|
||||
},
|
||||
props: {
|
||||
detail: Array
|
||||
},
|
||||
created() {
|
||||
},
|
||||
mounted() {
|
||||
let that = this;
|
||||
timer = setInterval(() => {
|
||||
that.getLiveStatus();
|
||||
}, 60000);
|
||||
},
|
||||
beforeDestroy() {
|
||||
timer = null;
|
||||
},
|
||||
computed: {},
|
||||
methods: {
|
||||
// 直播列表
|
||||
getLiveList() {
|
||||
// let that = this;
|
||||
// yxWechatLive({
|
||||
// page: 1,
|
||||
// size: 10,
|
||||
// }).then(res => {
|
||||
// console.log(res)
|
||||
// })
|
||||
},
|
||||
// 轮询liveStatus
|
||||
getLiveStatus() {
|
||||
// if (HAS_LIVE) {
|
||||
// let that = this;
|
||||
// let date = '';
|
||||
// if (that.detail.liveStatus == 102) {
|
||||
// date = that.$tools.dateFormat('mm-dd HH:MM', new Date(that.detail.starttime * 1000)).replace('-',
|
||||
// '/');
|
||||
// that.liveStatus['102'].title = '预告 ' + date;
|
||||
// }
|
||||
// livePlayer
|
||||
// .getLiveStatus({
|
||||
// room_id: that.detail.roomId
|
||||
// })
|
||||
// .then(res => {
|
||||
// // 101: 直播中, 102: 未开始, 103: 已结束, 104: 禁播, 105: 暂停中, 106: 异常,107:已过期
|
||||
// that.detail.liveStatus = res.liveStatus;
|
||||
// })
|
||||
// .catch(err => {
|
||||
// console.log('get live status', err);
|
||||
// });
|
||||
// }
|
||||
},
|
||||
goRoom(live) {
|
||||
wx.navigateTo({
|
||||
url: `plugin-private://wx2b03c6e691cd7370/pages/live-player-plugin?room_id=${live.roomId}`
|
||||
});
|
||||
}
|
||||
}
|
||||
};
|
||||
</script>
|
||||
|
||||
<style lang="scss">
|
||||
.live-el {
|
||||
background: #fff;
|
||||
border-radius: 20rpx;
|
||||
padding: 30rpx 20rpx 25rpx;
|
||||
|
||||
.head {
|
||||
display: flex;
|
||||
justify-content: space-between;
|
||||
align-items: center;
|
||||
|
||||
&-title {
|
||||
font-size: 32rpx;
|
||||
font-weight: bold;
|
||||
font-family: PingFang SC;
|
||||
color: rgba(51, 51, 51, 1);
|
||||
}
|
||||
|
||||
&-more {
|
||||
font-size: 26rpx;
|
||||
font-family: PingFang SC;
|
||||
font-weight: 500;
|
||||
color: rgba(51, 51, 51, 1);
|
||||
}
|
||||
}
|
||||
|
||||
// 单个大图直播
|
||||
.content-one {
|
||||
.content-one__item {
|
||||
position: relative;
|
||||
height: 280rpx;
|
||||
border-radius: 20rpx;
|
||||
margin-top: 25rpx;
|
||||
overflow: hidden;
|
||||
|
||||
.item-cover {
|
||||
background-color: #eee;
|
||||
width: 100%;
|
||||
height: 100%;
|
||||
}
|
||||
|
||||
.item-status {
|
||||
position: absolute;
|
||||
top: 20rpx;
|
||||
left: 10rpx;
|
||||
height: 40rpx;
|
||||
background: rgba(0, 0, 0, 0.4);
|
||||
border-radius: 20rpx;
|
||||
display: flex;
|
||||
justify-content: center;
|
||||
align-items: center;
|
||||
|
||||
.status-img {
|
||||
width: 38rpx;
|
||||
height: 38rpx;
|
||||
}
|
||||
|
||||
.status-text {
|
||||
font-size: 22rpx;
|
||||
font-family: PingFang SC;
|
||||
font-weight: 500;
|
||||
color: rgba(255, 255, 255, 1);
|
||||
padding: 0 10rpx;
|
||||
}
|
||||
}
|
||||
|
||||
.item-title {
|
||||
width: 680rpx;
|
||||
position: absolute;
|
||||
bottom: 0;
|
||||
line-height: 60rpx;
|
||||
padding: 0 20rpx;
|
||||
font-size: 26rpx;
|
||||
font-family: PingFang SC;
|
||||
font-weight: 500;
|
||||
color: rgba(255, 255, 255, 1);
|
||||
background: linear-gradient(transparent, rgba(#000, 0.5));
|
||||
}
|
||||
|
||||
.like-img {
|
||||
position: absolute;
|
||||
bottom: 20rpx;
|
||||
right: 10rpx;
|
||||
width: 60rpx;
|
||||
height: 130rpx;
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
// 双图直播
|
||||
.content-two {
|
||||
width: 100%;
|
||||
// -moz-column-count: 2;
|
||||
// -webkit-column-count: 2;
|
||||
// column-count: 2;
|
||||
// padding-top: 20rpx;
|
||||
display: flex;
|
||||
flex-wrap: wrap;
|
||||
|
||||
&__item {
|
||||
margin-right: 30rpx;
|
||||
margin-top: 20rpx;
|
||||
|
||||
&:nth-child(2n) {
|
||||
margin-right: 0;
|
||||
}
|
||||
}
|
||||
}
|
||||
}
|
||||
</style>
|
||||
|
@ -1,182 +1,182 @@
|
||||
<template>
|
||||
<view class="page_box">
|
||||
<view class="head_box">
|
||||
<view class="live-tab">
|
||||
<view class="live-tab__item" v-for="tab in liveTab" :key="tab.title" @tap="selTab(tab)">
|
||||
<view class="live-tab__item-name">{{ tab.name }}</view>
|
||||
<text class="live-tab__item--link" :class="{ 'live-tab__item--active': tabCur == tab.title }"></text>
|
||||
</view>
|
||||
</view>
|
||||
</view>
|
||||
<view class="content_box">
|
||||
<scroll-view scroll-y="true" @scrolltolower="loadMore" class="scroll-box">
|
||||
<view class="list-box">
|
||||
<block v-for="live in liveList" :key="live.roomId">
|
||||
<shop-live-card :detail="live"></shop-live-card>
|
||||
</block>
|
||||
</view>
|
||||
<view v-if="liveList.length" class="cu-load text-gray" :class="loadStatus"></view>
|
||||
</scroll-view>
|
||||
</view>
|
||||
<Loading :loaded="loaded" :loading="loading"></Loading>
|
||||
</view>
|
||||
</template>
|
||||
|
||||
<script>
|
||||
import {
|
||||
yxWechatLive
|
||||
} from "@/api/live";
|
||||
import ShopLiveCard from '@/components/ShopLiveCard.vue'
|
||||
import Loading from "@/components/Loading";
|
||||
|
||||
export default {
|
||||
components: {
|
||||
ShopLiveCard,
|
||||
Loading
|
||||
},
|
||||
data() {
|
||||
return {
|
||||
tabCur: 'all',
|
||||
liveStatus: '',
|
||||
loaded: false,
|
||||
loading: false,
|
||||
liveTab: [{
|
||||
title: 'all',
|
||||
name: '全部',
|
||||
code: ''
|
||||
},
|
||||
{
|
||||
title: 'prevue',
|
||||
name: '预告',
|
||||
code: '102'
|
||||
|
||||
},
|
||||
{
|
||||
title: 'living',
|
||||
name: '直播中',
|
||||
code: '101'
|
||||
|
||||
},
|
||||
{
|
||||
title: 'lived',
|
||||
name: '已结束',
|
||||
code: '103'
|
||||
|
||||
}
|
||||
],
|
||||
liveList: [],
|
||||
loadStatus: '', //loading,over
|
||||
currentPage: 0,
|
||||
size: 10,
|
||||
lastPage: 0
|
||||
};
|
||||
},
|
||||
computed: {},
|
||||
onLoad() {
|
||||
this.getLiveList();
|
||||
},
|
||||
onHide() {},
|
||||
methods: {
|
||||
// 切换tab
|
||||
selTab(tab) {
|
||||
console.log(tab)
|
||||
this.tabCur = tab.title;
|
||||
this.liveStatus = tab.code;
|
||||
this.liveList = [];
|
||||
this.loaded=false;
|
||||
this.loading=false;
|
||||
this.getLiveListTab();
|
||||
},
|
||||
|
||||
// 直播列表
|
||||
getLiveListTab() {
|
||||
let that = this;
|
||||
yxWechatLive({
|
||||
liveStatus: that.liveStatus,
|
||||
page: 0,
|
||||
size: that.size
|
||||
}).then(res => {
|
||||
that.liveList = [...that.liveList, ...res.data.content];
|
||||
that.lastPage = res.data.lastPage;
|
||||
this.loaded = res.data.content.length < that.size;
|
||||
this.loading = false;
|
||||
});
|
||||
},
|
||||
// 直播列表
|
||||
getLiveList() {
|
||||
let that = this;
|
||||
if (this.loading || this.loaded) return;
|
||||
this.loading = true;
|
||||
yxWechatLive({
|
||||
liveStatus: this.liveStatus,
|
||||
page: this.currentPage,
|
||||
size: this.size
|
||||
}).then(res => {
|
||||
that.liveList = that.liveList.concat(res.data.content)
|
||||
this.currentPage++;
|
||||
this.loaded = res.data.content.length < that.size;
|
||||
this.loading = false;
|
||||
});
|
||||
}
|
||||
},
|
||||
onReachBottom() {
|
||||
!this.loading && this.getLiveList();
|
||||
}
|
||||
};
|
||||
</script>
|
||||
|
||||
<style lang="scss">
|
||||
// tab
|
||||
.live-tab {
|
||||
width: 100%;
|
||||
height: 96rpx;
|
||||
background: #fff;
|
||||
display: flex;
|
||||
align-items: center;
|
||||
|
||||
&__item {
|
||||
flex: 1;
|
||||
height: 100%;
|
||||
display: flex;
|
||||
flex-direction: column;
|
||||
justify-content: space-between;
|
||||
align-items: center;
|
||||
}
|
||||
|
||||
&__item-name {
|
||||
font-size: 28rpx;
|
||||
font-family: PingFang SC;
|
||||
font-weight: bold;
|
||||
color: rgba(51, 51, 51, 1);
|
||||
flex: 1;
|
||||
display: flex;
|
||||
justify-content: center;
|
||||
align-items: center;
|
||||
}
|
||||
|
||||
&__item--link {
|
||||
width: 68rpx;
|
||||
height: 4rpx;
|
||||
background: transparent;
|
||||
border-radius: 2rpx;
|
||||
}
|
||||
|
||||
&__item--active {
|
||||
width: 68rpx;
|
||||
height: 4rpx;
|
||||
background: rgba(213, 166, 90, 1);
|
||||
border-radius: 2rpx;
|
||||
}
|
||||
}
|
||||
|
||||
// 瀑布流 list
|
||||
.scroll-box {
|
||||
.list-box {
|
||||
width: 100%;
|
||||
-moz-column-count: 2;
|
||||
-webkit-column-count: 2;
|
||||
column-count: 2;
|
||||
padding: 25rpx;
|
||||
}
|
||||
}
|
||||
</style>
|
||||
<template>
|
||||
<view class="page_box">
|
||||
<view class="head_box">
|
||||
<view class="live-tab">
|
||||
<view class="live-tab__item" v-for="tab in liveTab" :key="tab.title" @tap="selTab(tab)">
|
||||
<view class="live-tab__item-name">{{ tab.name }}</view>
|
||||
<text class="live-tab__item--link" :class="{ 'live-tab__item--active': tabCur == tab.title }"></text>
|
||||
</view>
|
||||
</view>
|
||||
</view>
|
||||
<view class="content_box">
|
||||
<scroll-view scroll-y="true" @scrolltolower="loadMore" class="scroll-box">
|
||||
<view class="list-box">
|
||||
<block v-for="live in liveList" :key="live.roomId">
|
||||
<shop-live-card :detail="live"></shop-live-card>
|
||||
</block>
|
||||
</view>
|
||||
<view v-if="liveList.length" class="cu-load text-gray" :class="loadStatus"></view>
|
||||
</scroll-view>
|
||||
</view>
|
||||
<Loading :loaded="loaded" :loading="loading"></Loading>
|
||||
</view>
|
||||
</template>
|
||||
|
||||
<script>
|
||||
import {
|
||||
yxWechatLive
|
||||
} from "@/api/live";
|
||||
import ShopLiveCard from '@/components/ShopLiveCard.vue'
|
||||
import Loading from "@/components/Loading";
|
||||
|
||||
export default {
|
||||
components: {
|
||||
ShopLiveCard,
|
||||
Loading
|
||||
},
|
||||
data() {
|
||||
return {
|
||||
tabCur: 'all',
|
||||
liveStatus: '',
|
||||
loaded: false,
|
||||
loading: false,
|
||||
liveTab: [{
|
||||
title: 'all',
|
||||
name: '全部',
|
||||
code: ''
|
||||
},
|
||||
{
|
||||
title: 'prevue',
|
||||
name: '预告',
|
||||
code: '102'
|
||||
|
||||
},
|
||||
{
|
||||
title: 'living',
|
||||
name: '直播中',
|
||||
code: '101'
|
||||
|
||||
},
|
||||
{
|
||||
title: 'lived',
|
||||
name: '已结束',
|
||||
code: '103'
|
||||
|
||||
}
|
||||
],
|
||||
liveList: [],
|
||||
loadStatus: '', //loading,over
|
||||
currentPage: 0,
|
||||
size: 10,
|
||||
lastPage: 0
|
||||
};
|
||||
},
|
||||
computed: {},
|
||||
onLoad() {
|
||||
this.getLiveList();
|
||||
},
|
||||
onHide() {},
|
||||
methods: {
|
||||
// 切换tab
|
||||
selTab(tab) {
|
||||
console.log(tab)
|
||||
this.tabCur = tab.title;
|
||||
this.liveStatus = tab.code;
|
||||
this.liveList = [];
|
||||
this.loaded=false;
|
||||
this.loading=false;
|
||||
this.getLiveListTab();
|
||||
},
|
||||
|
||||
// 直播列表
|
||||
getLiveListTab() {
|
||||
let that = this;
|
||||
yxWechatLive({
|
||||
liveStatus: that.liveStatus,
|
||||
page: 0,
|
||||
size: that.size
|
||||
}).then(res => {
|
||||
that.liveList = [...that.liveList, ...res.data.content];
|
||||
that.lastPage = res.data.lastPage;
|
||||
this.loaded = res.data.content.length < that.size;
|
||||
this.loading = false;
|
||||
});
|
||||
},
|
||||
// 直播列表
|
||||
getLiveList() {
|
||||
let that = this;
|
||||
if (this.loading || this.loaded) return;
|
||||
this.loading = true;
|
||||
yxWechatLive({
|
||||
liveStatus: this.liveStatus,
|
||||
page: this.currentPage,
|
||||
size: this.size
|
||||
}).then(res => {
|
||||
that.liveList = that.liveList.concat(res.data.content)
|
||||
this.currentPage++;
|
||||
this.loaded = res.data.content.length < that.size;
|
||||
this.loading = false;
|
||||
});
|
||||
}
|
||||
},
|
||||
onReachBottom() {
|
||||
!this.loading && this.getLiveList();
|
||||
}
|
||||
};
|
||||
</script>
|
||||
|
||||
<style lang="scss">
|
||||
// tab
|
||||
.live-tab {
|
||||
width: 100%;
|
||||
height: 96rpx;
|
||||
background: #fff;
|
||||
display: flex;
|
||||
align-items: center;
|
||||
|
||||
&__item {
|
||||
flex: 1;
|
||||
height: 100%;
|
||||
display: flex;
|
||||
flex-direction: column;
|
||||
justify-content: space-between;
|
||||
align-items: center;
|
||||
}
|
||||
|
||||
&__item-name {
|
||||
font-size: 28rpx;
|
||||
font-family: PingFang SC;
|
||||
font-weight: bold;
|
||||
color: rgba(51, 51, 51, 1);
|
||||
flex: 1;
|
||||
display: flex;
|
||||
justify-content: center;
|
||||
align-items: center;
|
||||
}
|
||||
|
||||
&__item--link {
|
||||
width: 68rpx;
|
||||
height: 4rpx;
|
||||
background: transparent;
|
||||
border-radius: 2rpx;
|
||||
}
|
||||
|
||||
&__item--active {
|
||||
width: 68rpx;
|
||||
height: 4rpx;
|
||||
background: rgba(213, 166, 90, 1);
|
||||
border-radius: 2rpx;
|
||||
}
|
||||
}
|
||||
|
||||
// 瀑布流 list
|
||||
.scroll-box {
|
||||
.list-box {
|
||||
width: 100%;
|
||||
-moz-column-count: 2;
|
||||
-webkit-column-count: 2;
|
||||
column-count: 2;
|
||||
padding: 25rpx;
|
||||
}
|
||||
}
|
||||
</style>
|
||||
|
@ -8,7 +8,7 @@
|
||||
<view>总资产(元)</view>
|
||||
<view class="money">{{ now_money }}</view>
|
||||
</view>
|
||||
<navigator url="/pages/user/Recharge/index" class="recharge font-color-red">充值</navigator>
|
||||
<navigator url="/pages/user/Recharge/index" class="recharge font-color-red" v-if="is_hide=='0'">充值</navigator>
|
||||
</view>
|
||||
<view class="cumulative acea-row row-top">
|
||||
<view class="item">
|
||||
@ -31,7 +31,7 @@
|
||||
</view>
|
||||
<view>消费记录</view>
|
||||
</view>
|
||||
<view class="item" @click="goUserBill(2)">
|
||||
<view class="item" @click="goUserBill(2)" v-if="is_hide=='0'">
|
||||
<view class="pictrue">
|
||||
<image src="@/static/images/record3.png" />
|
||||
</view>
|
||||
@ -54,6 +54,7 @@ export default {
|
||||
props: {},
|
||||
data: function() {
|
||||
return {
|
||||
is_hide: "1",
|
||||
now_money: 0,
|
||||
orderStatusSum: 0,
|
||||
recharge: 0,
|
||||
@ -82,6 +83,7 @@ export default {
|
||||
that.now_money = res.data.now_money;
|
||||
that.orderStatusSum = res.data.orderStatusSum;
|
||||
that.recharge = res.data.recharge;
|
||||
this.is_hide = res.data.is_hide;
|
||||
},
|
||||
err => {
|
||||
uni.showToast({
|
||||
|
Reference in New Issue
Block a user