开始做充值，，调整了首页

components/avatar/index.wxss

@@ -13,4 +13,5 @@
 .text {
   max-width: 100rpx;
   overflow: hidden;
+  white-space: nowrap;
 }

components/customStatusBar/index.wxml

@@ -1,2 +1,3 @@
 <!--components/customStatusBar/index.wxml-->
-<view class="wrapper" style="height: {{height}}px;"></view>
+<view wx:if="{{transparent}}" class="wrapper" style="height: {{height}}px;"></view>
+<view wx:else class="wrapper background" style="height: {{height}}px;"></view>

components/customStatusBar/index.wxss

@@ -1 +1,4 @@
-/* components/customStatusBar/index.wxss */
+/* components/customStatusBar/index.wxss */
+.background {
+  background-color: var(--deep-green);
+}

components/navigator/index.js

@@ -35,7 +35,7 @@ Component({
    */
   methods: {
     back() {
-      wx.navigateBack();
+      this.triggerEvent("back")
     }
   }
 })

components/navigator/index.json

@@ -1,6 +1,7 @@
 {
   "component": true,
   "usingComponents": {
-
+    "customStatusBar": "/components/customStatusBar/index",
+    "van-icon": "@vant/weapp/icon/index"
   }
 }

components/navigator/index.wxml

@@ -1,9 +1,13 @@
-<view class="navigator" style="height: {{(statusBarHeight + 46)}}px;">
-  <view class="navigatorTitle">
-
-    {{title}}
+<!-- 使用fixed定位 -->
+<view class="navigator">
+  <view class="navigator" style="height: {{statusBarHeight + 46}}px;">
+    <view class="navigatorTitle">
+      {{title}}
+    </view>
+    <view class="backWrapper"  bind:tap="back">
+      <van-icon name="arrow-left" wx:if="{{canBack}}" class="back" />
+    </view>
   </view>
-  <view class="backWrapper">
-    <image src="/assets/images/left.png" bind:tap="back" wx:if="{{canBack}}" class="back" />
-  </view>
-</view>
+</view>
+<!-- 填充fixed定位页面被覆盖的组件 -->
+<view class="wrapper" style="height: {{statusBarHeight + 46}}px"></view>

components/navigator/index.wxss

@@ -4,14 +4,21 @@
   display: flex;
   align-items: flex-end;
   position: relative;
+  background-color: var(--deep-green);
+  color: #fff;
+  position: fixed;
+  left: 0;
+  right: 0;
+  top: 0;
 }
 
 .navigatorTitle {
   display: flex;
   justify-content: center;
   align-items: center;
+  text-align: center;
   height: 46px;
-  width: 100%;
+  width: 100vw;
 }
 
 .back {
@@ -25,10 +32,15 @@
 .backWrapper {
   display: flex; 
   width: 100%; 
+  width: 100rpx;
   background-color: transparent;
   height: 46px;
   position: absolute;
   bottom: 0;
   left: 0;
   align-items:center;
+}
+
+.navigator {
+  display: flex;
 }

components/navigatorWrapper/index.js

@@ -0,0 +1,36 @@
+// components/navigatorWrapper/index.js
+Component({
+
+  /**
+   * 组件的属性列表
+   */
+  properties: {
+    statusBarHeight: 0,
+  },
+  attached: function() {
+    const that = this;
+    wx.getSystemInfo({
+      success: function (res) {
+        that.setData({
+          statusBarHeight : res.statusBarHeight,
+          navBarHeight : res.statusBarHeight , // 顶部导航栏高度为 44px
+          jiaonangheight: wx.getMenuButtonBoundingClientRect().height, // 胶囊高度
+          jiaonangwidth:wx.getMenuButtonBoundingClientRect().width,
+        })
+      },
+    })
+  },
+  /**
+   * 组件的初始数据
+   */
+  data: {
+
+  },
+
+  /**
+   * 组件的方法列表
+   */
+  methods: {
+
+  }
+})

components/navigatorWrapper/index.json

@@ -0,0 +1,4 @@
+{
+  "component": true,
+  "usingComponents": {}
+}

components/navigatorWrapper/index.wxml

@@ -0,0 +1,2 @@
+<!-- 由于自定义navigator，使用了固定定位，所以需要一个同等高度的东西填充这段空白，防止内容被遮挡 -->
+<view class="wrapper" style="height: {{statusBarHeight + 46}}px"></view>

components/navigatorWrapper/index.wxss

@@ -0,0 +1 @@
+/* components/navigatorWrapper/index.wxss */

components/picker/index.js

@@ -11,7 +11,8 @@ Component({
     },
     show: Boolean,
     columns: Array,
-    type: String
+    type: String,
+    title: String,
   },
 
   /**

components/picker/index.wxml

@@ -3,9 +3,17 @@
   show="{{ show }}" 
   position="bottom"
   bind:close="onClose"
+  
 >
   <view style="width: 100vw;">
-    <van-picker   show-toolbar
-  title="标题" columns="{{ columns }}" bind:change="onChange" value-key="name" bind:confirm="confirm" bind:cancel="cancel" />
+    <van-picker   
+      show-toolbar
+      title="{{title}}" 
+      columns="{{ columns }}" 
+      bind:change="onChange" 
+      value-key="name" 
+      bind:confirm="confirm" 
+      bind:cancel="cancel" 
+    />
   </view>
 </van-popup>