fix[renard-wx]: renard小程序里面采用微信地址组件的地址，与小程序后台不一致。

renard-wx/pages/ucenter/addressAdd/addressAdd.js

@@ -4,209 +4,340 @@ var check = require('../../../utils/check.js');
 
 var app = getApp();
 Page({
- data: {
-  address: {
-   id: 0,
-   provinceId: 0,
-   cityId: 0,
-   areaId: 0,
-   address: '',
-   name: '',
-   mobile: '',
-   isDefault: 0,
-   provinceName: '',
-   cityName: '',
-   areaName: ''
-  },
-  addressId: 0,
-  openSelectRegion: false,
-  regionType: 1,
-  selectRegionDone: false
- },
- bindinputMobile(event) {
-  let address = this.data.address;
-  address.mobile = event.detail.value;
-  this.setData({
-   address: address
-  });
- },
- bindinputName(event) {
-  let address = this.data.address;
-  address.name = event.detail.value;
-  this.setData({
-   address: address
-  });
- },
- bindinputAddress(event) {
-  let address = this.data.address;
-  address.address = event.detail.value;
-  this.setData({
-   address: address
-  });
- },
- bindIsDefault() {
-  let address = this.data.address;
-  address.isDefault = !address.isDefault;
-  this.setData({
-   address: address
-  });
- },
- getAddressDetail() {
-  let that = this;
-  util.request(api.AddressDetail, {
-   id: that.data.addressId
-  }).then(function(res) {
-   if (res.errno === 0) {
-    if (res.data) {
-     that.setData({
-      address: res.data
-     });
-    }
-   }
-  });
- },
-
- wxChooseAddress() {
-  let that = this;
-  let address = this.data.address;
-  // 用户已经同意小程序使用地址功能
-  wx.chooseAddress({
-   success: function(res) {
-    address.provinceId = 99999;
-    address.cityId = 88888;
-    address.areaId = 77777;
-    address.name = res.userName;
-    address.mobile = res.telNumber;
-    address.provinceName = res.provinceName;
-    address.cityName = res.cityName;
-    address.areaName = res.countyName;
-    address.address = res.provinceName + res.cityName + res.countyName + res.detailInfo;
+  data: {
+    address: {
+      id: 0,
+      provinceId: 0,
+      cityId: 0,
+      areaId: 0,
+      address: '',
+      name: '',
+      mobile: '',
+      isDefault: 0,
+      provinceName: '',
+      cityName: '',
+      areaName: ''
+    },
+    addressId: 0,
+    openSelectRegion: false,
+    selectRegionList: [
+      { id: 0, name: '省份', pid: 1, type: 1 },
+      { id: 0, name: '城市', pid: 1, type: 2 },
+      { id: 0, name: '区县', pid: 1, type: 3 }
+    ],
+    regionType: 1,
+    regionList: [],
+    selectRegionDone: false
+  },
+  bindinputMobile(event) {
+    let address = this.data.address;
+    address.mobile = event.detail.value;
+    this.setData({
+      address: address
+    });
+  },
+  bindinputName(event) {
+    let address = this.data.address;
+    address.name = event.detail.value;
+    this.setData({
+      address: address
+    });
+  },
+  bindinputAddress(event) {
+    let address = this.data.address;
+    address.address = event.detail.value;
+    this.setData({
+      address: address
+    });
+  },
+  bindIsDefault() {
+    let address = this.data.address;
+    address.isDefault = !address.isDefault;
+    this.setData({
+      address: address
+    });
+  },
+  getAddressDetail() {
+    let that = this;
+    util.request(api.AddressDetail, { id: that.data.addressId }).then(function (res) {
+      if (res.errno === 0) {
+        if (res.data) {
+          that.setData({
+            address: res.data
+          });
+        }
+      }
+    });
+  },
+  setRegionDoneStatus() {
+    let that = this;
+    let doneStatus = that.data.selectRegionList.every(item => {
+      return item.id != 0;
+    });
 
     that.setData({
-     address: address,
+      selectRegionDone: doneStatus
+    })
+
+  },
+  chooseRegion() {
+    let that = this;
+    this.setData({
+      openSelectRegion: !this.data.openSelectRegion
     });
-   }
-  });
- },
-
- wxAddress() {
-  let that = this;
-  // 可以通过 wx.getSetting 先查询一下用户是否授权了 "scope.address" 这个 scope
-  wx.getSetting({
-   success(res) {
-    if (!res.authSetting['scope.address']) {
-     wx.authorize({
-      scope: 'scope.address',
-      success() {
-       that.wxChooseAddress();
-      }
-     })
+
+    //设置区域选择数据
+    let address = this.data.address;
+    if (address.provinceId > 0 && address.cityId > 0 && address.areaId > 0) {
+      let selectRegionList = this.data.selectRegionList;
+      selectRegionList[0].id = address.provinceId;
+      selectRegionList[0].name = address.provinceName;
+      selectRegionList[0].pid = 0;
+
+      selectRegionList[1].id = address.cityId;
+      selectRegionList[1].name = address.cityName;
+      selectRegionList[1].pid = address.provinceId;
+
+      selectRegionList[2].id = address.areaId;
+      selectRegionList[2].name = address.areaName;
+      selectRegionList[2].pid = address.cityId;
+
+      this.setData({
+        selectRegionList: selectRegionList,
+        regionType: 3
+      });
+
+      this.getRegionList(address.cityId);
     } else {
-     that.wxChooseAddress();
+      this.setData({
+        selectRegionList: [
+          { id: 0, name: '省份', pid: 0, type: 1 },
+          { id: 0, name: '城市', pid: 0, type: 2 },
+          { id: 0, name: '区县', pid: 0, type: 3 }
+        ],
+        regionType: 1
+      })
+      this.getRegionList(0);
     }
-   }
-  })
- },
-
- onLoad: function(options) {
-  let that = this;
-  // 页面初始化 options为页面跳转所带来的参数
-  console.log(options);
-  if (options.id && options.id != 0) {
-   this.setData({
-    addressId: options.id
-   });
-   this.getAddressDetail();
-  } else {
-   that.wxAddress();
-  }
- },
 
+    this.setRegionDoneStatus();
 
- onReady: function() {
+  },
+  onLoad: function (options) {
+    // 页面初始化 options为页面跳转所带来的参数
+    console.log(options)
+    if (options.id && options.id != 0) {
+      this.setData({
+        addressId: options.id
+      });
+      this.getAddressDetail();
+    }
+  },
+  onReady: function () {
 
- },
+  },
+  selectRegionType(event) {
+    let that = this;
+    let regionTypeIndex = event.target.dataset.regionTypeIndex;
+    let selectRegionList = that.data.selectRegionList;
 
- cancelAddress() {
-  wx.navigateBack();
- },
- saveAddress() {
-  console.log(this.data.address);
-  let address = this.data.address;
+    //判断是否可点击
+    if (regionTypeIndex + 1 == this.data.regionType || (regionTypeIndex - 1 >= 0 && selectRegionList[regionTypeIndex - 1].id <= 0)) {
+      return false;
+    }
 
-  if (address.name == '') {
-   util.showErrorToast('请输入姓名');
+    this.setData({
+      regionType: regionTypeIndex + 1
+    })
 
-   return false;
-  }
+    let selectRegionItem = selectRegionList[regionTypeIndex];
 
-  if (address.mobile == '') {
-   util.showErrorToast('请输入手机号码');
-   return false;
-  }
+    this.getRegionList(selectRegionItem.pid);
 
+    this.setRegionDoneStatus();
 
-  if (address.areaId == 0) {
-   util.showErrorToast('请输入省市区');
-   return false;
-  }
+  },
+  selectRegion(event) {
+    let that = this;
+    let regionIndex = event.target.dataset.regionIndex;
+    let regionItem = this.data.regionList[regionIndex];
+    let regionType = regionItem.type;
+    let selectRegionList = this.data.selectRegionList;
+    selectRegionList[regionType - 1] = regionItem;
 
-  if (address.address == '') {
-   util.showErrorToast('请输入详细地址');
-   return false;
-  }
 
-  if (!check.isValidPhone(address.mobile)) {
-   util.showErrorToast('手机号不正确');
-   return false;
-  }
+    if (regionType != 3) {
+      this.setData({
+        selectRegionList: selectRegionList,
+        regionType: regionType + 1
+      })
+      this.getRegionList(regionItem.id);
+    } else {
+      this.setData({
+        selectRegionList: selectRegionList
+      })
+    }
+
+    //重置下级区域为空
+    selectRegionList.map((item, index) => {
+      if (index > regionType - 1) {
+        item.id = 0;
+        item.name = index == 1 ? '城市' : '区县';
+        item.pid = 0;
+      }
+      return item;
+    });
+
+    this.setData({
+      selectRegionList: selectRegionList
+    })
 
-  let that = this;
-  util.request(api.AddressSave, {
-   id: address.id,
-   name: address.name,
-   mobile: address.mobile,
-   provinceId: address.provinceId,
-   cityId: address.cityId,
-   areaId: address.areaId,
-   address: address.address,
-   isDefault: address.isDefault,
-   provinceName: address.provinceName,
-   cityName: address.cityName,
-   countyName: address.areaName
-  }, 'POST').then(function(res) {
-   if (res.errno === 0) {
-    //返回之前，先取出上一页对象，并设置addressId
-    var pages = getCurrentPages();
-    var prevPage = pages[pages.length - 2];
-    console.log(prevPage);
-    if (prevPage.route == "pages/shopping/checkout/checkout") {
-     prevPage.setData({
-      addressId: res.data
-     });
-
-     try {
-      wx.setStorageSync('addressId', res.data);
-     } catch (e) {
-
-     }
-     console.log("set address");
+
+    that.setData({
+      regionList: that.data.regionList.map(item => {
+
+        //标记已选择的
+        if (that.data.regionType == item.type && that.data.selectRegionList[that.data.regionType - 1].id == item.id) {
+          item.selected = true;
+        } else {
+          item.selected = false;
+        }
+
+        return item;
+      })
+    });
+
+    this.setRegionDoneStatus();
+
+  },
+  doneSelectRegion() {
+    if (this.data.selectRegionDone === false) {
+      return false;
     }
+
+    let address = this.data.address;
+    let selectRegionList = this.data.selectRegionList;
+    address.provinceId = selectRegionList[0].id;
+    address.cityId = selectRegionList[1].id;
+    address.areaId = selectRegionList[2].id;
+    address.provinceName = selectRegionList[0].name;
+    address.cityName = selectRegionList[1].name;
+    address.areaName = selectRegionList[2].name;
+
+    this.setData({
+      address: address,
+      openSelectRegion: false
+    });
+
+  },
+  cancelSelectRegion() {
+    this.setData({
+      openSelectRegion: false,
+      regionType: this.data.regionDoneStatus ? 3 : 1
+    });
+
+  },
+  getRegionList(regionId) {
+    let that = this;
+    let regionType = that.data.regionType;
+    util.request(api.RegionList, { pid: regionId }).then(function (res) {
+      if (res.errno === 0) {
+        that.setData({
+          regionList: res.data.map(item => {
+
+            //标记已选择的
+            if (regionType == item.type && that.data.selectRegionList[regionType - 1].id == item.id) {
+              item.selected = true;
+            } else {
+              item.selected = false;
+            }
+
+            return item;
+          })
+        });
+      }
+    });
+  },
+  cancelAddress() {
     wx.navigateBack();
-   }
-  });
+  },
+  saveAddress() {
+    console.log(this.data.address)
+    let address = this.data.address;
 
- },
- onShow: function() {
-  // 页面显示
+    if (address.name == '') {
+      util.showErrorToast('请输入姓名');
 
- },
- onHide: function() {
-  // 页面隐藏
+      return false;
+    }
 
- },
- onUnload: function() {
-  // 页面关闭
+    if (address.mobile == '') {
+      util.showErrorToast('请输入手机号码');
+      return false;
+    }
+
+
+    if (address.areaId == 0) {
+      util.showErrorToast('请输入省市区');
+      return false;
+    }
+
+    if (address.address == '') {
+      util.showErrorToast('请输入详细地址');
+      return false;
+    }
+
+    if (!check.isValidPhone(address.mobile)) {
+      util.showErrorToast('手机号不正确');
+      return false;
+    }
+
+    let that = this;
+    util.request(api.AddressSave, {
+      id: address.id,
+      name: address.name,
+      mobile: address.mobile,
+      provinceId: address.provinceId,
+      cityId: address.cityId,
+      areaId: address.areaId,
+      address: address.address,
+      isDefault: address.isDefault,
+      provinceName: address.provinceName,
+      cityName: address.cityName,
+      countyName: address.areaName
+    }, 'POST').then(function (res) {
+      if (res.errno === 0) {
+        //返回之前，先取出上一页对象，并设置addressId
+        var pages = getCurrentPages();
+        var prevPage = pages[pages.length - 2];
+        console.log(prevPage);
+        if (prevPage.route == "pages/checkout/checkout") {
+          prevPage.setData({
+            addressId: res.data
+          })
+
+          try {
+            wx.setStorageSync('addressId', res.data);
+          } catch (e) {
 
- }
-});
+          }
+          console.log("set address");
+        }
+        wx.navigateBack();
+      }
+    });
+
+  },
+  onShow: function () {
+    // 页面显示
+
+  },
+  onHide: function () {
+    // 页面隐藏
+
+  },
+  onUnload: function () {
+    // 页面关闭
+
+  }
+})

