我的-资金明细页面

packages/packagesInfo/pages/moneyList/list.vue

@@ -1,8 +1,76 @@
 <template>
+	<view class="wrap">
+		<view class="moneylistbox">
+			<view class="moneylist-item">
+				<view class="moneylist-item-info">
+					<text class="top-up">充值￥ 1000</text>
+					<text>充值时间 2021-01 11：22</text>
+				</view>
+				<view class="moneylist-item-info">
+					<text>微信</text>
+					<text>订单编号：202215612333</text>
+				</view>
+			</view>
+			<view class="moneylist-item">
+				<view class="moneylist-item-info">
+					<text class="top-up">充值￥ 1000</text>
+					<text>充值时间 2021-01 11：22</text>
+				</view>
+				<view class="moneylist-item-info">
+					<text>支付宝</text>
+					<text>订单编号：202215612333</text>
+				</view>
+			</view>
+			<view class="moneylist-item">
+				<view class="moneylist-item-info">
+					<text class="top-up">充值￥ 1000</text>
+					<text>充值时间 2021-01 11：22</text>
+				</view>
+				<view class="moneylist-item-info">
+					<text>微信</text>
+					<text>订单编号：202215612333</text>
+				</view>
+			</view>
+		</view>
+	</view>
 </template>
-
 <script>
+	
 </script>
 
-<style>
+<style style="text/css" scoped>
+	.wrap{
+		width: 100%;
+		height: 100vh;
+		background: #e7f5f4;
+		padding: 30rpx;
+		position: relative;
+	}
+	.moneylistbox{
+		background: #fff;
+		padding-bottom: 100%;
+		border-radius: 4rpx;
+		padding: 34rpx;
+		box-shadow: 0 2rpx 20rpx rgba(86,98,109,.16);
+	}
+	.moneylist-item{
+		
+		padding-bottom: 30rpx;
+		margin-bottom: 30rpx;
+		border-bottom: 1rpx solid #eaeaea;
+	}
+	.moneylist-item-info{
+		display: flex;
+		justify-content: space-between;
+	}
+	.moneylist-item text{
+		font-size: 24rpx;
+		color: #696766;
+		line-height: 40rpx;
+		
+	}
+	.moneylist-item text.top-up{
+		font-size: 26rpx;
+		color: #303233;
+	}
 </style>