UI

pages/home/index/index.wxml

@@ -65,6 +65,7 @@
 					<text class="dmArea1-top-right-text">查看更多订单</text>
 				</view>
 			</view>
+			<view class="boderLine"></view>
 			<view class="dmArea1-bottom">
 				<view class="dmArea1-bottom-zt" id="agent50" is-link bindtap="toPage">
 					<view class="dmArea1-bottom-zt-topIcon">
@@ -111,6 +112,7 @@
 					<text class="dmArea2-top-right-text">进入钱包</text>
 				</view>
 			</view>
+			<view class="boderLine"></view>
 			<view class="dmArea2-bottom">
 				<view class="dmArea2-bottom-content">
 					<view class="dmArea2-bottom-contentIconTxt" id="balance" is-link bindtap="toPage">
@@ -151,7 +153,8 @@
 					<text class="dmArea1-top-left-text">其他工具</text>
 				</view>
 			</view>
-			<view class="bg-white padding">
+			<view class="boderLine"></view>
+			<view class="bg-white padding dmArea4Content">
 				<view class="grid col-4 grid-square">
 					<view class="dmArea4Content" id="bidding" is-link bindtap="toPage">
 						<view class="dmArea4ImgView">

pages/home/index/index.wxss

@@ -158,43 +158,14 @@
 
 }
 
-/* .dmArea {
-  width: 686rpx;
-  height: 220rpx;
-  background-color: white;
-  margin-top: 15rpx;
-  margin-left: 32rpx;
-  position: relative;
-  padding: 15rpx 30rpx 15rpx 50rpx;
-} */
-
-.daAreaTietleText {
-  position: relative;
-  font-family: PingFangSC-Medium;
-  font-size: 30rpx;
-  color: rgba(0, 0, 0, 0.85);
-  letter-spacing: 0;
-}
-
-.dmAreaConten {
-  width: 610rpx;
-  height: 212rpx;
-  padding-top: 35rpx;
-}
-
-.iconArea {
-  width: 68rpx;
-  height: 68rpx;
-  margin-left: 5rpx;
-}
-
-
 .boderLine {
-  width: 88%;
+  width: 91%;
   height: 1rpx;
-  border-bottom: 2rpx solid rgb(216, 213, 213);
+  border-bottom: 1rpx solid rgb(235, 235, 235);
   position: absolute;
-  top: 65rpx;
+  top: 72rpx;
+  left: 32rpx;
+  
 }
 
 
@@ -210,6 +181,9 @@
   height: 269rpx;
   padding-bottom: 40rpx;
   background-color: white;
+  border-radius: 10rpx;
+  border-radius: 10rpx;
+  position: relative;
 }
 
 .dmArea1-top {
@@ -297,6 +271,10 @@
   height: 224rpx;
   background-color: white;
   margin-top: 20rpx;
+  border-radius: 10rpx;
+  border-radius: 10rpx;
+  position: relative;
+  
 }
 
 .dmArea2-top {
@@ -413,6 +391,9 @@
   margin-top: 20rpx;
   padding: 23rpx 32rpx 23rpx 33.5rpx;
   background-color: white;
+  border-radius: 10rpx;
+  border-radius: 10rpx;
+  position: relative;
 }
 
 .dmArea3-left {
@@ -462,12 +443,11 @@
   width: 686rpx;
   background-color: white;
   margin-top: 20rpx;
+  border-radius: 10rpx;
+  border-radius: 10rpx;
+  position: relative;
 }
 
-.dmArea4-top {}
-
-.dmArea4Content {}
-
 .dmArea4ImgView {
   height: 68rpx;
   width: 100%;
@@ -494,4 +474,8 @@
   outline: none;
   background-color: unset;
   background-color: transparent;
+}
+
+.dmArea4Content{
+  margin-top: 15rpx;
 }

pages/withdrawal/balance/index.js

@@ -1,6 +1,7 @@
 // pages/withdrawal/balance/index.js
 import { getBalanceInfo } from "../../api/payment"
 const math = require('../../../utils/math')
