diff --git a/pages/orderDetails/orderDetails.vue b/pages/orderDetails/orderDetails.vue
new file mode 100644
index 0000000..5d40740
--- /dev/null
+++ b/pages/orderDetails/orderDetails.vue
@@ -0,0 +1,174 @@
+<template>
+	<view class="app">
+		<view class="content">
+			<view class="name">
+				店铺名称
+				<image src="../../static/rowsright.png" mode=""></image>
+			</view>
+			<view class="details">
+				<view class="detailslist">
+					<image src="../../static/shangpingdingdan.png" mode=""></image>
+					<view class="model">
+						<view class="top">
+							<span>酒精棉片 200片</span>
+							<span>￥36.0</span>
+						</view>
+						<view class="bottom">
+							<span class="box">型号：酒精棉片 8盒</span>
+							<span class="box">￥1</span>
+						</view>
+						<view class="refund">
+							申请退款
+						</view>
+					</view>
+				</view>
+				<view class="payinfo">
+					<text class="pay">实付款</text>
+					<text class="price">￥36.0</text>
+				</view>
+
+			</view>
+		</view>
+		<view class="info">
+
+			<span>收货信息：<text>某某某某某某某某某某某某某某某某某某某某某某某某某某某某</text></span>
+			<span>订单编号：<text>1256585698545111</text></span>
+			<span>获得积分：<text>某某某某</text></span>
+			<span>收货信息：<text>30点积分</text></span>
+			<span>付款时间：<text>2022-10-28 11：31：26</text></span>
+			<span>发货时间：<text>2022-10-28 11：31：26</text></span>
+			<span>成交时间：<text>2022-10-28 11：31：26</text></span>
+
+
+		</view>
+	</view>
+</template>
+
+<script>
+	export default {
+		data() {
+			return {
+
+			}
+		},
+		methods: {
+
+		}
+	}
+</script>
+<style lang="scss">
+	.app {
+		height: 100vh;
+		.content {
+			width: 95%;
+			height: 40%;
+			background: #FFFFFF;
+			box-shadow: 0px 9px 31px 9px rgba(0, 0, 0, 0.03);
+			border-radius: 20px;
+			margin: 0 auto;
+			.name {
+				width: 95%;
+				height: 90rpx;
+				font-size: 30rpx;
+				color: #969394;
+				line-height: 90rpx;
+				border-bottom: 1rpx solid #D8D4D4;
+				margin: 0 auto;
+
+				image {
+					width: 15rpx;
+					height: 23rpx;
+					padding-left: 25rpx;
+				}
+			}
+
+			.details {
+				height: 250rpx;
+
+				.detailslist {
+					display: flex;
+
+					image {
+						width: 182rpx;
+						height: 182rpx;
+						margin: 20rpx 0 0 20rpx;
+					}
+					.model {
+						width: 70%;
+						margin: 30rpx 0 0 20rpx;
+						span {
+							font-size: 38rpx;
+							color: #000000;
+						}
+
+						span:nth-child(2) {
+							color: #969394;
+							float: right;
+							margin-right: 30rpx;
+						}
+						.bottom {
+							margin-top: 20rpx;
+						}
+						.box {
+							font-size: 35rpx;
+							color: #969394;
+						}
+						.refund {
+							width: 159rpx;
+							height: 54rpx;
+							line-height: 54rpx;
+							text-align: center;
+							background: #FFFFFF;
+							border: 1px solid #969394;
+							border-radius: 26rpx;
+							font-size: 26rpx;
+							color: #969394;
+							margin: 20rpx 0rpx 20rpx 310rpx;
+						}
+
+					}
+				}
+				.payinfo {
+					width: 95%;
+					margin: 30rpx auto;
+					.pay {
+						font-size: 30rpx;
+						color: #020000;
+					}
+					.price {
+						float: right;
+						font-size: 41rpx;
+						color: #D43953;
+						margin-right: 28rpx;
+					}
+
+				}
+			}
+		}
+		.info {
+			padding-top: 30rpx;
+			height: 50%;
+			background: #FFFFFF;
+			box-shadow: 0px 9px 31px 9px rgba(0, 0, 0, 0.03);
+			width: 95%;
+			margin: 20rpx auto;
+			font-size: 30rpx;
+			color: #020000;
+			span:nth-child(1) {
+				height: 55;
+				line-height: 55rpx;
+				margin-bottom: 40rpx;
+			}
+			span {
+				display: block;
+				height: 65rpx;
+				line-height: 65rpx;
+				margin-left: 20rpx;
+				text {
+					color: #BFBDBE;
+				}
+			}
+
+		}
+	}
+</style>
diff --git a/pages/refundType/refundType.vue b/pages/refundType/refundType.vue
new file mode 100644
index 0000000..a8ba8d0
--- /dev/null
+++ b/pages/refundType/refundType.vue
@@ -0,0 +1,169 @@
+<template>
+	<view class="app">
+		<view class="content">
+			<view class="name">
+				退款商品
+			</view>
+			<view class="details">
+				<view class="detailslist">
+					<image src="../../static/shangpingdingdan.png" mode=""></image>
+					<view class="model">
+						<view class="top">
+							<span>酒精棉片 200片</span>
+							<span>￥36.0</span>
+						</view>
+						<view class="bottom">
+							<span>型号：酒精棉片 8盒</span>
+							<span>×1</span>
+						</view>
+						
+					</view>
+				</view>
+			</view>
+		</view>
+		<view class="refundinfo">
+			<view class="refund">
+				选择退款类型
+			</view>
+			<view class="myrefund">
+				<image class="images" src="../../static/myrefund.png" mode=""></image>
+				<view class="refundfo">
+					<view>我要退款(无需退货)</view>
+					<view class="text">没收到货</view>
+				</view>
+				<image class="picture pictures" src="../../static/rowsright.png" mode=""></image>
+			
+			</view>
+			<view class="myrefund">
+				<image class="images" src="../../static/refundgoods.png" mode=""></image>
+				<view class="refundfo">
+					<view>我要退款退货退款</view>
+					<view class="text">已收到货，需要退还收到的获取</view>
+				</view>
+					<image class="picture" src="../../static/rowsright.png" mode=""></image>
+			</view>
+		</view>
+	</view>
+</template>
+
+<script>
+	export default {
+		data() {
+			return {
+				
+			}
+		},
+		methods: {
+			
+		}
+	}
+</script>
+
+<style lang="scss">
+	.app{
+		height: 100vh;
+		.content {
+				width: 95%;
+				hheight: 302rpx;;
+				background: #FFFFFF;
+				box-shadow: 0px 9px 31px 9px rgba(0, 0, 0, 0.03);
+				border-radius: 20px;
+				margin: 0 auto;
+				.name {
+					width: 95%;
+					height: 90rpx;
+					font-size: 30rpx;
+					color: #030303 ;
+					line-height: 90rpx;
+					border-bottom: 1rpx solid #D8D4D4;
+					margin: 0 auto;
+		
+					image {
+						width: 15rpx;
+						height: 23rpx;
+						padding-left: 25rpx;
+					}
+				}		
+				.details {
+					height: 250rpx;
+					.detailslist {
+						display: flex;		
+						image {
+							width: 182rpx;
+							height: 182rpx;
+							margin: 20rpx 0 0 20rpx;
+						}
+						.model {
+							width: 70%;
+							margin: 30rpx 0 0 20rpx;
+							span {
+								font-size: 38rpx;
+								color: #000000;
+							}	
+							span:nth-child(2) {
+								color: #969394;
+								float: right;
+								margin-right: 30rpx;
+							}	
+							.bottom {
+								margin-top: 20rpx;
+								span{
+									font-size: 35rpx;
+									color: #969394;
+								}
+							}
+						}
+					}
+		
+				}
+			}
+			.refundinfo{
+				width: 95%;
+				height: 302rpx;
+				background: #FFFFFF;
+				box-shadow: 0px 9rpx 31rpx 9rpx rgba(0,0,0,0.03);
+				border-radius: 20rpx;
+				margin: 0 auto;
+				margin-top: 20rpx;
+				font-size: 30rpx;
+				color: #030303;
+				.refund{
+					height: 70rpx;
+					line-height: 70rpx;
+						width: 95%;
+						margin: 0 auto;
+					border-bottom: 1px solid #D8D4D4;
+				}
+				.myrefund{
+					display: flex;
+					width: 95%;
+					margin: 20rpx auto;
+					height: 80rpx;
+					// background-color: red;
+					.images{
+					width: 46rpx;
+					height: 42rpx;
+					margin-top: 20rpx;
+					}
+					.picture{
+						width: 18rpx;
+						height: 27rpx;
+						margin-top: 20rpx;
+						position:absolute;
+						right:60rpx;
+					}	
+					.refundfo{
+						font-size: 28rpx;
+						color: #030303;
+						margin-left: 20rpx;
+					}
+					.text{
+						font-size: 20rpx;
+						color: #BAB7B8;
+					}
+				}
+			}
+
+		}
+
+</style>
diff --git a/static/myrefund.png b/static/myrefund.png
new file mode 100644
index 0000000..5a86eac
Binary files /dev/null and b/static/myrefund.png differ
diff --git a/static/refundgoods.png b/static/refundgoods.png
new file mode 100644
index 0000000..303af4a
Binary files /dev/null and b/static/refundgoods.png differ
diff --git a/static/right.png b/static/right.png
new file mode 100644
index 0000000..d5f8e0a
Binary files /dev/null and b/static/right.png differ
diff --git a/static/rowsright.png b/static/rowsright.png
new file mode 100644
index 0000000..dbf914f
Binary files /dev/null and b/static/rowsright.png differ