全新UI视觉体验,移动端API优化降低重复调用,提高并发6倍,修复N多Bug

This commit is contained in:
stivepeim
2021-06-11 17:41:16 +08:00
parent 52feaa504e
commit 41b6ff8232
582 changed files with 35633 additions and 28276 deletions

View File

@@ -1,23 +1,29 @@
<template>
<view>
<view style="height: 100%;">
<view class='evaluate-list'>
<view class='generalComment acea-row row-between-wrapper'>
<view class='acea-row row-middle font-color'>
<view class='evaluate'>评分</view>
<view class='start' :class="'star'+ (replyData.sumCount===0?'3':Math.round(replyData.replyStar/replyData.sumCount))"></view>
<view class='start'
:class="'star'+ (replyData.sumCount===0?'3':Math.round(replyData.replyStar/replyData.sumCount))">
</view>
</view>
<view><text class='font-color'>{{(replyData.replyChance)*100}}%</text>好评率</view>
</view>
<view class='nav acea-row row-middle'>
<view class='item' :class='type==0 ? "bg-color":""' @click='changeType(0)'>全部({{replyData.sumCount}})</view>
<view class='item' :class='type==1 ? "bg-color":""' @click='changeType(1)'>好评({{replyData.goodCount}})</view>
<view class='item' :class='type==2 ? "bg-color":""' @click='changeType(2)'>({{replyData.inCount}})</view>
<view class='item' :class='type==3 ? "bg-color":""' @click='changeType(3)'>差评({{replyData.poorCount}})</view>
<view class='item' :class='type==0 ? "bg-color":""' @click='changeType(0)'>全部({{replyData.sumCount}})
</view>
<view class='item' :class='type==1 ? "bg-color":""' @click='changeType(1)'>({{replyData.goodCount}})
</view>
<view class='item' :class='type==2 ? "bg-color":""' @click='changeType(2)'>中评({{replyData.inCount}})
</view>
<view class='item' :class='type==3 ? "bg-color":""' @click='changeType(3)'>差评({{replyData.poorCount}})
</view>
</view>
<userEvaluation :reply="reply"></userEvaluation>
<view class='loadingicon acea-row row-center-wrapper'>
<text class='loading iconfont icon-jiazai' :hidden='loading==false'></text>{{loadTitle}}
</view>
</view>
<view class='loadingicon acea-row row-center-wrapper'>
<text class='loading iconfont icon-jiazai' :hidden='loading==false'></text>{{loadTitle}}
</view>
<view class='noCommodity' v-if="!replyData.sumCount && page > 1">
<view class='pictrue'>
@@ -75,7 +81,7 @@
getProductReplyCount: function() {
let that = this;
getReplyConfig(that.productId).then(res => {
that.$set(that,'replyData',res.data);
that.$set(that, 'replyData', res.data);
});
},
/**
@@ -95,16 +101,16 @@
let list = res.data.list,
loadend = list.length < that.limit;
that.reply = that.$util.SplitArray(list, that.reply);
that.$set(that,'reply',that.reply);
that.$set(that, 'reply', that.reply);
that.loading = false;
that.loadend = loadend;
if(that.reply.length){
if (that.reply.length) {
that.loadTitle = loadend ? "😕人家是有底线的~~" : "加载更多";
}
that.page = that.page + 1;
}).catch(err => {
that.loading = false,
that.loadTitle = '加载更多'
that.loadTitle = '加载更多'
});
},
/*
@@ -116,7 +122,7 @@
this.type = type;
this.page = 1;
this.loadend = false;
this.$set(this,'reply',[]);
this.$set(this, 'reply', []);
this.getProductReplyList();
}
},
@@ -130,10 +136,48 @@
</script>
<style lang="scss">
page{background-color:#fff;}
.evaluate-list .generalComment{height:94rpx;padding:0 30rpx;margin-top:1rpx;background-color:#fff;font-size:28rpx;color:#808080;}
.evaluate-list .generalComment .evaluate{margin-right:7rpx;}
.evaluate-list .nav{font-size:24rpx;color:#282828;padding:0 30rpx 32rpx 30rpx;background-color:#fff;border-bottom:1rpx solid #f5f5f5;}
.evaluate-list .nav .item{font-size:24rpx;color:#282828;border-radius:6rpx;height:54rpx;padding:0 20rpx;background-color:#f4f4f4;line-height:54rpx;margin-right:17rpx;}
.evaluate-list .nav .item.bg-color{color:#fff;}
page {
background-color: #fff;
height: 100%;
}
.evaluate-list{
padding: 30rpx 0 0 0;
background-color: #fff;
}
.evaluate-list .generalComment {
padding: 0 30rpx;
margin-top: 1rpx;
background-color: #fff;
font-size: 28rpx;
color: #808080;
}
.evaluate-list .generalComment .evaluate {
margin-right: 7rpx;
color: #333333;
font-size: 28rpx;
}
.evaluate-list .nav {
font-size: 24rpx;
color: #282828;
padding: 30rpx;
background-color: #fff;
border-bottom: 1rpx solid #f5f5f5;
}
.evaluate-list .nav .item {
font-size: 24rpx;
color: #282828;
border-radius: 27rpx;
height: 54rpx;
padding: 0 20rpx;
background-color: #f4f4f4;
line-height: 54rpx;
margin-right: 17rpx;
}
.evaluate-list .nav .item.bg-color {
color: #fff;
}
</style>