登录页自定义头部

pages/phonePassword/phonePassword.js

@@ -9,6 +9,7 @@ Page({
    * 页面的初始数据
    */
   data: {
+    statusBarHeight: wx.getSystemInfoSync()['statusBarHeight'],
     show: true, // 默认显示的是闭眼睛
     form: {
       currdatetime: '',
@@ -25,10 +26,8 @@ Page({
       show: !this.data.show
     })
   },
-  back(){
-    wx.navigateBack({
-      delta: 1
-    })
+  goBack(){
+    wx.navigateBack()
   },
   // 改变验证码
   handleChangeCheckCode() {

pages/phonePassword/phonePassword.wxml

@@ -1,8 +1,14 @@
 <!--pages/meeting/meeting.wxml-->
 <view class="container-box">
   <view class="home-bg">
-    <!-- 顶部背景图 mode="scaleToFill" 按照宽高填充，忽略图片原比例-->
-    <image mode="scaleToFill" src="../../assets/images/login-bg.png"></image>
+    <!-- 自定义头部start -->
+    <view class="custom flex_center back-none" style="padding-top:{{statusBarHeight}}px;">
+      <image src="../../assets/images/back-white.png" bindtap="goBack"></image>
+      <text>登录</text>
+    </view>
+    <view class="empty_custom back-none" style="padding-top:{{statusBarHeight}}px"></view><!-- 空view用来填充自定义头部的padding-top -->
+    <!-- 自定义头部end -->
+    <image class="bg-image" mode="scaleToFill" src="../../assets/images/login-bg.png"></image>
     <view class="bg-text">
       <text>您好，欢迎使用</text>
       <text>标准所协同工作平台</text>
@@ -39,7 +45,7 @@
       <button type="primary" formType="submit">登录</button>
     </view>
     <view bindtap="forget" class="forget">
-      <text bindtap="back">手机验证码登录</text>
+      <text bindtap="goBack">手机验证码登录</text>
     </view>
   </form>
 </view>

pages/phonePassword/phonePassword.wxss

@@ -10,11 +10,23 @@ page {
   transform: translateY(-50px) !important;
 }
 .home-bg{
+  position: relative;
   height: 200pt;
 }
+.home-bg .bg-image{
+  position: absolute;
+  top: 0;
+  left: 0;
+}
+.back-none{
+  background-color: none !important;
+}
+.back-none text{
+  color: #fff !important;
+}
 .bg-text{
-  position: relative;
-  top: -100pt;
+  bottom: 50pt;
+  position: absolute;
   left: 34pt;
   color: #fff;
 }
@@ -154,4 +166,4 @@ page {
   right: 10px;
   top: 58%;
   z-index: 9;
-}
+}