This commit is contained in:
Gdpao 2020-08-11 22:15:58 +08:00
parent 20259ddf00
commit ef79718190
11 changed files with 376 additions and 134 deletions

View File

@ -41,6 +41,7 @@
@import "/static/css/normalize";
/* 顶部自定义导航留白 */
.status_bar {
z-index: 1000;
width: 100%;
height: var(--status-bar-height);
}

View File

@ -47,24 +47,30 @@ const install = (Vue, vm) => {
// 假设201为token失效这里跳转登录
// vm.$u.toast('您还没有登录哦,请先去登录!');
if (res.data.data.action != "memberinfo") {
uni.showModal({
title: "温馨提示",
content: "您还未登录,请立即登录",
cancelText: "以后再说",
confirmText: "立即登录",
confirmColor: "#FF780F",
success(res) {
// console.log(res);
if (res.confirm) {
setTimeout(() => {
// 此为uView的方法详见路由相关文档
vm.$u.route('/pageA/login/login')
}, 500)
}
if (res.cancel) {
}
}
})
setTimeout(() => {
// 此为uView的方法详见路由相关文档
uni.navigateTo({
url: "/pageA/login/login",
})
}, 1000)
// uni.showModal({
// title: "温馨提示",
// content: "您还未登录,请立即登录",
// cancelText: "以后再说",
// confirmText: "立即登录",
// confirmColor: "#FF780F",
// success(res) {
// // console.log(res);
// if (res.confirm) {
// setTimeout(() => {
// // 此为uView的方法详见路由相关文档
// vm.$u.route('/pageA/login/login')
// }, 500)
// }
// if (res.cancel) {
// }
// }
// })
}
return false;
} else if (res.errCode == 1) {

View File

@ -14,7 +14,7 @@
</swiper-item>
</swiper>
<!-- 加载更多 -->
<u-loadmore :status="loadStatus" bgColor="#FFF" margin-top="20" margin-bottom="20" @loadmore="loadMore"></u-loadmore>
<u-loadmore class="load-size" :status="loadStatus" bgColor="#FFF" margin-top="20" margin-bottom="20" @loadmore="loadMore"></u-loadmore>
</view>
</template>
<script>

View File

@ -1,8 +1,9 @@
<template>
<view class="userinfo">
<view class="userinfo" @click="stopClick()">
<view class="userhead">
<image class="avatar" :src="item.member_avatar"></image>
<text class="follow" @click="following(item.member_id)">{{ is_follow ? "" : "+" }}</text>
<!-- <text class="follow" @click="following(item.member_id)">{{ is_follow ? "" : "+" }}</text> -->
<image class="follow" :src=" !is_follow ? '../../static/image/userinfo/follow.png' : '../../static/image/userinfo/followed.png' " mode="" @click="following(item.member_id)"></image>
</view>
<!-- 点赞 -->
<view class="operat zan">
@ -62,16 +63,10 @@
.follow {
z-index: 100;
position: absolute;
top: 90rpx;
left: 40rpx;
width: 36rpx;
height: 36rpx;
text-align: center;
line-height: 36rpx;
font-size: 34rpx;
border-radius: 50%;
color: #fff;
background-color: #FF780F;
top: 80rpx;
left: 30rpx;
width: 50rpx;
height: 50rpx;
}
.operat {
@ -80,6 +75,7 @@
/* #endif */
align-items: center;
flex-direction: column;
padding: 0 30rpx;
}
.operat-span {
@ -110,7 +106,7 @@
},
watch: {
list(newValue, old) {
console.log(newValue);
// console.log(newValue);
this.item = newValue || {};
this.is_follow = this.list.is_attention || false;
this.is_like = this.list.is_like || false;
@ -152,6 +148,11 @@
title: res.data.message,
icon: "none"
})
} else if (res.data.errCode == 401) {
uni.showToast({
title: "您还没有登录,请先登录!",
icon: "none"
})
}
}
})
@ -174,6 +175,11 @@
// console.log(res);
this.is_like = !this.is_like;
this.list.like_num = res.data.data.num;
} else if (res.data.errCode == 401) {
uni.showToast({
title: "您还没有登录,请先登录!",
icon: "none"
})
} else {
uni.showToast({
title: res.data.message,
@ -200,6 +206,11 @@
console.log(res.data.num);
this.is_collect = !this.is_collect;
this.list.collect_num = res.data.data.num;
} else if (res.data.errCode == 401) {
uni.showToast({
title: "您还没有登录,请先登录!",
icon: "none"
})
} else {
uni.showToast({
title: res.data.message,
@ -227,6 +238,9 @@
cart: this.is_cart
});
},
//
stopClick() {
}
}
}
</script>

