红包 退款

ghsApp/src/pagesOrder/refund.vue

@@ -51,13 +51,19 @@
 		}
 		.refund-item{
 			display: flex;
-			padding: 30rpx 0;
-			.refund-label{width: 200rpx;text{color: red;}}
+			padding: 18rpx 0;
+			.refund-label{
+				width: 200rpx;
+				text{
+					color: red;
+				}
+			}
 			input{
 				border: 1px solid #ddd;
 			}
 			textarea{
 				width: calc(100% - 210rpx);
+				height:150rpx;
 				border: 1px solid #ddd;
 			}
 		}
@@ -77,87 +83,84 @@
 
 		}
 	}
-
 </style>
 <template>
 	<view class="app-content">
-				<view class="flex refund-item">
-					<view class="refund-label">退款方式：</view>
-					<view class="flex list">
-						<view class="flex" @tap="refundType=1" ><view class="flex-center radioBtn" :class="refundType==1?'active':''"></view>退货并退款</view>
-						<view style="margin-left: 20rpx" class="flex" @tap="refundType=2"><view class="flex-center radioBtn"  :class="refundType==1?'':'active'"></view>仅退款</view>
-					</view>
-				</view>
-
-
-				<view class="refund-item-list" v-if="refundType==1">
-					<view class="refund-label"><text></text>选择商品：</view>
-					<view>
-						<view class="list" v-for="(res,i) in product" :key="i">
-						<!--<view class="flex list-title" @tap="selectProduct(i)">-->
-						<view class="flex list-title" >
-							<!--<view class="flex-center radioBtn" :class="res.isActive?'active':''"></view>-->
-							{{res.name}} {{ `${res.bigNum}/${res.smallNum}` }} {{`￥${res.price}`}}
-						</view>
-						<view class="flex list-val">
-							<input type="number" @blur="inputFun" v-model="res.big"><text>扎</text>
-							<input type="number" @blur="inputFun" v-model="res.small"><text>支</text>
-						</view>
-					</view>
-					</view>
-				</view>
-
-				<view class="flex refund-item">
-					<view class="refund-label">订单金额：</view>
-					<view class="list">{{totalMoney}}</view>
+		<view class="flex refund-item">
+			<view class="refund-label">退款方式：</view>
+			<view class="flex list">
+				<view class="flex" @tap="refundType=1" ><view class="flex-center radioBtn" :class="refundType==1?'active':''"></view>退货并退款</view>
+				<view style="margin-left: 20rpx" class="flex" @tap="refundType=2"><view class="flex-center radioBtn"  :class="refundType==1?'':'active'"></view>仅退款</view>
+			</view>
+		</view>
+		<view class="refund-item-list" v-if="refundType==1">
+			<view class="refund-label"><text></text>选择商品：</view>
+			<view>
+				<view class="list" v-for="(res,i) in product" :key="i">
+				<view class="flex list-title" >
+					{{res.name}} {{ `${res.bigNum}/${res.smallNum}` }} {{`￥${res.price}`}}
 				</view>
-
-				<view class="flex refund-item">
-					<view class="refund-label"><text></text>退款金额：</view>
-					<input type="digit" v-model="refundMoney">
+				<view class="flex list-val">
+					<input type="number" @blur="inputFun" v-model="res.big"><text>扎</text>
+					<input type="number" @blur="inputFun" v-model="res.small"><text>支</text>
 				</view>
-
-
+			</view>
+			</view>
+		</view>
+		<view class="flex refund-item">
+			<view class="refund-label">订单原价：</view>
+			<view class="list">{{parseFloat(orderInfo.prePrice)||0}}</view>
+		</view>
+		<view class="flex refund-item" v-if="orderInfo.discountType == 4">
+			<view class="refund-label">红包优惠：</view>
+			<view class="list">
+				<text style="color:red;margin-right:20rpx;">-{{parseFloat(orderInfo.discountAmount) || 0}}</text>
+				<text v-if="parseFloat(orderInfo.realPrice) == parseFloat(refundMoney)" style="color:red;">红包将退还客户</text>
+			</view>
+		</view>
+		<view class="flex refund-item">
+			<view class="refund-label">实付金额：</view>
+			<view class="list">{{parseFloat(orderInfo.realPrice)||0}}</view>
+		</view>
+		<view class="flex refund-item">
+			<view class="refund-label"><text></text>退款金额：</view>
+			<input type="digit" v-model="refundMoney">
+		</view>
 		<view class="refund-item">
 			<view class="refund-label">备注：</view>
 			<textarea v-model="remark" />
 		</view>
 		<view class="refund-item">
-			<view class="refund-label"></view>
-			<view>每个订单只能发起一次退款</view>
+			<view style="color:#CCCCCC;">每个订单只能发起一次退款</view>
 		</view>
-
-		<view class="flex-center btn-box" style="margin-bottom:50rpx;">
+		<view class="flex-center btn-box" style="margin-bottom:50rpx;margin-top:20rpx;">
 			<view class="flex-center btn" @tap="retreatPage">取消</view>
 			<view class="flex-center btn active" @tap="refundFun" style="margin-left: 50rpx">确定</view>
 		</view>
 	</view>
 </template>
-
 <script>
 import stepStatus from "./components/stepStatus";
 import TuiListCell from "@/components/plugin/list-cell";
 import { getDetail,debtPay,hasPay, freeShipping,refund } from "@/api/order/index";
-// import productMins from "@/mixins/product";
 import { ORDER_STATUS } from "@/utils/declare";
-// import BLE from "@/mixins/BLE";
 export default {
 	name: "orderDetail",
 	components: {
 		stepStatus,
 		TuiListCell
 	},
-	// mixins: [productMins,BLE],
 	data() {
 		return {
 			ORDER_STATUS,
 			isMonitor:true,
 			product:'',
-			totalMoney:'',
 			refundMoney:null,
 			refundType:1,
 			remark:'',
-			refundPrice:0
+			refundPrice:0,
+			orderInfo:{},
+			discount:1
 		};
 	},
 	onShow() {
@@ -167,13 +170,13 @@ export default {
 			this.refundPrice = 0
 			if(!this.$util.isEmpty(this.product)){
 				this.product.forEach(ele=>{
-					let unitPrice = ele.unitPrice; //单价
-					let big = ele.big * unitPrice; //输入的扎
-					let small = (ele.small * ele.smallUnitPrice).toFixed(2); //输入的支
+					let unitPrice = ele.unitPrice;
+					let big = ele.big * unitPrice;
+					let small = (ele.small * ele.smallUnitPrice).toFixed(2);
 					this.refundPrice = (Number(this.refundPrice) + big + Number(small)).toFixed(2);
 				})
 			}
-			this.refundMoney = this.refundPrice
+			this.refundMoney = parseFloat((this.refundPrice * this.discount).toFixed(2))
 		},
 	},
 	methods: {
@@ -246,8 +249,9 @@ export default {
 			const res = await getDetail({
 				id: this.option.id,getOriginalItem:1
 			});
+			this.orderInfo = res.data
 
-			this.totalMoney = res.data.actPrice
+			this.discount = parseFloat((this.orderInfo.realPrice / this.orderInfo.prePrice).toFixed(2))
 
 			this.product = res.data.product.map(ele=>{
 				return {...ele,isActive:false,big:null,small:null}
@@ -256,5 +260,4 @@ export default {
 		},
 	}
 };
-</script>
-
+</script>