auto

common/apiurl.js

@@ -209,6 +209,11 @@ const apiurl = {
 		url: '/order/addGoodsComment',
 		type: 'post'
 	},
+	// 查看订单明细评价
+	getOrderDetailComment: {
+		url: '/order/getOrderDetailComment',
+		type: 'get'
+	},
 	// 订单查询物流
 	getDilevery: {
 		url: '/order/getDilevery',

pages.json

@@ -137,6 +137,20 @@
 						"navigationStyle": "custom"
 					}
 				},
+				{
+					"path": "addcomment",
+					"style": {
+						"navigationBarTitleText": "商品评价",
+						"navigationStyle": "custom"
+					}
+				},
+				{
+					"path": "viewcomment",
+					"style": {
+						"navigationBarTitleText": "商品评价",
+						"navigationStyle": "custom"
+					}
+				},
 				{
 					"path": "comment",
 					"style": {

shopping/addcomment.vue

@@ -0,0 +1,165 @@
+<template>
+	<view class="page-wrap">
+		<u-navbar
+			title="发表评价"
+			:autoBack="true"
+			 :safeAreaInsetTop="true"
+		>
+		</u-navbar>
+		<view class="product u-flex">
+			<u--image :showLoading="true" :src="details.mainImg" width="180rpx" height="180rpx"></u--image>
+			<view class="text">
+				<view class="up">
+					<view class="name ellipsis-2">{{details.goodsName}}</view>
+					<view class="info">
+						<text v-if="details.specification">{{details.specification}}</text>
+						<text v-if="details.unit">{{details.unit}}</text>
+					</view>
+				</view>
+				<!-- <view class="down u-flex u-row-between">
+					<view class="left">
+						<text class="price">¥ <text class="price-num">{{details.price}}</text></text>
+					</view>
+				</view> -->
+			</view>
+		</view>
+		<view class="rate-wrap u-flex">
+			<text class="rate-title">商品评价</text>
+			<u-rate count="5" v-model="params.star"  active-color="#FFBE00" size="20"></u-rate>
+			<text class="rate-text">{{params.star|rateText}}</text>
+		</view>
+		<u--textarea v-model="params.contentText" height="200rpx" maxlength="200" placeholder="如实描述商品和使用感受，更受欢迎" ></u--textarea>
+		<view class="upload-wrap">
+			<u-upload
+				 width="140rpx"
+				 height="140rpx"
+			    :fileList="fileList"
+				@beforeRead="beforeRead"
+			    @afterRead="afterRead"
+				@delete="deletePic"
+				:previewImage="true"
+				:multiple="false"
+			    name="name"
+			    :maxCount="5"
+			></u-upload>
+		</view>
+		<view class="full-btn" @click="submit">提交评价</view>
+	</view>
+</template>
+
+<script>
+	import {uploadImg} from '../utils/uploadImg.js'
+	export default {
+		data() {
+			return {
+				id:'',
+				goodsId:'',
+				params:{
+					orderId:'',
+					orderDetailId:'',
+					star:5,
+					contentText:'',
+					contentImgList:[]
+				},
+				fileList:[],
+				details:{},
+				staticUrl:this.$commonConfig.staticUrl,
+			}
+		},
+		onShow() {	
+		},
+		onLoad(page) {
+			console.log('page',page);
+			this.params.orderId = page.orderId;
+			this.params.orderDetailId = page.orderDetailId;
+			this.goodsId = page.goodsId;
+			this.getDetails(this.goodsId)
+		},
+		methods: {
+			getDetails(id){
+				this.$u.api.memberGoodDetails({id:id}).then(res=>{
+					this.details = res.data
+					console.log('memberGoodDetails',JSON.parse(JSON.stringify(res.data)));
+				}).catch(err=>{
+					console.log('getDetails',err);
+				})
+			},
+			// 新增图片
+			async afterRead(event){
+				//使用这个封装
+				const result = await uploadImg(event,this.fileList)
+				let parseResult = JSON.parse(result.data).data;
+				console.log('result===',result);
+				// console.log('event===',event.file);
+				// console.log('fileList===',this.fileList);
+				// console.log('parseResult===',parseResult);
+				// for(let i=0;i<event.file.length;i++){
+					
+				// }
+				let item = this.fileList[result.fileListLen]
+				this.fileList.splice(result.fileListLen, 1, Object.assign(item, {
+					status: 'success',
+					message: '成功',
+					url: JSON.parse(result.data).data
+				}));
+			},
+			// 删除图片
+			deletePic(event) {
+				this.fileList.splice(event.index, 1)
+			},
+			submit(){
+				console.log('this.fileList---',this.fileList);
+				this.params.contentImgList = this.fileList.map(item =>{
+					console.log('contentImgList===',item.url);
+					if(item.message=='成功'){
+						return item.url.url
+					}
+				});
+				this.$u.api.addGoodsComment(this.params).then(res=>{
+					console.log('res',res.data);
+					uni.showToast({
+						title:res.msg,
+						complete() {
+							uni.navigateBack()
+						}
+					});
+				}).catch(err=>{
+					console.log('addGoodsComment',err);
+				})
+				console.log('params',this.params);
+			}
+		}
+	}
+</script>
+<style>
+page{
+	background-color: #F5F5F5;
+}
+</style>
+<style lang="scss" scoped>
+.product{
+	background-color: #fff;
+	margin-bottom: 0;
+}
+.rate-wrap{
+	background-color: #fff;
+	margin-bottom: 20rpx;
+	padding: 20rpx;
+	.rate-title{
+		font-size: 30rpx;
+		color: #333;
+		font-weight: 600;
+		margin-right: 20rpx;
+	}
+	.rate-text{
+		font-size: 26rpx;
+		margin-left: 20rpx;
+		color: #ccc;
+	}
+}
+.upload-wrap{
+	margin-top: 40rpx;
+	padding: 20rpx;
+	background-color: #fff;
+}
+</style>

shopping/cart.vue

@@ -8,7 +8,7 @@
 		>
 		</u-navbar>
         <view class="product-list">
-			<view class="til u-flex u-row-between">
+			<view class="til u-flex u-row-between" :style="{top:navHeight+'px'}">
 				<u-checkbox-group @change="allCheckboxChange">
 					<u-checkbox shape="circle" :checked="allChecked" :name="allCheckbox.name" label="商品列表"></u-checkbox>
 				</u-checkbox-group>
@@ -101,9 +101,10 @@
     </view>
 </template>
 <script>
+	import { systemInfo } from "@/mixin.js";
 	import MescrollMixin from "@/uni_modules/mescroll-uni/components/mescroll-uni/mescroll-mixins.js";
     export default {
-		mixins: [MescrollMixin], // 使用mixin
+		mixins: [MescrollMixin,systemInfo], // 使用mixin
         data() {
             return {
 				cansubmit:true,
@@ -167,6 +168,7 @@
 			}
         },
 		onLoad(page) {
+			this.getSystemInfo();
 			this.buyNowId = page.buyNowId;
 			this.buyNowName = page.buyNowName;
 		},
@@ -403,7 +405,12 @@
 		padding-right: 0;
 	}
 	.til{
+		position: sticky;
+		background-color: #fff;
+		z-index: 1001;
+		padding-bottom: 10rpx;
 		margin-bottom: 20rpx;
+		min-height: 30px;
 		.delbtn{
 			font-size: 26rpx;
 			border: 1px solid #999;

shopping/order.vue

@@ -29,31 +29,55 @@
 							<text class="status">{{item.status|filterOrderState}}</text>
 						</view>
 						<view class="center">
-							<view v-for="goods in item.detailList" :key="goods.id" class="goods u-flex u-row-between">
-								<view class="left u-flex">
-									<u--image :showLoading="true" :src="goods.mainImg" width="128rpx" height="128rpx"></u--image>
-									<view class="text">
-										<view class="name ellipsis-2">{{goods.goodsName}}</view>
-										<view class="specification ellipsis-1">规格：{{goods.specification}}</view>
+							<view v-for="goods in item.detailList" :key="goods.id" class="goods">
+								<view class="u-flex u-row-between">
+									<view class="left u-flex">
+										<u--image :showLoading="true" :src="goods.mainImg" width="128rpx" height="128rpx"></u--image>
+										<view class="text">
+											<view class="name ellipsis-2">{{goods.goodsName}}</view>
+											<view class="specification ellipsis-1">规格：{{goods.specification}}</view>
+										</view>
+									</view>
+									<view class="right">
+										<u-icon name="arrow-right" color="#999" size="24"></u-icon>
+										<text class="price red">¥ <text class="price-num">{{goods.price}} </text></text>
+										<view class="quantity red">x {{goods.quantity}}</view>
 									</view>
 								</view>
-								<view class="right">
-									<u-icon name="arrow-right" color="#999" size="24"></u-icon>
-									<text class="price red">¥ <text class="price-num">{{goods.price}} </text></text>
-									<view class="quantity red">x {{goods.quantity}}</view>
+								<view class="comment-btn" v-if="item.status==3">
+									<text class="btn green" @click="comment(item.id,goods.id,goods.goodsId)">
+										评价
+									</text>
+								</view>
+								<view class="comment-btn" v-if="item.status==6">
+									<text class="btn" @click="viewComment(goods.id,goods.goodsId,goods)">
+										查看评价
+									</text>
 								</view>
 							</view>
 						</view>
-						<view class="order-price red">合计金额: ¥ {{item.orderPrice}}</view>
-						<view class="bottom u-flex u-row-between">
-							<view class="left"></view>
-							<view class="right u-flex">
-								<view 
-									class="btn"
-									:class="btn.class"
-									@click.stop="clickEven(btn.fun,item)"
-									v-for="(btn,index) in statusBtn[item.status]" :key="index">
-									{{btn.name}}
+						<view class="bottom">
+							<!-- <view v-if="item.moreData" class="more" @click.stop="toggleMore(item,index)">
+								<text>查看剩余{{item.moreData.length}}件商品</text>
+							</view> -->
+							<view class="u-flex u-row-between">
+								<view class="left u-flex">
+									<view
+										class="btn"
+										:class="btn.class"
+										@click.stop="clickEven(btn.fun,item)"
+										v-for="(btn,index) in statusBtn[item.status]" :key="index">
+										{{btn.name}}
+									</view>
+								</view>
+								<view class="right">
+									<view class="order-price">
+										合计金额:
+										<text style="font-weight: 600;">
+										 ¥ {{item.orderPrice}} 
+										<text v-if="item.orderType==2"> + {{item.creditPrice}}积分</text>
+										</text>
+									</view>
 								</view>
 							</view>
 						</view>
@@ -91,10 +115,12 @@
 					0:[{name:'取消订单',fun:'cancelOrder',class:''},{name:'去支付',fun:'pay',class:'red'}],
 					1:[{name:'申请退款',fun:'refund',class:''}],
 					2:[{name:'查看物流',fun:'logistics',class:''},{name:'确认收货',fun:'confirmReceipt',class:'green'}],
-					3:[{name:'查看物流',fun:'logistics',class:''},{name:'评价',fun:'evaluate',class:'green'}],
+					3:[{name:'查看物流',fun:'logistics',class:''}],
+					//,{name:'评价',fun:'evaluate',class:'green'}
 					// 4:[{name:'查看物流',fun:'logistics',class:''},{name:'评价',fun:'evaluate',class:'green'}],
 					5:[{name:'查看退款',fun:'viewRefund',class:'green'}],
-					6:[{name:'查看物流',fun:'logistics',class:''},{name:'查看评价',fun:'viewEvaluate',class:'green'}],
+					6:[{name:'查看物流',fun:'logistics',class:''}],
+					// ,{name:'查看评价',fun:'viewEvaluate',class:'green'}
 					7:[{name:'查看退款',fun:'viewRefund',class:'green'}]
 				},
 				orderBadge:{
@@ -109,9 +135,19 @@
 		computed: {
 		  orderListWithClass() {
 		      return this.dataList.map(order => {
+				  // let spliceData = order.detailList.splice(0,2);
+				  
+				  let moreData = order.detailList.splice(2,order.detailList.length);
+				  // if(order.detailList.length>2){
+					 //  moreData =  order.detailList;
+				  // }
 		        return {
 		          ...order,
+				  // spliceData:spliceData,
+				  moreData:moreData,
+				  showMore:false,
 		          class: {
+					0: 'status-0',
 		            1: 'status-1',
 		            2: 'status-2',
 		            3: 'status-3',
@@ -148,6 +184,7 @@
 			},
 			/*上拉加载的回调*/
 			upCallback(page) {
+				this.statisticsOrder();
 				// 此处可以继续请求其他接口
 				// if(page.num == 1){
 				// 	// 请求其他接口...
@@ -201,7 +238,6 @@
 			/*若希望重新加载列表,只需调用此方法即可(内部会自动page.num=1,再主动触发up.callback)*/
 			reloadList() {
 				this.mescroll.resetUpScroll();
-				this.statisticsOrder();
 			},
 			tabsClick(item){
 				// this.status = item.status;
@@ -214,6 +250,17 @@
 					id: id
 				});
 			},
+			toggleMore(item,index){
+				console.log('toggleMore',item);
+				this.orderListWithClass[index].showMore = !this.orderListWithClass[index].showMore
+				if(item.detailList.length<=2){
+					// this.orderListWithClass[index].detailList = item.detailList.concat(item.moreData);
+					this.$set(this.orderListWithClass, index, item.moreData);
+				}else{
+					this.orderListWithClass[index].detailList = this.orderListWithClass[index].detailList.slice(0, 2);
+				}
+				console.log('this.orderListWithClass[index]',this.orderListWithClass[index]);
+			},
 			clickEven(fun,item){
 				// console.log('fun',fun);
 				let funObj = {
@@ -251,6 +298,20 @@
 					id: item.id
 				});
 			},
+			comment(orderId,orderDetailId,goodsId){
+				uni.$u.route('/shopping/addcomment', {
+					orderId,
+					orderDetailId,
+					goodsId
+				});
+			},
+			viewComment(orderDetailId,goodsId,goods){
+				uni.$u.route('/shopping/viewcomment', {
+					orderDetailId,
+					goodsId,
+					goods:JSON.stringify(goods)
+				});
+			},
 			refund(item){
 				// console.log('logistics',item);
 				uni.$u.route('/shopping/refund', {
@@ -321,26 +382,26 @@
 					this.orderBadge = Object.assign(this.orderBadge,data);
 					let {noPayNum,deliverNum,collectNum,commentNum,refundNum} = res.data;
 					let noPayNumindex = this.tabsList.findIndex(item => item.status == 0);
-					if(noPayNum>0){
+
 						this.tabsList[1].badge.isDot = false;
 						this.tabsList[1].badge.value = noPayNum;
-					}
-					if(deliverNum>0){
+
+
 						this.tabsList[2].badge.isDot = false;
 						this.tabsList[2].badge.value = deliverNum;
-					}
-					if(collectNum>0){
+
+
 						this.tabsList[3].badge.isDot = false;
 						this.tabsList[3].badge.value = collectNum;
-					}
-					if(commentNum>0){
+
+
 						this.tabsList[4].badge.isDot = false;
 						this.tabsList[4].badge.value = commentNum;
-					}
-					if(refundNum>0){
+
+
 						this.tabsList[5].badge.isDot = false;
 						this.tabsList[5].badge.value = refundNum;
-					}
+
 					// console.log('statisticsOrder',res.data);
 					// console.log('this.orderBadge',this.orderBadge);
 					}).catch(err=>{
@@ -393,6 +454,20 @@ page{
 				border-bottom: 0.5px solid #eee;
 			}
 		}
+		.comment-btn{
+			margin-top: 20rpx;
+			text-align: right;
+			.btn{
+				font-size: 24rpx;
+				padding: 10rpx 50rpx;
+				border-radius: 28rpx;
+				border: 1px solid #333;
+				&.green{
+					border-color: #00A447;
+					color: #00A447;
+				}
+			}
+		}
 		.text{
 			margin-left: 20rpx;
 			.specification{
@@ -413,22 +488,30 @@ page{
 	.order-price{
 		text-align: right;
 		margin-bottom: 20rpx;
-		font-weight: 600;
 	}
 	.bottom{
 		font-size: 24rpx;
-		.left{color: #333;}
-		.right{
+		.left{
+			color: #333;
 			.btn{
 				padding: 12rpx 20rpx;
 				border: 1px solid #333;
 				text-align: center;
-				margin-left: 20rpx;
 				border-radius: 28rpx;
 				&.red{border-color: #FF3C3F;}
 				&.green{color: #00A447;border-color: #00A447;}
+				&:not(:first-child){
+					margin-left: 20rpx;
+				}
 			}
 		}
+		.more{
+			text-align: center;
+			padding: 20rpx 0;
+			font-size: 24rpx;
+			font-weight: 400;
+			color: #999999;
+		}
 	}
 	&.status-0{.status{color:#FF3C3F;}}
 	&.status-1{.status{color:#FF3C3F;}}

shopping/orderdetails.vue

@@ -151,7 +151,7 @@
 					0:[{name:'取消订单',fun:'cancelOrder',class:''},{name:'去支付',fun:'pay',class:'red'}],
 					1:[{name:'申请退款',fun:'refund',class:''}],
 					2:[{name:'查看物流',fun:'logistics',class:''},{name:'确认收货',fun:'confirmReceipt',class:'green'}],
-					3:[{name:'查看物流',fun:'logistics',class:''},{name:'评价',fun:'evaluate',class:'green'}],
+					3:[{name:'查看物流',fun:'logistics',class:''}],
 					// 4:[{name:'查看物流',fun:'logistics',class:''},{name:'评价',fun:'evaluate',class:'green'}],
 					5:[{name:'查看退款',fun:'viewRefund',class:''}],
 					// 6:[{name:'查看退款',fun:'viewRefund',class:'green'}],

shopping/productdetails.vue

@@ -30,7 +30,7 @@
 					<text class="exchangeCredit" v-if="details.isCredit==1">+{{details.exchangeCredit}}积分</text>
 				</view>
 				<view class="" v-else>
-					<text v-if="details.exchangeType==0" class="price">¥ <text class="price-num">0</text></text>
+					<text v-if="details.isCredit==1&&details.exchangeType==0" class="price">¥ <text class="price-num">0</text></text>
 					<text v-else class="price">¥ <text class="price-num">{{details.salePrice}}</text></text>
 					<text class="exchangeCredit" v-if="details.isCredit==1">+{{details.exchangeCredit}}积分</text>
 				</view>

shopping/viewcomment.vue

@@ -0,0 +1,137 @@
+<template>
+	<view class="page-wrap">
+		<u-navbar
+			title="商品评价"
+			:autoBack="true"
+			 :safeAreaInsetTop="true"
+		>
+		</u-navbar>
+		<view class="content">
+			<view class="product u-flex">
+				<u--image :showLoading="true" :src="goodsDetails.mainImg" width="180rpx" height="180rpx"></u--image>
+				<view class="text">
+					<view class="up">
+						<view class="name ellipsis-2">{{goodsDetails.goodsName}}</view>
+						<view class="info u-flex u-row-between">
+							<view class="">
+								<text v-if="goodsDetails.specification">{{goodsDetails.specification}}</text>
+								<text v-if="goodsDetails.unit">{{goodsDetails.unit}}</text>
+							</view>
+							<view class="">共{{goodsDetails.quantity}}件</view>
+						</view>
+					</view>
+					<!-- <view class="down u-flex u-row-between">
+						<view class="left">
+							<text class="price">¥ <text class="price-num">{{goodsDetails.price}}</text></text>
+						</view>
+					</view> -->
+				</view>
+			</view>
+			<view class="comment">
+				<view class="item u-flex u-row-between">
+					<view class="left">商品评价</view>
+					<view class="right">
+						<u-rate count="5" v-model="commentDetails.star" :readonly="true" active-color="#FFBE00" r size="20"></u-rate>
+					</view>
+				</view>
+				<view class="item u-flex u-row-between">
+					<view class="left">文字补充</view>
+					<view class="right">{{commentDetails.contentText||'暂无补充'}}</view>
+				</view>
+				<view class="item u-flex u-col-top" :class="{'u-row-between':commentDetails.contentImgs.length<1}">
+					<view class="left">图片补充</view>
+					<view class="right" style="margin-left: 40rpx;">
+						<text v-if="commentDetails.contentImgs.length<1">暂无补充</text>
+						<view v-else class="">
+							<u-album :urls="commentDetails.contentImgs"></u-album>
+							<!-- <u--image 
+								v-for="(img,index) in commentDetails.contentImgs" :key="index"
+								:showLoading="true" 
+								:src="img" 
+								width="180rpx" 
+								height="180rpx">
+							</u--image> -->
+						</view>
+					</view>
+				</view>
+			</view>
+		</view>
+	</view>
+</template>
+
+<script>
+	export default {
+		data() {
+			return {
+				goodsId:'',
+				orderDetailId:'',
+				goodsDetails:{},
+				commentDetails:{contentImgs:[]},
+				goodsDetails:{},
+			}
+		},
+		onShow() {
+		},
+		onLoad(page) {
+			this.goodsId = page.goodsId;
+			this.orderDetailId = page.orderDetailId;
+			this.goodsDetails = JSON.parse(page.goods);
+			console.log('this.goodsDetails',this.goodsDetails);
+			// this.getGoodsDetails(this.goodsId);
+			this.getCommentDetails(this.orderDetailId);
+		},
+		methods: {
+			getGoodsDetails(id){
+				this.$u.api.memberGoodDetails({id:id}).then(res=>{
+					this.goodsDetails = res.data
+					console.log('memberGoodDetails',JSON.parse(JSON.stringify(res.data)));
+				}).catch(err=>{
+					console.log('getGoodsDetails',err);
+				})
+			},
+			getCommentDetails(id){
+				this.$u.api.getOrderDetailComment({orderDetailId:id}).then(res=>{
+					this.commentDetails = res.data;
+					this.commentDetails.contentImgs = this.commentDetails.contentImgs.split(",");
+					console.log('getCommentDetails',JSON.parse(JSON.stringify(res.data)));
+				}).catch(err=>{
+					console.log('getCommentDetails',err);
+				})
+			},
+		}
+	}
+</script>
+<style>
+page{
+	background-color: #F5F5F5;
+}
+</style>
+<style lang="scss" scoped>
+.content{
+	background-color: #fff;
+	border-radius: 8rpx;
+	padding: 20rpx;
+}
+.product{
+	.info{
+		font-size: 24rpx;
+		font-weight: 400;
+		color: #666666;
+		line-height: 33rpx;
+	}
+}
+.comment{
+	.item{
+		margin-bottom: 30rpx;
+		.left{
+			font-size: 30rpx;
+			font-weight: 600;
+			color: #333333;
+			line-height: 38rpx;
+		}
+		.right{
+			color: #666;
+		}
+	}
+}
+</style>

uni.scss

@@ -79,7 +79,7 @@ $uni-color-paragraph: #3F536E; // 文章段落颜色
 $uni-font-size-paragraph:15px;
 
 page{
-	padding-top: 94px;
+	padding-top: 104px;
 	// &:has(.u-navbar){
 	// 	padding-top: 104px;
 	// }

utils/uploadImg.js

@@ -11,6 +11,7 @@ export function uploadImg(event,fileList) {
 				...item
 			})
 		})
+		// console.log('fileListLen===',fileListLen);
        // 这块把uview的改了一下 不用单独封装上传功能
 		for (let i = 0; i < lists.length; i++) {
 			uni.uploadFile({
@@ -26,6 +27,7 @@ export function uploadImg(event,fileList) {
 						fileListLen: fileListLen
 					}
                     // 成功之后返回resolveData
+					// console.log('resolveData===',resolveData);
 				    resolve(resolveData);
 					fileListLen++
 				}