This commit is contained in:
Gdpao 2020-08-09 19:08:12 +08:00
parent 097f7e3cba
commit 234f11eeef
22 changed files with 306 additions and 223 deletions

View File

@ -43,6 +43,12 @@
.status_bar { .status_bar {
width: 100%; width: 100%;
height: var(--status-bar-height); height: var(--status-bar-height);
}
/* 自定义下拉 */
.load-size {
::v-deep.u-more-text {
font-size: 20rpx !important;
}
} }
/* #endif */ /* #endif */
</style> </style>

View File

@ -71,7 +71,7 @@
value: '', value: '',
login: '注册', login: '注册',
show: false, show: false,
is_check: null, is_check: true,
member_mobile: '', // member_mobile: '', //
smslog_type : '1',// smslog_type : '1',//
sms_code : '', // sms_code : '', //
@ -104,6 +104,7 @@
}, },
// //
loginIns(){ loginIns(){
console.log(this.is_check);
let me = this; let me = this;
let type_phone = this.$u.test.mobile(this.member_mobile) let type_phone = this.$u.test.mobile(this.member_mobile)
if(this.member_mobile == ''){ if(this.member_mobile == ''){
@ -124,7 +125,7 @@
}) })
return false; return false;
} }
if (this.is_check) { if (!this.is_check) {
this.$refs.uToast.show({ this.$refs.uToast.show({
title: '请同意协议!', title: '请同意协议!',
}) })
@ -446,10 +447,6 @@
.pact { .pact {
position: relative; position: relative;
padding-left: 40rpx; padding-left: 40rpx;
overflow: hidden;
// overflow: hidden; //
// text-overflow: ellipsis; //
// white-space: nowrap; //
} }
.phones{ .phones{
margin-bottom: 90rpx!important; margin-bottom: 90rpx!important;

View File

@ -1,22 +0,0 @@
<template>
<view>
</view>
</template>
<script>
export default {
data() {
return {
}
},
methods: {
}
}
</script>
<style>
</style>

View File

@ -1,28 +1,31 @@
<template> <template>
<view class="userinfo"> <view class="userinfo">
<view class="userhead"> <view class="userhead">
<image :src="item.member_avatar"></image> <image class="avatar" :src="item.member_avatar"></image>
<text class="follow" v-if="!is_follow" @click="following(item.member_id)">+</text> <text class="follow" @click="following(item.member_id)">{{ is_follow ? "" : "+" }}</text>
<u-icon v-else name="checkmark" color="#ffffff" :size="28" class="follow" @click="following(item.member_id)"></u-icon>
</view> </view>
<!-- 点赞 --> <!-- 点赞 -->
<view class="operat zan"> <view class="operat zan">
<u-icon name="thumb-up-fill" :color=" is_like ? '#FF7807' : '#ffffff' " :size="50" @click="likeType(item.article_id)"></u-icon> <image class="operat-img" :src=" is_like ? '../../static/image/userinfo/dianzan1.png' : '../../static/image/userinfo/dianzan.png' "
<text>{{item.like_num}}</text> mode="" @click="likeType(item.article_id)"></image>
<text class="operat-span">{{item.like_num}}</text>
</view> </view>
<!-- 收藏 --> <!-- 收藏 -->
<view class="operat shoucang"> <view class="operat shoucang">
<u-icon name="star-fill" :color=" is_collect ? '#FF7807' : '#ffffff' " :size="50" @click="collecting(item.article_id)"></u-icon> <image class="operat-img" :src=" is_collect ? '../../static/image/userinfo/shoucang1.png' : '../../static/image/userinfo/shoucang.png' "
<text>{{item.collect_num}}</text> mode="" @click="collecting(item.article_id)"></image>
<text class="operat-span">{{item.collect_num}}</text>
</view> </view>
<!-- 评论 --> <!-- 评论 -->
<view class="operat pinglun"> <view class="operat pinglun">
<u-icon name="more-circle-fill" :color=" is_content ? '#FF7807' : '#ffffff' " :size="50" @click="editing()"></u-icon> <image class="operat-img" :src=" is_content ? '../../static/image/userinfo/pinglun1.png' : '../../static/image/userinfo/pinglun.png' "
<text>{{ comment_num }}</text> mode="" @click="editing(item.article_id)"></image>
<text class="operat-span">{{ comment_num }}</text>
</view> </view>
<!-- 购物车 --> <!-- 购物车 -->
<view class="operat gouwu"> <view class="operat gouwu">
<u-icon name="shopping-cart-fill" :color=" is_cart ? '#FF7807' : '#ffffff' " :size="50" @click="carting()"></u-icon> <image class="operat-img" :src=" is_cart ? '../../static/image/userinfo/gouwuche1.png' : '../../static/image/userinfo/gouwuche.png' "
mode="" @click="carting()"></image>
</view> </view>
</view> </view>
</template> </template>
@ -30,25 +33,36 @@
.userinfo { .userinfo {
width: 110rpx; width: 110rpx;
height: 570rpx; height: 570rpx;
/* #ifndef APP-PLUS-NVUE */
display: flex; display: flex;
/* #endif */
flex-direction: column; flex-direction: column;
justify-content: space-between; justify-content: space-between;
align-items: center; align-items: center;
}
.userhead { .userhead {
position: relative; position: relative;
/* #ifndef APP-PLUS-NVUE */
display: flex; display: flex;
/* #endif */
position: relative; position: relative;
align-items: center; align-items: center;
&>image{ }
.avatar {
width: 110rpx; width: 110rpx;
height: 110rpx; height: 110rpx;
border-radius: 50%; border-radius: 50%;
/* #ifndef APP-PLUS-NVUE */
border: 2rpx solid #fff; border: 2rpx solid #fff;
/* #endif */
} }
.follow { .follow {
position: absolute; position: absolute;
top: 90rpx; top: 90rpx;
left: 35%; left: 40rpx;
width: 36rpx; width: 36rpx;
height: 36rpx; height: 36rpx;
text-align: center; text-align: center;
@ -58,17 +72,24 @@
color: #fff; color: #fff;
background-color: #FF780F; background-color: #FF780F;
} }
}
.operat { .operat {
/* #ifndef APP-PLUS-NVUE */
display: flex; display: flex;
/* #endif */
align-items: center; align-items: center;
flex-direction: column; flex-direction: column;
& > text { }
.operat-span {
margin-top: 10rpx; margin-top: 10rpx;
font-size: 28rpx; font-size: 28rpx;
color: #fff; color: #fff;
} }
}
.operat-img {
width: 50rpx;
height: 50rpx;
} }
</style> </style>
<script> <script>
@ -88,7 +109,7 @@ export default {
}, },
watch: { watch: {
list(newValue, old) { list(newValue, old) {
// console.log(newValue,old); console.log(newValue);
this.item = newValue || {}; this.item = newValue || {};
this.is_follow = this.list.is_attention || false; this.is_follow = this.list.is_attention || false;
this.is_like = this.list.is_like || false; this.is_like = this.list.is_like || false;
@ -113,35 +134,77 @@ export default {
methods: { methods: {
// //
following(id) { following(id) {
this.$u.api.attentionMember({member_id: id}).then(res => { uni.request({
if (res.errCode == 0) { url: "https://dmmall.sdbairui.com/api/member/attentionMember",
method: "POST",
data: {
member_id: id
},
header: {
Authorization: 'Bearer' + ' ' + uni.getStorageSync('token')
},
success: (res) => {
if (res.data.errCode == 0) {
this.is_follow = !this.is_follow; this.is_follow = !this.is_follow;
this.$u.toast(res.message); console.log(this.is_follow);
uni.showToast({
title: res.data.data.message,
icon: "none"
})
}
} }
}) })
}, },
// //
likeType(id) { likeType(id) {
// console.log(id); // console.log(id);
this.$u.post("article/articleLike",{article_id: id}).then(res => { uni.request({
if (res.errCode == 0) { url: "https://dmmall.sdbairui.com/api/article/articleLike",
method: "POST",
data: {
article_id: id
},
header: {
Authorization: 'Bearer' + ' ' + uni.getStorageSync('token')
},
success: (res) => {
console.log(res);
if (res.data.errCode == 0) {
// console.log(res); // console.log(res);
this.is_like = !this.is_like; this.is_like = !this.is_like;
this.list.like_num = res.data.num; this.list.like_num = res.data.data.num;
} else { } else {
this.$u.toast(res.message); uni.showToast({
title: res.data.message,
icon: "none"
})
}
} }
}) })
}, },
// //
collecting(id) { collecting(id) {
this.$u.post("article/articleCollect",{article_id: id}).then(res => { uni.request({
if (res.errCode == 0) { url: "https://dmmall.sdbairui.com/api/article/articleCollect",
// console.log(res); method: "POST",
data: {
article_id: id
},
header: {
Authorization: 'Bearer' + ' ' + uni.getStorageSync('token')
},
success: (res) => {
console.log(res);
if (res.data.errCode == 0) {
console.log(res.data.num);
this.is_collect = !this.is_collect; this.is_collect = !this.is_collect;
this.list.collect_num = res.data.num; this.list.collect_num = res.data.data.num;
} else { } else {
this.$u.toast(res.message); uni.showToast({
title: res.data.message,
icon: "none"
})
}
} }
}) })
}, },
@ -149,13 +212,19 @@ export default {
editing() { editing() {
this.is_content = !this.is_content; this.is_content = !this.is_content;
// console.log(this.is_content); // console.log(this.is_content);
this.$emit("openCart",{ comment: this.is_content, cart: this.is_cart}); this.$emit("openCart", {
comment: this.is_content,
cart: this.is_cart
});
}, },
// //
carting() { carting() {
this.is_cart = !this.is_cart; this.is_cart = !this.is_cart;
// console.log(this.is_cart); // console.log(this.is_cart);
this.$emit("openCart",{ comment: this.is_content, cart: this.is_cart}); this.$emit("openCart", {
comment: this.is_content,
cart: this.is_cart
});
}, },
} }
} }

View File

@ -56,7 +56,7 @@
</view> </view>
</block> </block>
<view class="no-data" v-if="!commentList.length">还没有评论快来评论吧</view> <view class="no-data" v-if="!commentList.length">还没有评论快来评论吧</view>
<u-loadmore v-else :status="status" icon-type="iconType" margin-top="50" margin-bottom="50" :load-text="loadText" /> <u-loadmore v-else class="load-size" :status="status" size="20" icon-type="iconType" margin-top="50" margin-bottom="50" :load-text="loadText" />
</scroll-view> </scroll-view>
<view class="editing" @touchend.prevent="openKeyInput"> <view class="editing" @touchend.prevent="openKeyInput">
<input type="text" value="" :placeholder="edit_text" disabled="disabled" /> <input type="text" value="" :placeholder="edit_text" disabled="disabled" />
@ -392,7 +392,7 @@
</style> </style>
<script> <script>
import userinfo from "../components/userinfo/index" // import userinfo from "../components/userinfo/index" //
import contentBox from "../components/shpoone/index" // // import contentBox from "../components/shpoone/index" //
// import shoplist from "../components/shoplist/index" // // import shoplist from "../components/shoplist/index" //
export default { export default {

View File

@ -597,7 +597,7 @@ export default {
background-color: #EEEBEE; background-color: #EEEBEE;
.spike-view { .spike-view {
position: absolute; position: absolute;
top: 396rpx; top: 400rpx;
left: 0; left: 0;
width: 100%; width: 100%;
height: 104rpx; height: 104rpx;
@ -1015,13 +1015,13 @@ export default {
} }
} }
.spike-tool { .spike-tool {
z-index: 10076;
display: flex;
position: fixed; position: fixed;
bottom: 0; bottom: 0;
left: 0; left: 0;
width: 100%; width: 100%;
height: 98rpx; height: 100rpx;
display: flex;
z-index: 10076;
background-color: #FFFFFF; background-color: #FFFFFF;
.left { .left {
width: 190rpx; width: 190rpx;
@ -1044,8 +1044,8 @@ export default {
} }
.btn { .btn {
flex: 1; flex: 1;
height: 98rpx; height: 104rpx;
line-height: 98rpx; line-height: 104rpx;
text-align: center; text-align: center;
font-size: 32rpx; font-size: 32rpx;
color: rgba(255,255,255,1); color: rgba(255,255,255,1);

View File

@ -1,16 +1,18 @@
<template> <template>
<view> <view>
<video id="videoId" :style="videoSize" :src="src" autoplay="true" :loop="true" :show-fullscreen-btn="false" @play="playing" <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> :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 class="close" @click="goBack" src="../../static/close.png">
</cover-image> </cover-image>
<cover-view class="" src="../../static/videoPlay.png"> <cover-image class="pause" @click="stoping" src="../../static/videoPlay.png" v-if="!is_play">
</cover-view> </cover-image>
<!-- 用户操作 -->
<userinfo class="user-info" :list="list" :cart="cart_type" :comment="is_comment" :num="comment_num" @openCart="openPopup"></userinfo>
<cover-view class="info-box"> <cover-view class="info-box">
<view class="video-info-box"> <view class="video-info-box">
<image class="image-play" src="../../static/videoPlay.png" mode=""></image> <image class="image-play" src="../../static/videoIcon.png" mode=""></image>
<text class="video-slip">视频</text> <text class="video-slip">视频</text>
<text class="time">{{ time_count }}s</text> <text class="time">{{ time_count == 1 ? 0 : time_count }}s</text>
</view> </view>
<view> <view>
<text class="name">@{{ list.member_nickname }}</text> <text class="name">@{{ list.member_nickname }}</text>
@ -23,7 +25,7 @@
</view> </view>
<view class="label-box"> <view class="label-box">
<block v-for="(item,index) in list.label" :key="index"> <block v-for="(item,index) in list.label" :key="index">
<text class="label" :style="{ width: item.name.length * 40 + 'rpx' }">{{ item.name }}</text> <text class="label" :style="{ width: labelLen[index] * 40 + 'rpx' }">{{ item.name }}</text>
</block> </block>
</view> </view>
</cover-view> </cover-view>
@ -31,22 +33,28 @@
</template> </template>
<script> <script>
import userinfo from "../components/userinfo/index" // 点赞组件
export default { export default {
components:{
userinfo
},
data() { data() {
return { return {
videoSize: {}, videoSize: {},
list: {}, list: {},
labelLen: [],
cart_type: false, // 显示购物车
is_comment: false, // 显示评论
comment_num: 0, // 评论数
src: "", src: "",
is_play: true, is_play: true,
timer: null, time_count: 0,
alltime: 7, linear: null,
time_count: 7,
}; };
}, },
onLoad(option) { onLoad(option) {
this.getVideoInfo(option.id); this.getVideoInfo(option.id);
this.getInfo(); this.getInfo();
this.aaa();
}, },
onReady() { onReady() {
this.videoBox = uni.createVideoContext("videoId", this); this.videoBox = uni.createVideoContext("videoId", this);
@ -60,9 +68,24 @@
data: { data: {
article_id: article_id article_id: article_id
}, },
header: {
Authorization: 'Bearer' + ' ' + uni.getStorageSync('token')
},
success: (res) => { success: (res) => {
this.list = res.data.data.info; this.list = res.data.data.info;
this.src = res.data.data.info.video_path; this.src = res.data.data.info.video_path;
let item = res.data.data.info.label;
let arr = [];
item.forEach(data => {
let str = escape(data.name);
if(str.indexOf('%u')){
// console.log(data.name);
arr.push(Math.floor(data.name.length / 2));
} else {
arr.push(data.name.length);
}
})
this.labelLen = arr;
} }
}) })
}, },
@ -79,11 +102,8 @@
}, },
// 播放 // 播放
playing(e) { playing(e) {
console.log(e); // console.log(e);
if (e.type == "play") { if (e.type == "play") {
this.alltime = 7;
this.time_count = 7;
this.aaa();
} }
}, },
// 暂停 // 暂停
@ -91,24 +111,19 @@
this.is_play = !this.is_play; this.is_play = !this.is_play;
if (this.is_play) { if (this.is_play) {
this.videoBox.play(); this.videoBox.play();
this.aaa();
} else { } else {
this.videoBox.pause(); this.videoBox.pause();
clearInterval(this.timer);
this.temp_time = this.time_count;
console.log(this.temp_time);
} }
}, },
// 倒计时 // 监听视频
aaa() { timeupdate(e) {
this.timer = setInterval(() => { this.time_count = parseInt(e.detail.duration) - parseInt(e.detail.currentTime);
if (this.time_count > 0 && this.time_count <= this.alltime) { if (e.detail.duration == e.detail.currentTime) {
this.time_count--; this.is_play = false;
} else {
clearInterval(this.timer);
this.timer = null;
} }
}, 1000); // let num = parseInt((e.detail.currentTime/e.detail.duration)*100);
// this.linear = num + "%";
// console.log(this.time_count);
}, },
goBack() { goBack() {
uni.navigateBack({ uni.navigateBack({
@ -129,6 +144,22 @@
height: 30rpx; height: 30rpx;
} }
/* 暂停 */
.pause {
position: fixed;
top: 600rpx;
left: 330rpx;
width: 100rpx;
height: 100rpx;
}
/* 用户操作 */
.user-info {
position: fixed;
top: 360rpx;
right: 30rpx;
}
/* 底部信息 */ /* 底部信息 */
.info-box { .info-box {
position: fixed; position: fixed;

View File

@ -33,11 +33,12 @@
fontSize: 24 fontSize: 24
}, },
sheetStatus: false, sheetStatus: false,
list: [{ list: [
text: '换个账号登录', // {
color: '#FF780F', // text: '',
fontSize: 28 // color: '#FF780F',
}, // fontSize: 28
// },
{ {
text: '退出登录', text: '退出登录',
color: '#FF780F', color: '#FF780F',
@ -78,7 +79,7 @@
// 退 0 | 1退 // 退 0 | 1退
choiceOption(index) { choiceOption(index) {
console.log(index); console.log(index);
if (index == 1) { if (index == 0) {
this.show = true; this.show = true;
} }
}, },

View File

@ -3,7 +3,7 @@
<view> <view>
<u-tabs-swiper ref="tabs" :list="list" :is-scroll="false" active-color="#FF780F" :current="current" font-size="32" :show-bar="false" @change="tabsChange" height="88"></u-tabs-swiper> <u-tabs-swiper ref="tabs" :list="list" :is-scroll="false" active-color="#FF780F" :current="current" font-size="32" :show-bar="false" @change="tabsChange" height="88"></u-tabs-swiper>
</view> </view>
<swiper :current="swiperCurrent" @animationfinish="animationfinish" :style="{ minHeight: swiperHeight }"> <swiper :current="swiperCurrent" @animationfinish="animationfinish" class="aaa" :style="{ minHeight: swiperHeight }">
<swiper-item class="swiper-item"> <swiper-item class="swiper-item">
<scroll-view scroll-y="true" style="height: 100%;"> <scroll-view scroll-y="true" style="height: 100%;">
<view class="order-info"> <view class="order-info">
@ -439,7 +439,8 @@ export default {
setViewHeight() { setViewHeight() {
const res = uni.getSystemInfoSync(); const res = uni.getSystemInfoSync();
// this.swiperHeight = res.windowHeight - (88 / 2) + 'px'; // this.swiperHeight = res.windowHeight - (88 / 2) + 'px';
this.swiperHeight = res.windowHeight + 'px'; // this.swiperHeight = res.windowHeight + 500 + 'px';
this.swiperHeight = res.windowHeight - (res.windowWidth / 750) * 88 + 'px';
}, },
confirm(e){ confirm(e){
this.showPopup = false; this.showPopup = false;
@ -467,6 +468,9 @@ export default {
flex: 1; flex: 1;
// height: 95vh; // height: 95vh;
} }
.aaa {
overflow-y: scroll;
}
.order-info { .order-info {
.choose-info{ .choose-info{
display: flex;flex-wrap: wrap; display: flex;flex-wrap: wrap;

View File

@ -1077,10 +1077,6 @@
} }
} }
} }
,{
"path" : "pageB/components/nuserinfo/nuserinfo",
"style" : {}
}
], ],
"tabBar": { "tabBar": {
"color": "#999999", "color": "#999999",

View File

@ -34,7 +34,7 @@
@getArticlelist="getArticlelist"></videoItem> @getArticlelist="getArticlelist"></videoItem>
</view> </view>
</view> </view>
<u-loadmore :status="status" icon-type="iconType" margin-top="50" margin-bottom="50" :load-text="loadText" /> <u-loadmore class="load-size" color="#999999" :status="status" icon-type="iconType" margin-top="50" margin-bottom="50" :load-text="loadText" />
</view> </view>
</scroll-view> </scroll-view>
</swiper-item> </swiper-item>
@ -79,7 +79,7 @@
<videoItem isguanzhu="true" v-for="(item,id) in fansList" :key="id" :item="item"></videoItem> <videoItem isguanzhu="true" v-for="(item,id) in fansList" :key="id" :item="item"></videoItem>
</view> </view>
<view class="no-data" v-if="!fansList.length">您还没有关注哦赶紧去点点关注</view> <view class="no-data" v-if="!fansList.length">您还没有关注哦赶紧去点点关注</view>
<u-loadmore v-else :status="status_1" icon-type="iconType" margin-top="50" margin-bottom="50" :load-text="loadText" /> <u-loadmore class="load-size" v-else :status="status_1" icon-type="iconType" margin-top="50" margin-bottom="50" :load-text="loadText" />
</view> </view>
</view> </view>
</view> </view>
@ -198,6 +198,7 @@
margin: 200rpx auto 0; margin: 200rpx auto 0;
text-align: center; text-align: center;
} }
</style> </style>
<script> <script>
import { mapState } from 'vuex' import { mapState } from 'vuex'

Binary file not shown.

After

Width:  |  Height:  |  Size: 2.7 KiB

Binary file not shown.

After

Width:  |  Height:  |  Size: 3.8 KiB

Binary file not shown.

After

Width:  |  Height:  |  Size: 3.4 KiB

Binary file not shown.

After

Width:  |  Height:  |  Size: 4.9 KiB

Binary file not shown.

After

Width:  |  Height:  |  Size: 3.0 KiB

Binary file not shown.

After

Width:  |  Height:  |  Size: 3.6 KiB

Binary file not shown.

After

Width:  |  Height:  |  Size: 3.2 KiB

Binary file not shown.

After

Width:  |  Height:  |  Size: 4.8 KiB

BIN
static/videoIcon.png Normal file

Binary file not shown.

After

Width:  |  Height:  |  Size: 2.3 KiB

Binary file not shown.

Before

Width:  |  Height:  |  Size: 2.3 KiB

After

Width:  |  Height:  |  Size: 4.7 KiB