classify 8.4

pageE/order/RefundOrder.vue

@@ -0,0 +1,142 @@
+<template>
+	<view class="refund">
+		<view class="radios-container">
+			<u-radio-group v-model="value" @change="radioChange">
+				<label class="radio-view" v-for="(item, index) in goodsList" :key="index">
+					<view class="radio">
+						<u-radio color="#F0AD4E" :name="item.goods_id" active-color="#FF780F" icon-size="34" shape="circle"></u-radio>
+					</view>
+					<view class="store_info">
+						<view class="info_img">
+							<image :src="item.goods_image" mode="">
+						</view>
+						<view class="info_txt">
+							<view class="content u-line-2">
+								{{ item.goods_name }}
+							</view>
+							<view class="much">
+								<text>￥{{ item.goods_pay_price }}</text>
+								<text>x{{ item.goods_num }}</text>
+							</view>
+						</view>
+					</view>
+				</label>
+			</u-radio-group>
+		</view>
+		<view class="refund-details">
+			<view class="goods-number">
+				<view>选择数量</view>
+				<view></view>
+			</view>
+			<view class="refund-price">
+				<view>
+					<view>退款金额</view>
+					<view>￥99.00</view>
+				</view>
+				<view>若退款成功，将退还给您￥99.00</view>
+			</view>
+			<view class="refund-text">
+				<view>申请说明</view>
+				<u-input v-model="refundText" type="textarea" />
+			</view>
+		</view>
+		<view class="submit-btn">提交申请</view>
+	</view>
+</template>
+<script>
+export default {
+	data() {
+		return {
+			goodsList: [],
+			value: '',
+		}
+	},
+	onLoad(option) {
+		this.getOrderInfo(option.oid);
+	},
+	methods: {
+		radioChange(e){
+			console.log(e)
+		},
+		getOrderInfo(id) {
+			this.$u.api.getOrderInfo({
+				order_id: id,
+			}).then(res => {
+				if(res.errCode == 0) {
+					// this.orderInfo = res.data;
+					this.goodsList = res.data.extend_order_goods;
+					console.log(this.goodsList);
+				}
+				// uni.stopPullDownRefresh(); // 结束刷新
+			})
+		},
+		applyRefund() {
+			let params = {
+				order_id: this.order.order_id,
+				// goods_id: goods_id,
+				// refund_amount: refund_amount,
+			}
+			this.$u.api.refundOrder(params).then(res => {
+				this.$u.toast(res.message);
+				if(res.errCode == 0) {
+
+				}
+			})
+		},
+	}
+};
+</script>
+<style lang="scss" scoped>
+.refund {
+	min-height: calc(100vh - var(--window-top));
+	background-color: #EDEDED;
+	.radios-container {
+		margin-bottom: 20rpx;
+		.radio-view {
+			background-color: #FFFFFF;
+			padding: 26rpx;
+			display: flex;
+			align-items: center;
+			margin-bottom: 1rpx;
+			.radio {
+				margin-right: 20rpx;
+			}
+			.store_info {
+				display: flex;
+				flex-wrap: nowrap;
+				width: 100%;
+				.info_img{
+					>image{
+						width: 180rpx;
+						height: 160rpx;
+						background-color: aqua;
+						border-radius: 10rpx;
+					}
+				}
+				.info_txt{
+					padding-left: 30rpx;
+					padding-right: 30rpx;
+					display: flex;
+					flex-wrap: wrap;
+					width: 100%;
+					.content{
+						height: 74rpx;
+						line-height: 37rpx;
+						font-size: 30rpx;
+						color:rgba(51,51,51,1);
+					}
+					.much{
+						display: flex;
+						justify-content: space-between;
+						width: 100%;
+					}
+				}
+			}
+		}
+	}
+	.refund-details {
+		background-color: #FFFFFF;
+		.goods-number {}
+	}
+}
+</style>