gdpao
This commit is contained in:
Gdpao
@@ -1,162 +1,231 @@
|
||||
<template>
|
||||
<view class="userinfo">
|
||||
<view class="userhead">
|
||||
<image :src="item.member_avatar"></image>
|
||||
<text class="follow" v-if="!is_follow" @click="following(item.member_id)">+</text>
|
||||
<u-icon v-else name="checkmark" color="#ffffff" :size="28" class="follow" @click="following(item.member_id)"></u-icon>
|
||||
<image class="avatar" :src="item.member_avatar"></image>
|
||||
<text class="follow" @click="following(item.member_id)">{{ is_follow ? "✓" : "+" }}</text>
|
||||
</view>
|
||||
<!-- 点赞 -->
|
||||
<!-- 点赞 -->
|
||||
<view class="operat zan">
|
||||
<u-icon name="thumb-up-fill" :color=" is_like ? '#FF7807' : '#ffffff' " :size="50" @click="likeType(item.article_id)"></u-icon>
|
||||
<text>{{item.like_num}}</text>
|
||||
<image class="operat-img" :src=" is_like ? '../../static/image/userinfo/dianzan1.png' : '../../static/image/userinfo/dianzan.png' "
|
||||
mode="" @click="likeType(item.article_id)"></image>
|
||||
<text class="operat-span">{{item.like_num}}</text>
|
||||
</view>
|
||||
<!-- 收藏 -->
|
||||
<!-- 收藏 -->
|
||||
<view class="operat shoucang">
|
||||
<u-icon name="star-fill" :color=" is_collect ? '#FF7807' : '#ffffff' " :size="50" @click="collecting(item.article_id)"></u-icon>
|
||||
<text>{{item.collect_num}}</text>
|
||||
<image class="operat-img" :src=" is_collect ? '../../static/image/userinfo/shoucang1.png' : '../../static/image/userinfo/shoucang.png' "
|
||||
mode="" @click="collecting(item.article_id)"></image>
|
||||
<text class="operat-span">{{item.collect_num}}</text>
|
||||
</view>
|
||||
<!-- 评论 -->
|
||||
<!-- 评论 -->
|
||||
<view class="operat pinglun">
|
||||
<u-icon name="more-circle-fill" :color=" is_content ? '#FF7807' : '#ffffff' " :size="50" @click="editing()"></u-icon>
|
||||
<text>{{ comment_num }}</text>
|
||||
<image class="operat-img" :src=" is_content ? '../../static/image/userinfo/pinglun1.png' : '../../static/image/userinfo/pinglun.png' "
|
||||
mode="" @click="editing(item.article_id)"></image>
|
||||
<text class="operat-span">{{ comment_num }}</text>
|
||||
</view>
|
||||
<!-- 购物车 -->
|
||||
<!-- 购物车 -->
|
||||
<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>
|
||||
</template>
|
||||
<style lang="scss" scoped>
|
||||
.userinfo{
|
||||
width: 110rpx;
|
||||
height: 570rpx;
|
||||
display: flex;
|
||||
flex-direction: column;
|
||||
justify-content: space-between;
|
||||
align-items: center;
|
||||
.userhead{
|
||||
position: relative;
|
||||
.userinfo {
|
||||
width: 110rpx;
|
||||
height: 570rpx;
|
||||
/* #ifndef APP-PLUS-NVUE */
|
||||
display: flex;
|
||||
/* #endif */
|
||||
flex-direction: column;
|
||||
justify-content: space-between;
|
||||
align-items: center;
|
||||
}
|
||||
|
||||
.userhead {
|
||||
position: relative;
|
||||
/* #ifndef APP-PLUS-NVUE */
|
||||
display: flex;
|
||||
/* #endif */
|
||||
position: relative;
|
||||
align-items: center;
|
||||
&>image{
|
||||
width: 110rpx;
|
||||
height: 110rpx;
|
||||
border-radius: 50%;
|
||||
border: 2rpx solid #fff;
|
||||
}
|
||||
.follow {
|
||||
position: absolute;
|
||||
top: 90rpx;
|
||||
left: 35%;
|
||||
width: 36rpx;
|
||||
height: 36rpx;
|
||||
text-align: center;
|
||||
line-height: 36rpx;
|
||||
font-size: 36rpx;
|
||||
border-radius: 50%;
|
||||
color: #fff;
|
||||
background-color: #FF780F;
|
||||
}
|
||||
}
|
||||
.operat {
|
||||
display: flex;
|
||||
align-items: center;
|
||||
flex-direction: column;
|
||||
& > text {
|
||||
margin-top: 10rpx;
|
||||
font-size: 28rpx;
|
||||
color: #fff;
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
.avatar {
|
||||
width: 110rpx;
|
||||
height: 110rpx;
|
||||
border-radius: 50%;
|
||||
/* #ifndef APP-PLUS-NVUE */
|
||||
border: 2rpx solid #fff;
|
||||
/* #endif */
|
||||
}
|
||||
|
||||
.follow {
|
||||
position: absolute;
|
||||
top: 90rpx;
|
||||
left: 40rpx;
|
||||
width: 36rpx;
|
||||
height: 36rpx;
|
||||
text-align: center;
|
||||
line-height: 36rpx;
|
||||
font-size: 36rpx;
|
||||
border-radius: 50%;
|
||||
color: #fff;
|
||||
background-color: #FF780F;
|
||||
}
|
||||
|
||||
.operat {
|
||||
/* #ifndef APP-PLUS-NVUE */
|
||||
display: flex;
|
||||
/* #endif */
|
||||
align-items: center;
|
||||
flex-direction: column;
|
||||
}
|
||||
|
||||
.operat-span {
|
||||
margin-top: 10rpx;
|
||||
font-size: 28rpx;
|
||||
color: #fff;
|
||||
}
|
||||
|
||||
.operat-img {
|
||||
width: 50rpx;
|
||||
height: 50rpx;
|
||||
}
|
||||
</style>
|
||||
<script>
|
||||
export default {
|
||||
name:'userinfo',
|
||||
props:['list','cart','comment','num'],
|
||||
data(){
|
||||
return {
|
||||
is_follow: this.list.is_attention || false,
|
||||
is_like: this.list.is_like || false,
|
||||
is_collect: this.list.is_collect || false,
|
||||
is_content: false,
|
||||
is_cart: false,
|
||||
comment_num: this.list.comment_num || 0,
|
||||
item: this.list || {}
|
||||
}
|
||||
},
|
||||
watch: {
|
||||
list(newValue,old) {
|
||||
// console.log(newValue,old);
|
||||
this.item = newValue || {};
|
||||
this.is_follow = this.list.is_attention || false;
|
||||
this.is_like = this.list.is_like || false;
|
||||
this.is_collect = this.list.is_collect || false;
|
||||
this.comment_num = this.list.comment_num || 0;
|
||||
},
|
||||
cart(newValue,old) {
|
||||
// console.log(newValue);
|
||||
this.is_cart = newValue;
|
||||
},
|
||||
comment(newValue,old) {
|
||||
// console.log(newValue,old);
|
||||
this.is_content = newValue;
|
||||
},
|
||||
num(newVal,old) {
|
||||
// console.log(newVal);
|
||||
this.comment_num = newVal;
|
||||
// this.item.comment_num = newVal;
|
||||
export default {
|
||||
name: 'userinfo',
|
||||
props: ['list', 'cart', 'comment', 'num'],
|
||||
data() {
|
||||
return {
|
||||
is_follow: this.list.is_attention || false,
|
||||
is_like: this.list.is_like || false,
|
||||
is_collect: this.list.is_collect || false,
|
||||
is_content: false,
|
||||
is_cart: false,
|
||||
comment_num: this.list.comment_num || 0,
|
||||
item: this.list || {}
|
||||
}
|
||||
},
|
||||
deep: true
|
||||
},
|
||||
methods: {
|
||||
// 关注
|
||||
following(id) {
|
||||
this.$u.api.attentionMember({member_id: id}).then(res => {
|
||||
if (res.errCode == 0) {
|
||||
this.is_follow = !this.is_follow;
|
||||
this.$u.toast(res.message);
|
||||
}
|
||||
})
|
||||
},
|
||||
// 点赞
|
||||
likeType(id) {
|
||||
// console.log(id);
|
||||
this.$u.post("article/articleLike",{article_id: id}).then(res => {
|
||||
if (res.errCode == 0) {
|
||||
// console.log(res);
|
||||
this.is_like = !this.is_like;
|
||||
this.list.like_num = res.data.num;
|
||||
} else {
|
||||
this.$u.toast(res.message);
|
||||
}
|
||||
})
|
||||
},
|
||||
// 收藏
|
||||
collecting(id) {
|
||||
this.$u.post("article/articleCollect",{article_id: id}).then(res => {
|
||||
if (res.errCode == 0) {
|
||||
// console.log(res);
|
||||
this.is_collect = !this.is_collect;
|
||||
this.list.collect_num = res.data.num;
|
||||
} else {
|
||||
this.$u.toast(res.message);
|
||||
}
|
||||
})
|
||||
},
|
||||
// 评论
|
||||
editing() {
|
||||
this.is_content = !this.is_content;
|
||||
// console.log(this.is_content);
|
||||
this.$emit("openCart",{ comment: this.is_content, cart: this.is_cart});
|
||||
},
|
||||
// 购物车
|
||||
carting() {
|
||||
this.is_cart = !this.is_cart;
|
||||
// console.log(this.is_cart);
|
||||
this.$emit("openCart",{ comment: this.is_content, cart: this.is_cart});
|
||||
},
|
||||
}
|
||||
}
|
||||
</script>
|
||||
watch: {
|
||||
list(newValue, old) {
|
||||
console.log(newValue);
|
||||
this.item = newValue || {};
|
||||
this.is_follow = this.list.is_attention || false;
|
||||
this.is_like = this.list.is_like || false;
|
||||
this.is_collect = this.list.is_collect || false;
|
||||
this.comment_num = this.list.comment_num || 0;
|
||||
},
|
||||
cart(newValue, old) {
|
||||
// console.log(newValue);
|
||||
this.is_cart = newValue;
|
||||
},
|
||||
comment(newValue, old) {
|
||||
// console.log(newValue,old);
|
||||
this.is_content = newValue;
|
||||
},
|
||||
num(newVal, old) {
|
||||
// console.log(newVal);
|
||||
this.comment_num = newVal;
|
||||
// this.item.comment_num = newVal;
|
||||
},
|
||||
deep: true
|
||||
},
|
||||
methods: {
|
||||
// 关注
|
||||
following(id) {
|
||||
uni.request({
|
||||
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;
|
||||
console.log(this.is_follow);
|
||||
uni.showToast({
|
||||
title: res.data.data.message,
|
||||
icon: "none"
|
||||
})
|
||||
}
|
||||
}
|
||||
})
|
||||
},
|
||||
// 点赞
|
||||
likeType(id) {
|
||||
// console.log(id);
|
||||
uni.request({
|
||||
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);
|
||||
this.is_like = !this.is_like;
|
||||
this.list.like_num = res.data.data.num;
|
||||
} else {
|
||||
uni.showToast({
|
||||
title: res.data.message,
|
||||
icon: "none"
|
||||
})
|
||||
}
|
||||
}
|
||||
})
|
||||
},
|
||||
// 收藏
|
||||
collecting(id) {
|
||||
uni.request({
|
||||
url: "https://dmmall.sdbairui.com/api/article/articleCollect",
|
||||
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.list.collect_num = res.data.data.num;
|
||||
} else {
|
||||
uni.showToast({
|
||||
title: res.data.message,
|
||||
icon: "none"
|
||||
})
|
||||
}
|
||||
}
|
||||
})
|
||||
},
|
||||
// 评论
|
||||
editing() {
|
||||
this.is_content = !this.is_content;
|
||||
// console.log(this.is_content);
|
||||
this.$emit("openCart", {
|
||||
comment: this.is_content,
|
||||
cart: this.is_cart
|
||||
});
|
||||
},
|
||||
// 购物车
|
||||
carting() {
|
||||
this.is_cart = !this.is_cart;
|
||||
// console.log(this.is_cart);
|
||||
this.$emit("openCart", {
|
||||
comment: this.is_content,
|
||||
cart: this.is_cart
|
||||
});
|
||||
},
|
||||
}
|
||||
}
|
||||
</script>
|
||||
|
||||
Reference in New Issue
Block a user