From ca34f4e2745b0aa04ad8bb202bd3dc23b5b54d6c Mon Sep 17 00:00:00 2001
From: =?UTF-8?q?=E5=B0=8F=E9=92=BB=E9=A3=8E?= <1090115880@qq.com>
Date: Fri, 5 Mar 2021 17:55:37 +0800
Subject: [PATCH] 3-5

---
 commit.csv                                |   1 +
 pages.json                                |  21 +++
 pages/afterSaleDetail/afterDetailed.vue   |  71 ++++++---
 pages/afterSaleDetail/afterSaleDetail.vue |   1 -
 pages/mine/mine.vue                       |   8 +-
 pages/orderDetail/orderDetail.vue         |   9 +-
 pages/orders/releaseRemark.vue            |  94 ++++++++++++
 pages/orders/remark.vue                   | 176 ++++++++++++++++++++++
 pages/orders/remarkDetails.vue            | 114 ++++++++++++++
 9 files changed, 463 insertions(+), 32 deletions(-)
 create mode 100644 pages/orders/releaseRemark.vue
 create mode 100644 pages/orders/remark.vue
 create mode 100644 pages/orders/remarkDetails.vue

diff --git a/commit.csv b/commit.csv
index 76072c9..17f63b2 100644
--- a/commit.csv
+++ b/commit.csv
@@ -1,3 +1,4 @@
+2021-03-04,20:33:02,3-4,622,275
 2021-03-03,19:40:50,3-3,972,5184
 2021-03-03,09:23:04,3-3,5502,663
 2021-03-01,20:30:00,3-1,46,27
diff --git a/pages.json b/pages.json
index 6733aaa..8b2ab99 100644
--- a/pages.json
+++ b/pages.json
@@ -153,6 +153,27 @@
 				"enablePullDownRefresh": false,
 				"navigationStyle": "custom"
 			}
+		},
+		{
+			"path": "pages/orders/remark",
+			"style": {
+				"navigationBarTitleText": "我的评价",
+				"enablePullDownRefresh": false
+			}
+		},
+		{
+			"path": "pages/orders/releaseRemark",
+			"style": {
+				"navigationBarTitleText": "发表评价",
+				"enablePullDownRefresh": false
+			}
+		},
+		{
+			"path": "pages/orders/remarkDetails",
+			"style": {
+				"navigationBarTitleText": "我的评价",
+				"enablePullDownRefresh": false
+			}
 		},
 		{
 			"path": "pages/realname/realname",
diff --git a/pages/afterSaleDetail/afterDetailed.vue b/pages/afterSaleDetail/afterDetailed.vue
index 5e94f70..c251193 100644
--- a/pages/afterSaleDetail/afterDetailed.vue
+++ b/pages/afterSaleDetail/afterDetailed.vue
@@ -1,10 +1,10 @@
 <template>
 	<view class="goods-box">
-		<view class="box" v-for="item in list" :key='item.id'>
+		<view class="box" v-for="(item,index) in list" :key='item.id'>
 			<view class="item">
 				<view class="title">
 					<view class="left">
-						<view class="dot" :class=""></view>
+						<view class="dot" :class="index===0?'active':''"></view>
 					</view>
 					<view class="flex justify-between align-center" style="flex: 1;">
 						<view>{{item.title}} </view>
@@ -12,12 +12,14 @@
 					</view>
 				</view>
 				<view class="line-box">
-					<view class="left" style="width: 40rpx;">
-						<view class="line"></view>
+					<view class="left">
+						<view class="line" v-if="index!==list.length-1"></view>
 					</view>
 					<view class="" style="padding: 20rpx 0rpx 30rpx 0;flex: 1;">
 						<view class="txt">
-							<view v-for="(txt,index) in item.content" :key='index'>{{txt |strFilters}}</view>
+							<view style="padding: 10rpx 0;" v-for="(txt,i) in item.content" :key='i'>
+								<rich-text :nodes="txt"></rich-text>
+							</view>
 						</view>
 					</view>
 				</view>
@@ -30,15 +32,7 @@
 	export default {
 		data() {
 			return {
-				list: []
-			}
-		},
-		filters: {
-			strFilters(str) {
-				if (str) {
-					str.replace(/<.+>/g, "")
-					return str.replace(/<[^>]+>/g, '');
-				}
+				list: [],
 			}
 		},
 		methods: {
@@ -53,11 +47,16 @@
 					}
 					this.list = res.data.data
 					this.list.map(item => {
-						item.content = item.content.split("|")
-
+						item.content = this.repE(item.content)
 					})
-
 				});
