顶部导航组件

pages/address-switch/address-switch.js

@@ -0,0 +1,68 @@
+// pages/address-switch/address-switch.js
+Page({
+
+  /**
+   * 页面的初始数据
+   */
+  data: {
+
+  },
+  showSearchPanel: function(e){
+    console.log(e)
+  },
+  /**
+   * 生命周期函数--监听页面加载
+   */
+  onLoad: function (options) {
+
+  },
+
+  /**
+   * 生命周期函数--监听页面初次渲染完成
+   */
+  onReady: function () {
+
+  },
+
+  /**
+   * 生命周期函数--监听页面显示
+   */
+  onShow: function () {
+
+  },
+
+  /**
+   * 生命周期函数--监听页面隐藏
+   */
+  onHide: function () {
+
+  },
+
+  /**
+   * 生命周期函数--监听页面卸载
+   */
+  onUnload: function () {
+
+  },
+
+  /**
+   * 页面相关事件处理函数--监听用户下拉动作
+   */
+  onPullDownRefresh: function () {
+
+  },
+
+  /**
+   * 页面上拉触底事件的处理函数
+   */
+  onReachBottom: function () {
+
+  },
+
+  /**
+   * 用户点击右上角分享
+   */
+  onShareAppMessage: function () {
+
+  }
+})

pages/address-switch/address-switch.json

@@ -0,0 +1 @@
+{}

pages/address-switch/address-switch.wxml

@@ -0,0 +1,41 @@
+<view class="area-search-bar">
+  <view class="city-select md-select">
+    <text>{{geoAddress.city_name}}</text>
+    <span class="icon icon-down"></span>
+  </view>
+  <input placeholder="搜索写字楼，小区，学校等" class="area-search-ipt" disabled="true" bindtap="showSearchPanel" />
+</view>
+
+<view class="warning-bar">因就近匹配门店配送服务，请选择准确收货地址</view>
+<view class="location-local gray-title">当前位置</view>
+<view class="local-address" bindtap="selectAddress" data-current-pos="{{currentPos}}" data-send-sta="{{sendSta}}" data-type="currentPos" class="{{!showSendSta ? 'spb' : ''}}">
+  <text>{{addressLine}}</text>
+  <block wx:if="{{showSendSta}}">
+    <text class="send-status" wx:if="{{sendSta == 1}}">支持配送</text>
+    <text class="send-status no" wx:if="{{sendSta == 0}}">不支持配送</text>  
+  </block> 
+  <block wx:else>
+    <text class="get-pos-again" catchtap="getCurrentPos" data-active="active">
+      <span class="icon icon-geocoder"></span>
+      <text>重新定位</text>
+    </text>
+  </block>
+</view>
+
+<view class="gray-title">我的收货地址</view>
+<view class="my-address-list">
+  <view class="address-list">
+    <view class="address-item" wx:for="{{addressList}}" data-item="{{item}}" data-delivery-sta="{{item.delivery_sta}}" bindtap="selectAddress">
+      <view class="basic-info">
+        <text class="user-name">{{item.username}}</text>
+        <text class="user-phone">{{item.tel}}</text>
+        <text class="send-status" wx:if="{{item.delivery_sta == 1}}">支持配送</text>
+        <text class="send-status no" wx:else>不支持配送</text> 
+      </view>
+      <view class="address-info">{{item.province_name + item.city_name + item.district_name + ' ' +
+                     item.addressline + item.house_number}}</view>
+    </view>
+  </view>
+</view>
+
+<button type="primary" hover-class="none" class="btn-add-address">+新增地址</button>

pages/address-switch/address-switch.wxss

@@ -0,0 +1 @@
+/* pages/address-switch/address-switch.wxss */

template/top-nav-sel/top-nav-sel.js

@@ -0,0 +1,18 @@
+/**
+ * 顶部导航组件
+ *
+ * @author xiaobin_wu
+ */
+class topNavSel {
+  constructor(pageContext) {
+    this.page = pageContext; //获取页面上下文
+    this.page._toSwitchAddress = this._toSwitchAddress.bind(this);
+  }
+  //跳转页面
+  _toSwitchAddress(e) {
+    wx.navigateTo({
+      url: '../address-switch/address-switch'
+    });
+  }
+}
+module.exports = topNavSel;

template/top-nav-sel/top-nav-sel.wxml

@@ -0,0 +1,11 @@
+<template name="topNavSel">
+  <view class="top-nav-sel">
+    <view class="address-select">
+      <image src="../../image/0.5h.png"></image>
+      <view class="address-contianer" bindtap="_toSwitchAddress">
+        <text class="local_address">{{address}}</text>
+        <span class="icon icon-down"></span>
+      </view>
+    </view>
+  </view>
+</template> 

template/top-nav-sel/top-nav-sel.wxss

@@ -0,0 +1,33 @@
+.top-nav-sel{
+  position: relative;
+  height: 90rpx;
+  background-color: #fff;
+  border-bottom: solid #e8e8e8 3rpx;
+  text-align: center;
+}
+.address-select{
+    display: flex;
+    align-items: center;
+    justify-content: center;
+    height: 90rpx;
+    font-size: 0;
+}
+.address-select image{
+    width: 120rpx;
+    height: 24rpx;
+}
+.address-select .address-contianer{
+    display: flex;
+    align-items: center;
+    color:#222;
+    font-size: 30rpx;
+}
+ .address-select .local_address{
+    max-width: 300rpx;
+    overflow: hidden;
+    text-overflow: ellipsis;
+    white-space: nowrap;
+}
+ .address-select .icon-down{
+    font-size: 28rpx;
+}