renard-wx/pages/ucenter/addressAdd/addressAdd.wxml

@@ -1,13 +1,16 @@
 <view class="add-address">
     <view class="add-form">
         <view class="form-item">
-            <input class="input" bindinput="bindinputName" placeholder="姓名" value="{{address.name}}"/>
+            <input class="input" bindinput="bindinputName" placeholder="姓名" value="{{address.name}}" auto-focus/>
         </view>
         <view class="form-item">
             <input class="input" bindinput="bindinputMobile" value="{{address.mobile}}" placeholder="手机号码"/>
         </view>
         <view class="form-item">
-            <input class="input" bindinput="bindinputAddress" value="{{address.address}}" placeholder="详细地址"/>
+            <input class="input" value="{{address.provinceName +  address.cityName + address.areaName}}" disabled="true" bindtap="chooseRegion" placeholder="省份、城市、区县"/>
+        </view>
+        <view class="form-item">
+            <input class="input" bindinput="bindinputAddress" value="{{address.address}}" placeholder="详细地址, 如街道、楼盘号等"/>
         </view>
         <view class="form-default">
             <text bindtap="bindIsDefault" class="default-input {{address.isDefault == 1 ? 'selected' : ''}}">设为默认地址</text>
@@ -18,5 +21,19 @@
         <button class="cannel" bindtap="cancelAddress">取消</button>
         <button class="save" bindtap="saveAddress">保存</button>
     </view>
+
+    <view class="region-select" wx:if="{{openSelectRegion}}">
+      <view class="hd">
+        <view class="region-selected">
+          <view class="item {{item.id == 0 ? 'disabled' : ''}} {{(regionType -1) === index ? 'selected' : ''}}" bindtap="selectRegionType" data-region-type-index="{{index}}" wx:for="{{selectRegionList}}" wx:key="id">{{item.name}}</view>
+        </view>
+        <view class="done {{selectRegionDone ? '' : 'disabled'}}" bindtap="doneSelectRegion">确定</view>
+      </view>
+      <view class="bd">
+      <scroll-view scroll-y class="region-list">
+        <view class="item {{item.selected ? 'selected' : ''}}" bindtap="selectRegion" data-region-index="{{index}}" wx:for="{{regionList}}" wx:key="id">{{item.name}}</view>
+      </scroll-view>
+      </view>
+    </view>
 </view>
 <view class="bg-mask" bindtap="cancelSelectRegion" wx:if="{{openSelectRegion}}"></view>