+			},
+			// 替换标签
+			repE(str) {
+				let strArr = str.replace(/<black>(.*?)<\/black>/g, '<span class="font-black">$1</span>')
+								.replace(/<gray>(.*?)<\/gray>/g, '<div class="gray-box">$1</div>')
+								.replace(/<address>(.*?)<\/address>/g,'<span class="font-black">$1</span>')
+				return strArr.split("|")
 			}
 		},
 		onLoad(options) {
@@ -68,17 +67,34 @@
 			}
 		}
 	}
-</script>
+</script>
+
+<style lang="scss">
+	.gray-box {
+		background: #F8F8F8;
+		border-radius: 8rpx;
+		padding: 10rpx 0;
+		font-size: 28rpx;
+		font-family: PingFangSC-Regular, PingFang SC;
+		font-weight: 400;
+		color: #999999;
+	}
+
+	.font-black {
+		font-weight: bold;
+		font-size: 28rpx;
+		color: #333333;
+	}
 
-<style lang="scss" scoped>
 	.goods-box {
 		background: #FFFFFF;
 		min-height: 100vh;
+
 		padding: 30rpx;
 		height: auto;
 	}
-	.box {
 
+	.box {
 		.left {
 			width: 40rpx;
 			display: flex;
@@ -88,18 +104,21 @@
 		.dot {
 			width: 16rpx;
 			height: 16rpx;
-			border-radius: 50%;
+			border-radius: 50%;
 			background: #E5E5E5;
-			z-index: 10;
-			&.active{
-				background: #DB2D2D;
+			z-index: 10;
+
+			&.active {
+				background: #DB2D2D;
 			}
 		}
+
 		.line {
 			width: 4rpx;
-			height: auto;
+			height: auto;
 			background: #E5E5E5;
 		}
+
 		.title {
 			display: flex;
 			align-items: center;
@@ -108,6 +127,7 @@
 			font-family: PingFangSC-Medium, PingFang SC;
 			font-weight: 500;
 			color: #333333;
+
 			.time-txt {
 				font-size: 24rpx;
 				font-weight: 400;
@@ -121,6 +141,7 @@
 			.txt {
 				flex: 1;
 				font-size: 28rpx;
+
 				font-family: PingFangSC-Regular, PingFang SC;
 				font-weight: 400;
 				color: #666666;
diff --git a/pages/afterSaleDetail/afterSaleDetail.vue b/pages/afterSaleDetail/afterSaleDetail.vue
index 467c1d6..21db0af 100644
--- a/pages/afterSaleDetail/afterSaleDetail.vue
+++ b/pages/afterSaleDetail/afterSaleDetail.vue
@@ -12,7 +12,6 @@
 				</view>
 			</view>
 		</view>
-		
 		<view class="msg-box bg-white">
 			<!-- 待审核 -->
 			<view class=" bg-white" v-if="message.status==1&&message.returnStatus==1">
diff --git a/pages/mine/mine.vue b/pages/mine/mine.vue
index d892228..1169e48 100644
--- a/pages/mine/mine.vue
+++ b/pages/mine/mine.vue
@@ -402,9 +402,11 @@
 					case 2:
 						type = 3
 						break;
-					case 3:
-						type = 4
-						break;
+					case 3:
+						uni.navigateTo({
+							url: "../orders/remark"
+						})
+						return;
 					case 4:
 						uni.navigateTo({
 							url: "../afterSaleGoods/afterSaleGoods"
diff --git a/pages/orderDetail/orderDetail.vue b/pages/orderDetail/orderDetail.vue
index f93827a..16d60c2 100644
--- a/pages/orderDetail/orderDetail.vue
+++ b/pages/orderDetail/orderDetail.vue
@@ -129,8 +129,8 @@
 					<view class="num">{{orderDetail.buyerMessage}}</view>
 				</view>
 				<view class="item flex">
-					<view class="span">销售额</view>
-					<view class="text-black">￥{{orderDetail.actualTotalAmount | toFixed(2)}}</view>
+					<view class="span">销售额 <text class="cuIcon-question" style="padding-left: 8rpx;" @click="queston"></text></view>
+					<view class="text-black">￥{{orderDetail.goodsTotalAmount | toFixed(2)}}</view>
 				</view>
 				<button open-type='contact' class='customer-service'>
 					<view class="item flex justify-center">
@@ -194,7 +194,10 @@
 				return goosData
 			}
 		},
-		methods: {
+		methods: {
+			queston(){
+				
+			},
 			//未发货申请退款
 			returnMoney(id) {
 				uni.showModal({
diff --git a/pages/orders/releaseRemark.vue b/pages/orders/releaseRemark.vue
new file mode 100644
index 0000000..9ed4979
--- /dev/null
+++ b/pages/orders/releaseRemark.vue
@@ -0,0 +1,94 @@
+<template>
+	<view class="">
+		<view class="card-box">
+			<view class="head-box flex align-center">
+				<view class="lf bg-img" :style="'background-image: url('+IMAGE_URL+pageData.mainPhotoUrl+');'"></view>
+				<view class="rg">
+					<view class="title">
+						<text>{{pageData.goodsName}}</text>
+					</view>
+					<view class="pic">
+						<text>型号规格 {{pageData.skuName}}</text>
+					</view>
+				</view>
+			</view>
+			<view class="content">
+	
+			</view>
+			<view class="image-list  flex flex-wrap align-end">
+				
+			</view>
+		</view>
+	</view>
+</template>
+
+<script>
+	export default {
+		data() {
+			return {
+				IMAGE_URL: this.IMAGE_URL,
+				pageData: null,
+			};
+		},
+		onLoad(options) {
+			const data = JSON.parse(decodeURIComponent(options.data));
+			this.pageData = data
+		},
+		methods: {
+			
+		}
+	}
+</script>
+
+
+<style lang="scss" scoped>
+	.card-box {
+		margin: 30rpx;
+		padding: 20rpx;
+		background: #FFFFFF;
+		font-family: PingFangSC-Regular, PingFang SC;
+		font-weight: 400;
+		color: #666666;
+		font-size: 24rpx;
+		border-radius: 16rpx;
+
+		.head-box {
+			margin-bottom: 46rpx;
+
+			.lf {
+				width: 112rpx;
+				height: 112rpx;
+				border-radius: 10rpx;
+				margin-right: 20rpx;
+			}
+
+			.rg {
+				.title {
+					font-size: 28rpx;
+					font-family: PingFangSC-Medium, PingFang SC;
+					font-weight: 500;
+					color: #333333;
+				}
+
+				.pic {
+					font-size: 26rpx;
+				}
+			}
+		}
+
+		.content {
+			font-size: 28rpx;
+			color: #333333;
+			margin-bottom: 80rpx;
+		}
+		.image-list {
+			.image-box {
+				width: 178rpx;
+				height: 178rpx;
+				border-radius: 8rpx;
+				margin-right: 16rpx;
+				margin-top: 20rpx;
+			}
+		}
+	}
+</style>
diff --git a/pages/orders/remark.vue b/pages/orders/remark.vue
new file mode 100644
index 0000000..57aa7ac
--- /dev/null
+++ b/pages/orders/remark.vue
@@ -0,0 +1,176 @@
+<template>
+	<view class="flex flex-direction" style="height: 100vh">
+		<view class="bg-white">
+			<view style="width: 400rpx;margin: 0 auto;">
+				<u-tabs :list="list" :is-scroll="false" height="90" active-color='#DB2D2D' inactive-color='#333333'  :current="currentIndex" duration="0.2" bar-width="56" :bold="false"
+				 @change="chooseTabs"></u-tabs>
+			</view>
+		</view>
+		<swiper class="flex-sub" :current="currentIndex" :indicator-dots="false" :autoplay="false" @change="changeCurrent">
+			<swiper-item v-for="(li,i) in list" :key='i'>
+				<scroll-view scroll-y="true" style="height: 100%;">
+					<view class="flex flex-direction justify-center align-center null" v-if="!remarkList.length" style="min-height: 60vh;">
+						<image src="/static/null05.png" style="width: 300rpx;" mode="widthFix"></image>
+						<view style="font-size: 28rpx;color: #AAAAAA;margin-top: 10rpx;">暂无订单</view>
+					</view>
+					<view v-else>
+						<view v-for="(item,index) in remarkList" :key='index'>
+							<view class="order-box">
+								<view class="flex justify-between">
+									<view class="lf bg-img" :style="'background-image: url('+IMAGE_URL+item.mainPhotoUrl+');'">
+									</view>
+									<view class="rg flex flex-wrap" style="align-content: space-between; flex: 1;">
+										<view class="head" style="width: 100%;">
+											<view class="black title">
+												<text>{{item.goodsName}}</text>
+											</view>
+											<view class="pic">
+												<text>规格型号 {{item.skuName}}</text>
+											</view>
+										</view>
+										<view class="flex justify-between" style="width: 80%;">
+											<text>订单金额<text class="black">￥{{item.goodsAmount}}</text></text>
+											<text>购买数量<text class="black">{{item.quantity}}</text></text>
+										</view>
+									</view>
+								</view>
+								<view class="remark-btn flex justify-end">
+									<view class="btn flex justify-center align-center">
+										<view class="" @click="toPage(item)">
+											<text v-if="currentIndex">已评价</text>
+											<text v-else>查看评价</text>
+										</view>
+									</view>
+								</view>
+							</view>
+
+						</view>
+					</view>
+				</scroll-view>
+			</swiper-item>
+		</swiper>
+	</view>
+</template>
+
+<script>
+	export default {
+		data() {
+			return {
+				IMAGE_URL: this.IMAGE_URL,
+				currentIndex: 0,
+				list: [{
+					name: '待评价',
+					goods: [],
+					isNull: false
+				}, {
+					name: '已评价',
+					goods: [],
+					isNull: false
+				}],
+				remarkList: []
+			};
+		},
+		
+		onLoad() {
+			this.getOrders()
+		},
+		methods: {
+			// 跳转页面
+			toPage(data){
+				if(this.currentIndex){
+					// 查看评价
+					uni.navigateTo({
+						url: './remarkDetails?data=' + encodeURIComponent(JSON.stringify(data))
+					})
+				}else{
+					// 去发表页面
+					uni.navigateTo({
+						url:'./releaseRemark?data=' + encodeURIComponent(JSON.stringify(data))
+					})
+				}
+		
+			},
+			//tab切换
+			chooseTabs(index) {
+				this.currentIndex = index
+			},
+			//切换页面
+			changeCurrent(e) {
+				this.currentIndex = e.detail.current
+				this.getOrders()
+			},
+			// 获取订单数据
+			getOrders() {
+				this.sendData = {
+					userId: uni.getStorageSync("userInfo").id,
+					status: this.currentIndex
+				}
+				this.$u.post('/api/v1/order/evaluation/orderEvaluationList', this.sendData).then(res => {
+					console.log(res.data);
+					if (res.data.code == "FAIL") {
+						this.$u.toast(res.data.msg);
+						return
+					}
+			
+					this.remarkList = res.data.data ? res.data.data : []
+					if(this.currentIndex === 0 && this.remarkList.length>0){
+						this.list[0].name =  `待评价(${this.remarkList.length})`
+					}
+				});
+			}
+		}
+	}
+</script>
+
+<style lang="scss" scoped>
+	page {
+		height: 100vh;
+		width: 100vw;
+	}
+
+	.order-box {
+		margin: 30rpx;
+		padding: 20rpx;
+		font-family: PingFangSC-Regular, PingFang SC;
+		font-weight: 400;
+		color: #666666;
+		background: #FFFFFF;
+		border-radius: 16rpx;
+		.lf {
+			width: 160rpx;
+			height: 160rpx;
+			border-radius: 10rpx;
+			margin-right: 20rpx;
+			overflow: hidden;
+		}
+		.rg{
+			flex: 1;
+			.head{
+				.pic{
+					font-size: 26rpx;
+				}
+			}
+			.black{
+				font-size: 28rpx;
+				font-family: PingFangSC-Medium, PingFang SC;
+				font-weight: 500;
+				color: #333333;
+			}
+		}
+		.remark-btn {
+			margin-top: 40rpx;
+			.btn {
+				width: 152rpx;
+				height: 56rpx;
+				background: #FFFFFF;
+				border-radius: 28rpx;
+				border: 2rpx solid #DB2D2D;
+				font-size: 28rpx;
+				font-weight: 400;
+				color: #DB2D2D;
+			}
+		}
+	}
+
+	
+</style>
diff --git a/pages/orders/remarkDetails.vue b/pages/orders/remarkDetails.vue
new file mode 100644
index 0000000..41254c6
--- /dev/null
+++ b/pages/orders/remarkDetails.vue
@@ -0,0 +1,114 @@
+<template>
+	<view class="">
+		<view class="card-box">
+			<view class="head-box flex align-center">
+				<view class="lf bg-img" :style="'background-image: url('+IMAGE_URL+pageData.mainPhotoUrl+');'"></view>
+				<view class="rg">
+					<view class="title">
+						<text>{{pageData.goodsName}}</text>
+					</view>
+					<view class="pic">
+						<text>型号规格 {{pageData.skuName}}</text>
+					</view>
+				</view>
+			</view>
+			<view class="content">
+				<text>{{goodsEva.content}}</text>
+			</view>
+			<view class="image-list  flex flex-wrap align-end">
+				<view class="image-box" v-for="(imgItem,imgIndex) in goodsImgList" :key='imgIndex'>
+					<image :src="`${IMAGE_URL}${imgItem.url}`" mode="widthFix"></image>
+				</view>
+				共{{goodsImgList.length}}张
+			</view>
+		</view>
+	</view>
+</template>
+
+<script>
+	export default {
+		data() {
+			return {
+				IMAGE_URL: this.IMAGE_URL,
+				pageData: null,
+				goodsEva: null, // 评价内容等
+				goodsImgList: [] //评价图片列表
+			};
+		},
+		onLoad(options) {
+			const data = JSON.parse(decodeURIComponent(options.data));
+			this.pageData = data
+			this.getData()
+		},
+		methods: {
+			getData(id) {
+				let resData = {
+					id: 177
+				}
+				this.$u.post('/api/v1/order/evaluation/evaluationDea', resData).then(res => {
+					console.log(res.data);
+					if (res.data.code == "FAIL") {
+						this.$u.toast(res.data.msg);
+						return
+					}
+					const data = res.data.data
+					this.goodsEva = data.goodsEva
+					this.goodsImgList = data.goodsEvaGoods ? data.goodsEvaGoods : []
+				});
+			}
+		}
+	}
+</script>
+
+
+<style lang="scss" scoped>
+	.card-box {
+		margin: 30rpx;
+		padding: 20rpx;
+		background: #FFFFFF;
+		font-family: PingFangSC-Regular, PingFang SC;
+		font-weight: 400;
+		color: #666666;
+		font-size: 24rpx;
+		border-radius: 16rpx;
+
+		.head-box {
+			margin-bottom: 46rpx;
+
+			.lf {
+				width: 112rpx;
+				height: 112rpx;
+				border-radius: 10rpx;
+				margin-right: 20rpx;
+			}
+
+			.rg {
+				.title {
+					font-size: 28rpx;
+					font-family: PingFangSC-Medium, PingFang SC;
+					font-weight: 500;
+					color: #333333;
+				}
+
+				.pic {
+					font-size: 26rpx;
+				}
+			}
+		}
+
+		.content {
+			font-size: 28rpx;
+			color: #333333;
+			margin-bottom: 80rpx;
+		}
+		.image-list {
+			.image-box {
+				width: 178rpx;
+				height: 178rpx;
+				border-radius: 8rpx;
+				margin-right: 16rpx;
+				margin-top: 20rpx;
+			}
+		}
+	}
+</style>