View File

@ -19,7 +19,7 @@
<view class="box">
<videoItem v-for="item in listInfo" :key="item.article_id" :item="item"
@getArticlelist="getArticlelist"></videoItem>
<view class="no-data" v-show="!listInfo && !page">暂无数据</view>
<view class="no-data" v-show="!listInfo && page">暂无数据</view>
</view>
</scroll-view>
</view>
@ -74,7 +74,7 @@ export default {
userInfo: {}, //
listInfo: [], //
member_id: 0,
page: 0,
page: 1,
}
},
onLoad(option) {

View File

@ -81,7 +81,6 @@
<image :src="item.goods_image" mode="aspectFill"></image>
<view>
<text class="title">{{ item.goods_advword }}</text>
<text class="name">{{ item.goods_name }}</text>
<text class="price">{{ item.goods_promotion_price }}</text>
</view>
</view>
@ -330,7 +329,7 @@
& > view {
display: flex;
flex-direction: column;
justify-content: space-between;
justify-content: space-around;
color: #333;
font-size: 28rpx;
.title {

View File

@ -1,18 +1,17 @@
<template>
<view>
<video id="videoId" :style="videoSize" :src="src" autoplay="true" :show-fullscreen-btn="false" @play="playing"
@timeupdate="timeupdate" :show-play-btn="false" controls="false" @click="stoping" :enable-progress-gesture="false"></video>
<cover-image class="close" @click="goBack" src="../../static/close.png">
</cover-image>
<cover-image class="pause" @click="stoping" src="../../static/videoPlay.png" v-if="!is_play">
</cover-image>
@pause="pausing" @ended="videoEnd" @timeupdate="timeupdate" :show-play-btn="false" controls="false" @click="stoping"
:enable-progress-gesture="false" :show-center-play-btn="false"></video>
<!-- 用户操作 -->
<userinfo class="user-info" :list="list" :cart="cart_type" :comment="is_comment" :num="comment_num" @openCart="openPopup"></userinfo>
<cover-view class="info-box" @click="stopClick">>
<userinfo class="user-info" :style="{ top: fixTop }" :list="list" :cart="cart_type" :comment="is_comment" :num="comment_num"
@openCart="openPopup"></userinfo>
<!-- 视频信息 -->
<cover-view class="info-box" @click="stopClick">
<view class="video-info-box">
<image class="image-play" src="../../static/videoIcon.png" mode=""></image>
<text class="video-slip">视频</text>
<text class="time">{{ time_count == 1 ? 0 : time_count }}s</text>
<text class="time">{{ time_count }}s</text>
</view>
<view>
<text class="name">@{{ list.member_nickname }}</text>
@ -29,40 +28,81 @@
</block>
</view>
</cover-view>
<cover-view class="content-box" v-if="is_comment">
<view class="content-title">
<text class="tips">评论</text>
<text class="close-down" @click="closeComment">×</text>
<!-- 单个商品 -->
<cover-view class="good-one" v-if="cart_len == 1">
<view class="one-list" v-for="(item,index) in list.goods" :key="index">
<image class="one-image" :src="item.goods_image" mode=""></image>
<view class="one-box">
<view class="title-one">{{ item.goods_advword }}</view>
<view class="content-one">{{ item.goods_name }}</view>
<view class="good-price">¥{{ item.goods_promotion_price }}</view>
</view>
</view>
<scroller class="comment-list">
<view class="" v-for="(item,index) in commentList" :key="index">
<view class="comment-list-box">
<view class="comment-list-header">
<image class="avatar" :src="item.member_avatar" mode=""></image>
<view>
<text class="comment-title">{{ item.member_nickname }}</text>
<text class="comment-time">{{ item.create_time }}</text>
</cover-view>
<!-- 遮罩层 -->
<cover-view class="mask" @click.stop="stopClick" :style="videoSize" v-if="is_comment || cart_type">
<!-- 评论 -->
<cover-view class="content-box" v-if="is_comment" ref="contentBox">
<view class="content-title">
<text class="tips">评论</text>
<text class="close-down" @click="closeComment">×</text>
</view>
<scroller class="comment-list">
<view class="" v-for="(item,index) in commentList" :key="index">
<view class="comment-list-box">
<view class="comment-list-header">
<image class="avatar" :src="item.member_avatar" mode=""></image>
<view>
<text class="comment-title">{{ item.member_nickname }}</text>
<text class="comment-time">{{ item.create_time }}</text>
</view>
</view>
<text class="reply">回复</text>
</view>
<view class="content-main">
<text class="content-style">{{ item.content }}</text>
</view>
</view>
<view class="send-box">
<input class="send-val" type="text" value="" />
<text class="btn-send">发送</text>
</view>
<loading class="loading" @loading="onloading" :display="loadinging ? 'show' : 'hide'">
<loading-indicator class="indicator"></loading-indicator>
<text class="indicator-text">努力加载中</text>
</loading>
</scroller>
</cover-view>
<!-- 购物车 -->
<cover-view class="cart-box" v-if="cart_type">
<view class="cart-title">
<text class="tips">全部商品</text>
<text class="close-down" @click="cart_type = false">×</text>
</view>
<scroller class="cart-list">
<view class="" v-for="(item,index) in list.goods" :key="index">
<view class="cart-list-header" @click="goGoodInfo(item.goods_id)">
<image class="goods-img" :src="item.goods_image" mode=""></image>
<view class="goods-info">
<text class="good-title">{{ item.goods_advword }}</text>
<text class="good-price">{{ item.goods_promotion_price }}</text>
</view>
</view>
<text class="reply">回复</text>
</view>
<view class="content-main">
<text class="content-style">{{ item.content }}</text>
</view>
</view>
<view class="send-box">
<input class="send-val" type="text" value="" />
<text class="btn-send">发送</text>
</view>
<loading class="loading" @loading="onloading" :display="loadinging ? 'show' : 'hide'">
<loading-indicator class="indicator"></loading-indicator>
<text class="indicator-text">努力加载中</text>
</loading>
</scroller>
<loading class="loading" @loading="onloading" :display="loadinging ? 'show' : 'hide'">
<loading-indicator class="indicator"></loading-indicator>
<text class="indicator-text">努力加载中</text>
</loading>
</scroller>
</cover-view>
</cover-view>
<list class="cart-box">
<cell></cell>
</list>
<!-- 返回按钮 -->
<cover-image class="close" @click="goBack" src="../../static/close.png">
</cover-image>
<!-- 暂停按钮 -->
<cover-image class="pause" :style="{ top: fixTop + 100 }" @click="stoping" src="../../static/videoPlay.png"
v-if="!is_play">
</cover-image>
</view>
</template>
@ -76,6 +116,7 @@
data() {
return {
videoSize: {},
fixTop: 0,
list: {},
labelLen: [],
cart_type: false, // 显示购物车
@ -98,7 +139,22 @@
onReady() {
this.videoBox = uni.createVideoContext("videoId", this);
},
onBackPress() {
if (this.cart_type) {
this.cart_type = !this.cart_type;
} else if (this.is_edit) {
this.is_edit = !this.is_edit;
} else if (this.is_comment) {
this.is_comment = !this.is_comment;
} else {
return false;
}
return true;
},
methods: {
moveHandle() {
return false;
},
// 获取信息
getVideoInfo(article_id) {
uni.request({
@ -113,6 +169,7 @@
success: (res) => {
this.list = res.data.data.info;
this.src = res.data.data.info.video_path;
this.cart_len = res.data.data.info.goods.length;
let item = res.data.data.info.label;
let arr = [];
item.forEach(data => {
@ -139,40 +196,40 @@
},
success: (res) => {
if (res.data.errCode == 0) {
console.log(res.data);
// console.log(res.data);
this.commentList = res.data.data;
}
}
})
},
// 发布评论
sendComment() {
if (this.send_value.length == 0) {
this.$u.toast("内容不能为空!");
return;
}
uni.request({
url: temp_url + "article/articleAddComment",
method: "POST",
data: {
article_id: this.article_id,
content: this.send_value,
pid: this.pid,
reply_id: this.reply_id,
},
success: (res) => {
if (res.data.errCode == 0) {
this.send_value = "";
this.comment_num = res.data.num;
console.log(res.data);
} else {
uni.showToast({
title: res.data.message,
icon: "none"
})
}
}
})
sendComment() {
if (this.send_value.length == 0) {
this.$u.toast("内容不能为空!");
return;
}
uni.request({
url: temp_url + "article/articleAddComment",
method: "POST",
data: {
article_id: this.article_id,
content: this.send_value,
pid: this.pid,
reply_id: this.reply_id,
},
success: (res) => {
if (res.data.errCode == 0) {
this.send_value = "";
this.comment_num = res.data.num;
console.log(res.data);
} else {
uni.showToast({
title: res.data.message,
icon: "none"
})
}
}
})
},
// 获取手机信息
getInfo() {
@ -180,8 +237,13 @@
success: (res) => {
this.videoSize = {
width: "750rpx",
height: res.screenHeight + "px"
height: res.screenHeight + "px",
}
this.fixTop = "400rpx";
this.fixTop = res.screenHeight / 3;
// #ifdef H5
this.fixTop = 400 + 'rpx'
// #endif
}
})
},
@ -190,6 +252,19 @@
// console.log(e);
if (e.type == "play") {}
},
pausing(e) {
if (e.type == "pause") {
this.is_play = false;
}
},
// 结束
videoEnd(e) {
// console.log(e);
if (e.type == "ended") {
this.is_play = false;
this.time_count = 0;
}
},
// 暂停
stoping() {
this.is_play = !this.is_play;
@ -202,8 +277,9 @@
// 监听视频
timeupdate(e) {
this.time_count = parseInt(e.detail.duration) - parseInt(e.detail.currentTime);
// console.log(e.detail.currentTime,e.detail.duration);
if (e.detail.duration == e.detail.currentTime) {
this.is_play = false;
// this.is_play = false;
}
// let num = parseInt((e.detail.currentTime/e.detail.duration)*100);
// this.linear = num + "%";
@ -211,17 +287,23 @@
},
// 打开弹窗
openPopup(data) {
console.log(data);
// console.log(data);
this.cart_type = data.cart;
this.is_comment = data.comment;
if (this.is_comment) {
this.page = 0;
this.getComment();
// this.is_play = true;
}
},
// 关闭评论
closeComment() {
this.is_comment = false;
// console.log(this.is_comment,this.is_play);
// if (!this.is_comment && this.is_play) {
// console.log(1);
// this.is_play = false;
// }
},
// 下拉加载
onloading(e) {
@ -231,6 +313,12 @@
this.loadinging = false;
}, 2000)
},
// 跳转
goGoodInfo(id) {
uni.navigateTo({
url: "/pageB/sdetails/index?id=" + id + "&type=" + 1,
})
},
// stop
stopClick(event) {
event.stopPropagation();
@ -248,16 +336,16 @@
/* 关闭 */
.close {
position: fixed;
top: 80rpx;
right: 60rpx;
top: 100rpx;
right: 70rpx;
width: 30rpx;
height: 30rpx;
}
/* 暂停 */
.pause {
z-index: 99;
position: fixed;
top: 600rpx;
left: 330rpx;
width: 100rpx;
height: 100rpx;
@ -266,7 +354,6 @@
/* 用户操作 */
.user-info {
position: fixed;
top: 360rpx;
right: 30rpx;
}
@ -289,6 +376,53 @@
border-radius: 10rpx;
background-color: rgba(255, 255, 255, .6);
}
.good-one {
position: absolute;
bottom: 300rpx;
right: 100rpx;
width: 450rpx;
padding: 20rpx;
border-radius: 10rpx;
background-color: rgba(0,0,0,0.6);
}
.one-list {
flex-direction: row;
}
.one-image {
width: 160rpx;
height: 160rpx;
margin-right: 20rpx;
border-radius: 4rpx;
}
.one-box {
justify-content: space-between;
}
.title-one {
width: 100rpx;
font-size: 28rpx;
color: #fff;
lines: 1;
}
.content-one {
width: 100rpx;
font-size: 24rpx;
color: #fff;
lines: 2;
}
.mask {
z-index: 999999;
position: fixed;
top: 0;
left: 0;
background-color: rgba(0, 0, 0, 0.5);
}
.content-box {
z-index: 99;
@ -320,19 +454,19 @@
align-items: center;
justify-content: space-between;
}
.content-main {
flex-direction: row;
padding-left: 100rpx;
}
.content-style {
width: 600rpx;
font-size: 26rpx;
color: #333;
lines: 2;
}
.comment-list-header {
flex-direction: row;
}
@ -360,6 +494,7 @@
font-weight: 500;
color: #333;
}
.send-box {
z-index: 10000;
position: fixed;
@ -375,24 +510,77 @@
border-color: #ececec;
background-color: #fff;
}
.send-val {
width: 600rpx;
height: 88rpx;
font-size: 36rpx;
}
.btn-send {
font-size: 30rpx;
color: #303133;
}
.close-down {
padding: 10rpx;
font-size: 50rpx;
text-align: center;
color: #333;
}
.cart-box {
z-index: 99;
position: fixed;
bottom: 0;
left: 0;
width: 750rpx;
height: 700rpx;
background-color: #fff;
}
.cart-title {
flex-direction: row;
align-items: center;
justify-content: space-between;
height: 88rpx;
padding: 0 20rpx;
border-color: #f2f2f2;
border-bottom-width: 1rpx;
background-color: #fff;
}
.cart-list {
}
.cart-list-header {
padding: 20rpx;
flex-direction: row;
border-bottom-width: 1rpx;
border-bottom-color: #ececec;
}
.goods-img {
width: 160rpx;
height: 160rpx;
margin-right: 10rpx;
}
.goods-info {
justify-content: space-around;
}
.good-title {
color: #333;
font-size: 30rpx;
}
.good-price {
font-size: 28rpx;
color: #FF3131;
}
.image-play {
width: 22rpx;
height: 20rpx;

View File

@ -57,8 +57,7 @@
"navigationBarTitleText": "",
"navigationStyle": "custom",
"app-plus": {
"titleNView": false,
"animationType": "slide-in-bottom"
"titleNView": false
}
}
},
@ -105,7 +104,10 @@
{
"path" : "video/video",
"style" : {
"navigationStyle":"custom"
"navigationStyle":"custom",
"app-plus": {
"softinputMode": "adjustResize"
}
}
},
{

View File

@ -1,7 +1,7 @@
<template>
<view>
<view class="status_bar"></view>
<view class="index">
<view class="index" @touchmove.stop.prevent="moveHandle">
<view class="top">
<view class="sosuo" @click="goSearch">
<u-icon name="search" color="#555" size="34rpx"></u-icon>
@ -20,7 +20,7 @@
</view>
<swiper class="card" @change="dianji" :current="num">
<swiper-item>
<scroll-view style="width:100%;height:100%" scroll-y="true" lower-threshold="200" @scrolltolower="swiperBottom">
<scroll-view style="width:100%;height:100%" scroll-y="true" lower-threshold="200" upper-threshold="100" @scrolltolower="swiperBottom" @scrolltoupper="swiperTop">
<view class="box">
<!-- <indexad style="width:690rpx"></indexad> -->
<u-swiper mode="dot" :list="indexImageSwiper" name="adv_code" @click="clickFImage"></u-swiper>
@ -98,17 +98,24 @@
</template>
<style lang="scss" scoped>
page {
background-color: #fff;
}
.index {
width: 750rpx;
display: flex;
flex-direction: column;
height: 100vh;
/* #ifdef APP-PLUS */
padding-bottom: 100rpx;
padding-bottom: 88rpx;
/* #endif */
overflow: hidden;
.top {
z-index: 10000;
position: fixed;
top: var(--status-bar-height);
left: 0;
display: flex;
flex-shrink: 0;
align-items: center;
@ -116,6 +123,7 @@
width: 100%;
height: 88rpx;
padding: 0 30rpx;
background-color: #fff;
.sosuo {
width: 32rpx;
@ -133,8 +141,9 @@
}
.card {
height: 100%;
width: 100%;
height: 100%;
margin-top: 88rpx;
// pointer-events: none;
.box {
@ -145,6 +154,8 @@
.list {
display: flex;
padding-bottom: 50rpx;
margin-bottom: 50rpx;
}
}
@ -271,7 +282,7 @@
name: '关注'
}],
num: 0,
page: 0, // 0
page: 1, // 0
follow_page: 0, //
articleList: [],
recommendList: [], //
@ -298,12 +309,18 @@
darenItem
},
onShow() {
this.articleList = [];
this.page = 0;
this.getArticlelist();
this.getSwiper();
this.page = 1;
if (this.page != 1) {
this.articleList = [];
}
this.getArticlelist();
if (this.hasLogin) {
this.isNewmembervoucher();
}
},
onLoad(){
this.getSwiper();
//
if(this.$store.state.hasLogin){
this.isNewmembervoucher();
const user = uni.getStorageSync('user_info');
@ -322,10 +339,14 @@
}
},
onPullDownRefresh() {
this.page = 1;
this.getArticlelist();
// this.getManicureList({ load: 'reload' });
},
methods: {
moveHandle() {
return;
},
//
tabLiveList() {
this.$u.api.tabLiveList().then((res) => {
@ -372,7 +393,8 @@
//
if (a.type == "change") { //
if (this.num == 0) {
this.page = 0;
this.page = 1;
this.articleList = [];
this.status = "loadmore";
this.getArticlelist();
this.getSwiper();
@ -391,23 +413,30 @@
},
//
getArticlelist() {
uni.showLoading({
title: "loading..."
})
this.$u.api.getArticlelist({
page: this.page,
is_video_img: 0, // 1 2 0
}).then(res => {
// uni.stopPullDownRefresh();
this.status = "loading";
if (res.errCode == 0) {
// uni.stopPullDownRefresh();
// console.log('37647744ghj', res)
if (this.page == 0) {
uni.hideLoading();
if (this.page == 1) {
this.articleList = res.data.list;
this.status = "loadmore";
} else if (res.data.length == 0 && this.page > 0) {
} else if (res.data.length == 0 && this.page > 1) {
this.status = "nomore";
} else {
this.articleList = this.articleList.concat(res.data.list);
}
this.page++;
if (res.data.length == 0 && this.page > 1) {
console.log(111);
} else {
this.page++;
}
} else {
this.status = "nomore"
}
@ -415,8 +444,7 @@
},
//
updateList() {
console.log(111);
this.page = 0;
this.page = 1;
this.getArticlelist();
},
//
@ -424,6 +452,10 @@
this.getArticlelist();
// console.log(e);
},
swiperTop() {
// uni.startPullDownRefresh();
},
//
followBotton(e) {
this.getFollowList();
// console.log(e);

Binary file not shown.

After

Width:  |  Height:  |  Size: 1.3 KiB

Binary file not shown.

After

Width:  |  Height:  |  Size: 1.5 KiB