1

package1/myCenter/wallet.vue

@@ -1,9 +1,162 @@
 <template>
 	<!-- 我的钱包 -->
+	<view class="page1">
+		<view class="title">
+			<view class="title-sreach">
+				<view class="back-btn" @tap="back" :style="{'top': menuButtonInfo.top +'px'}">
+					<uni-icons type="left" size="28"></uni-icons>
+				</view>
+				<view class="title-name" :style="{'padding-top': menuButtonInfo.top +'px'}">
+					我的钱包
+				</view>
+			</view>
+		</view>
+		<view class="content">
+			<view style="width: 100%;height: 100px;border: 1px solid red;">
+				<view>用户余额(元)</view>
+				<view>268.50</view>
+				<view>
+					钱包安全保障中
+				</view>
+				<view @tap="withDraw" class="">
+					提现
+				</view>
+			</view>
+			<view style="display: flex;">
+				<view style="flex: 1;border: 1px solid green;height: 80px;">
+					<view>配送兼职佣金(元)</view>
+					<view>156.80</view>
+				</view>
+				<view style="flex: 1;border: 1px solid orange;height: 80px;">
+					<view>店铺余额(元)</view>
+					<view>111.70</view>
+					<view @tap="$refs.shopPopup.open()" >
+						筛选
+					</view>
+				</view>
+			</view>
+			<view class="">
+				<view class="" style="display: flex;height: 30px;line-height: 30px;">
+					<view class="" style="flex:1;">
+						余额明细
+					</view>
+					<view class="" style="flex:1;">
+						筛选全部
+					</view>
+				</view>
+				<view class="" style="display: flex;text-align: center;height: 80px;border: 1px solid #000;">
+					<view style="flex: 1;text-align: left;">
+						<img src="/static/images/dingdan/dd0.png" alt="" style="width: 50px;height: 50px;background-size: 100%;">
+					</view>
+					<view class="" style="flex: 1;">
+						<view class="">
+							配送兼职收入
+						</view>
+						<view class="">
+							订单号:#8257461
+						</view>
+					</view>
+					<view class="" style="flex: 1;">
+						<view class="">
+							-23.50
+						</view>
+						<view class="">
+							05-20 18:30
+						</view>
+					</view>
+				</view>
+			</view>
+		</view>
+		
+		<uni-popup ref="shopPopup" type="bottom" background-color="#F5F8F5">
+			<view style="width: 100%; height: 800rpx; display: flex; flex-direction: column;">
+				<view style="height: 100rpx; line-height: 100rpx; text-align: center; font-size: 32rpx; font-weight: bold; border-bottom: 1px solid #eee; position: relative; background: #fff;">
+					选择店铺
+					<uni-icons type="closeempty" size="24" @tap="$refs.couponPopup.close()" style="position: absolute; right: 30rpx; top: 0;"></uni-icons>
+				</view>
+				<view class="">
+					<view>我的店铺一</view>
+					<view>我的店铺二</view>
+				</view>
+			</view>
+		</uni-popup>
+	</view>
 </template>
 
 <script>
+	export default {
+		data() {
+			return {
+				menuButtonInfo: {},
+			}
+		},
+		onLoad(option) {
+			
+		},
+		onShow() {
+			this.menuButtonInfo = uni.getMenuButtonBoundingClientRect()
+		},
+		methods: {
+			//提现
+			withDraw(){
+				uni.showToast({
+					title:'提现成功'
+				})
+			},
+			back() {
+				uni.navigateBack()
+			}
+		}
+	
+	}
 </script>
 
-<style>
+<style lang="scss">
+	page {
+		width: 100%;
+		height: 100%;
+		font-size: 24rpx;
+		background: #F5F8F5;
+		color: #00231C;
+	}
+	
+	.page1 {
+		width: 100%;
+		height: 100%;
+		font-size: 24rpx;
+		position: relative;
+	}
+	
+	.title{
+		background: url('https://jewel-shop.oss-cn-beijing.aliyuncs.com/8bc15960c2dc40268e295d6dd23aecce.png') no-repeat;
+		width: 100%;
+		height: 54%;
+	}
+	
+	.content{
+		position: absolute;
+		top: 200rpx;
+		width: 95%;
+		margin-left: 2.5%;
+	}
+	
+	.title-sreach{
+		width: 100%;
+		display: flex;
+		height: 200rpx;
+		position: relative;
+	}
+	
+	.back-btn{
+		position: absolute;
+		bottom: 0;
+		left: 20rpx;
+	}
+	.title-name{
+		padding-top: 110rpx;
+		font-size: 36rpx;
+		font-weight: 700;
+		flex: 1;
+		text-align: center;
+	}
 </style>