+const util = require('../../../utils/util')
 
 Page({
   /**
@@ -21,5 +22,12 @@ Page({
     }).catch(err => {
       wx.hideLoading()
     })
+  },
+  toPage:function(e){
+    if (e.currentTarget.id == 'toTx') {
+      util.navigateTo('/pages/withdrawal/vcheckout/index')
+    } else if (e.currentTarget.id == 'toRt') {
+      wx.navigateBack()
+    }
   }
 })

pages/withdrawal/balance/index.wxml

@@ -1,10 +1,33 @@
 <!--pages/withdrawal/balance/index.wxml-->
 <wxs module="formate" src="../../../pages/formate.wxs"></wxs>
-<cu-custom bgColor="bg-white" isBack="{{true}}">
-	<view slot="content">余额</view>
-</cu-custom>
+<view class="topArea">
+	<view class="topHeadArea">
+		<view class="topHeadAreaLeft" id="toRt" bindtap="toPage">
+			<image class="dhImg" src="/assets/myinfo/rtWhite.png"></image>
+		</view>
+		<view class="topText">我的钱包</view>
+	</view>
+	<view>
+		<image class="vipBjImg2" src="/assets/myinfo/vipTopBj.png"></image>
+	</view>
+	<view class="midArea">
+		<view class="view1">我的余额（元）</view>
+		<view class="view2">{{formate.numberFormat(accountMoney)}}</view>
+		<view class="view3">提现中的金额：{{formate.numberFormat(frozenMoney)}}</view>
+		<view class="view4" id="toTx" bindtap="toPage"><button class="view4Btr">提现</button></view>
+	</view>
 
-<view class="bg-white" style="padding: 48rpx;border-bottom:2rpx solid #eee">
+	<view class="bottomView">
+		<wux-cell-group>
+			<wux-cell title="银行卡" is-link url="/pages/bank/vindex/index">
+				<view slot="header" class="cuIcon-vipcard text-black" style="font-size:20px;margin-right:12rpx"></view>
+			</wux-cell>
+		</wux-cell-group>
+	</view>
+
+</view>
+
+<!-- <view class="bg-white" style="padding: 48rpx;border-bottom:2rpx solid #eee">
   <view class="text-black text-sg">我的余额（元）</view>
   <view class="text-black text-sl text-price" style="margin-top:12rpx">{{formate.numberFormat(accountMoney)}}</view>
 </view>
@@ -22,7 +45,4 @@
 	<wux-cell title="银行卡" is-link url="/pages/bank/vindex/index">
 		<view slot="header" class="cuIcon-vipcard text-black" style="font-size:20px;margin-right:12rpx"></view>
 	</wux-cell>
-	<wux-cell title="账单" is-link url="/pages/bank/bill/index">
-		<view slot="header" class="cuIcon-send text-black" style="font-size:20px;margin-right:12rpx"></view>
-	</wux-cell>
-</wux-cell-group>
+</wux-cell-group> -->

pages/withdrawal/balance/index.wxss

@@ -1 +1,121 @@
-/* pages/withdrawal/balance/index.wxss */
+/* pages/withdrawal/balance/index.wxss */
+.topArea {
+  height: 337rpx;
+  background-image: linear-gradient(124deg, rgba(0, 122, 255, 0.67) 0%, rgba(13, 100, 227, 0.95) 100%);
+  position: relative;
+}
+
+.topHeadArea {
+  width: 750rpx;
+  height: 128rpx;
+  position: absolute;
+  top: 0rpx;
+  padding: 32rpx;
+}
+
+.vipBjImg2 {
+  height: 32rpx;
+  width: 100%;
+  position: absolute;
+  bottom: 0rpx;
+}
+
+.topHeadAreaLeft {
+  width: 48rpx;
+  height: 100%;
+  position: absolute;
+  top: 0rpx;
+  left: 0rpx;
+  padding-left: 20rpx;
+  padding-top: 60rpx;
+}
+
+.topText {
+  height: 100%;
+  width: 100%;
+  font-family: PingFangSC-Medium;
+  font-size: 36rpx;
+  color: #FFFFFF;
+  letter-spacing: 0;
+  text-align: center;
+  margin-top: 27rpx;
+}
+
+.dhImg {
+  width: 48rpx;
+  height: 48rpx;
+}
+
+.midArea {
+  background: #FFFFFF;
+  box-shadow: 0 2px 14px 0 rgba(220, 220, 220, 0.50);
+  border-radius: 20rpx;
+  border-radius: 20rpx;
+  width: 686rpx;
+  height: 470rpx;
+  position: absolute;
+  top: 148rpx;
+  left: 32rpx;
+  right: 32rpx;
+  position: relative;
+}
+
+.view1 {
+  font-family: PingFangSC-Regular;
+  font-size: 36rpx;
+  color: rgba(0, 0, 0, 0.75);
+  letter-spacing: 0;
+  text-align: center;
+  width: 100%;
+  height: 50rpx;
+  position: absolute;
+  top: 56rpx;
+  
+}
+
+.view2 {
+  font-family: ArialMT;
+  font-size: 100rpx;
+  color: rgba(0, 0, 0, 0.85);
+  letter-spacing: 0;
+  text-align: center;
+  width: 100%;
+  height: 112rpx;
+  position: absolute;
+  top: 120rpx;
+}
+
+.view3 {
+  font-family: PingFangSC-Regular;
+  font-size: 36rpx;
+  color: rgba(0, 0, 0, 0.50);
+  letter-spacing: 0;
+  width: 100%;
+  height: 50rpx;
+  text-align: center;
+  position: absolute;
+  top: 248rpx;
+}
+
+.view4 {
+  width: 100%;
+  height: 96rpx;
+  padding-left: 24rpx;
+  padding-right: 24rpx;
+  position: absolute;
+  top: 334rpx;
+}
+
+.view4Btr {
+  background: #007AFF;
+  border-radius: 8rpx;
+  border-radius: 8rpx;color: white;
+}
+.bottomView{
+  width: 100%;
+  height: 96rpx;
+  padding-left: 32rpx;
+  padding-right: 32rpx;
+  position: absolute;
+  top: 638rpx;
+}