业主绑定页面画完

app.json

@@ -1,8 +1,8 @@
 {
-  "pages": [
-    
+  "pages": [ 
     "pages/index/index",
     "pages/bindOwner/bindOwner",
+    "pages/viewBindOwner/viewBindOwner",
     "pages/family/family",
     "pages/circle/circle",
     "pages/location/location",
@@ -55,7 +55,14 @@
   "usingComponents": {
       "van-button": "lib/button/index",
       "van-toast":"lib/toast/index",
-      "van-field": "lib/field/index"
+      "van-field": "lib/field/index",
+      "van-area": "lib/area/index",
+      "van-popup": "lib/popup/index",
+      "van-panel": "lib/panel/index",
+      "van-steps": "lib/steps/index",
+      "van-cell": "lib/cell/index",
+      "van-cell-group": "lib/cell-group/index"
+            
   },
   "sitemapLocation": "sitemap.json"
 }

constant/MappingConstant.js

@@ -9,6 +9,7 @@ class MappingConstant{
   static LOGIN_FLAG = 'loginFlag'; //登录标识
   static TOKEN = "token"; // token 标识
   static USER_INFO = "userInfo"; // 用户信息
+  static AREA_INFO = "areaInfo"; // 地区信息
 }
 
 

context/Java110Context.js

@@ -51,6 +51,66 @@ const getLoginFlag = function(){
   return _loginFlag;
 }
 
+const _loadArea = function (_level, _parentAreaCode, callBack = (_areaList)=>{}) {
+  let areaList = wx.getStorageSync(constant.mapping.AREA_INFO);
+  if (areaList){
+    callBack(areaList);
+    return ;
+  }
+  wx.request({
+    url: constant.url.areaUrl,
+    header: getHeaders(),
+    data: {
+      areaLevel: _level,                    // 临时登录凭证
+      parentAreaCode: _parentAreaCode
+    },
+    success: function (res) {
+      console.log('login success');
+      res = res.data;
+      var province = [], city = [], area = [];
+      var _currentArea = [];
+      province = res.areas.filter(item => {
+        return item.areaLevel == '101';
+      })
+      city = res.areas.filter(item => {
+        return item.areaLevel == '202';
+      })
+      area = res.areas.filter(item => {
+        return item.areaLevel == '303';
+      });
+      var provinceList = {};
+      province.forEach(function(item){
+        provinceList[item.areaCode] = item.areaName;
+      });
+
+      var cityList = {};
+      city.forEach(function (item) {
+        cityList[item.areaCode] = item.areaName;
+      });
+      var quyuList  = {};
+      area.forEach(function (item) {
+        quyuList[item.areaCode] = item.areaName;
+      });
+      let areaList = {
+        province_list: provinceList,
+        city_list: cityList,
+        county_list: quyuList
+      };
+      callBack(areaList);
+      //将 地区信息存储起来
+      wx.setStorageSync(constant.mapping.AREA_INFO, areaList);
+    },
+
+    fail: function (error) {
+      // 调用服务端登录接口失败
+      wx.showToast({
+        title: '调用接口失败',
+      });
+      console.log(error);
+    }
+  })
+}
+
 module.exports = {
   constant: constant,
   util: util,
@@ -58,5 +118,6 @@ module.exports = {
   getHeaders: getHeaders,
   getLocation: getLocation,
   getUserInfo: getUserInfo,
-  getLoginFlag: getLoginFlag
+  getLoginFlag: getLoginFlag,
+  _loadArea: _loadArea
 };

pages/bindOwner/bindOwner.js

@@ -1,6 +1,7 @@
 // pages/enterCommunity/enterCommunity.js
 const context = require('../../context/Java110Context.js')
 
+
 Page({
 
   /**
@@ -8,17 +9,37 @@ Page({
    */
   data: {
     areaCode:'',
+    areaName:'',
     communityName:'',
     appUserName:'',
     idCard:'',
     link:'',
-    msgCode:'' 
+    msgCode:'',
+    areaShow:false,
+    areaList:{
+      province_list: {
+        
+      },
+      city_list: {
+        
+      },
+      county_list: {
+        
+      }
+    }
   },
 
   /**
    * 生命周期函数--监听页面加载
    */
   onLoad: function (options) {
+    let _that = this;
+    //加载省份
+    context._loadArea('','',function(_areaList){
+      _that.setData({
+        areaList: _areaList
+      });
+    });
 
   },
 
@@ -51,7 +72,7 @@ Page({
    * 生命周期函数--监听页面卸载
    */
   onUnload: function () {
-
+    
   },
 
   /**
@@ -92,6 +113,35 @@ Page({
   },
   bindOwner:function(){
       console.log(this.data);
-  }
+      //成功情况下跳转
+      wx.navigateTo({
+        url: "/pages/viewBindOwner/viewBindOwner"
+      })
+  },
+  onConfirm:function(e){
+    console.log("onConfirm",e);
+    let _areaCode = e.detail.values[2].code;
+    let _areaName = e.detail.values[1].name + e.detail.values[2].name;
+    this.setData({
+      areaCode: _areaCode,
+      areaName: _areaName,
+      areaShow: false
+    });
+  },
+  onChange:function(e){
+      console.log(e);
+  },
+  chooseArea:function(e){
+    this.setData({
+      areaShow:true
+    });
+  },
+  onCancel:function(e){
+    this.setData({
+      areaShow: false
+    });
+  },
+
+ 
 
 })

pages/bindOwner/bindOwner.wxml

@@ -1,7 +1,7 @@
 <view>
   <view class="block__title">小区信息</view>
   <van-cell-group>
-    <van-field value="{{ username }}" required clearable label="市/区" icon="question-o" placeholder="请选择市/区" />
+    <van-field value="{{ areaName }}" required readonly label="市/区" icon="arrow" catchtap="chooseArea" placeholder="请选择市/区" />
 
     <van-field value="{{ communityName }}" bindinput="bindInput" data-name="communityName" label="小区名称" placeholder="请输入小区名称" required border="{{ false }}" />
   </van-cell-group>
@@ -12,7 +12,7 @@
     <van-field value="{{ idCard }}" bindinput="bindInput" data-name="idCard" type="idcard" label="身份证" placeholder="请输入身份证" required  />
     <van-field value="{{ link }}" bindinput="bindInput" data-name="link" type="number" label="手机号" placeholder="请输入手机号" required />
     <van-field value="{{ msgCode }}" bindinput="bindInput" data-name="msgCode" center clearable label="验证码" placeholder="请输入短信验证码" required use-button-slot>
-      <van-button slot="button" size="small" type="primary" catchtap="sendMsgCode">发送验证码</van-button>
+      <van-button slot="button" type="number" size="small" type="primary" catchtap="sendMsgCode">发送验证码</van-button>
     </van-field>
   </van-cell-group>
 
@@ -20,4 +20,18 @@
 
   <van-button type="primary"  size="large" catchtap="bindOwner">绑定业主</van-button>
 
-</view>
+ 
+
+  <van-popup
+    show="{{ areaShow }}"
+    position="bottom"
+    custom-style="height: 40%;"
+
+  >
+    <van-area area-list="{{ areaList }}" 
+              bind:confirm="onConfirm"
+              bind:change="onChange"
+              bind:cancel="onCancel"
+    />
+  </van-popup>
+</view>

pages/my/my.js

@@ -7,9 +7,6 @@ const app = getApp();
 Page({
     data: {
         userInfo: {},   // 用户信息
-      hasLogin: context.getLoginFlag()
-            ? true 
-            : false     // 是否登录，根据后台返回的skey判断
     },
     onLoad: function() {
       let _that = this;

pages/viewBindOwner/viewBindOwner.js

@@ -0,0 +1,98 @@
+// pages/viewBindOwner/viewBindOwner.js
+Page({
+
+  /**
+   * 页面的初始数据
+   */
+  data: {
+    steps: [
+      {
+        text: '申请',
+        desc: ''
+      },
+      {
+        text: '审核中',
+        desc: ''
+      },
+      {
+        text: '完成',
+        desc: ''
+      }
+    ],
+    active:0,
+    areaName: '',
+    communityId:'',
+    communityName: '',
+    appUserName: '',
+    appUserId:'',
+    idCard: '',
+    link: '',
+
+  },
+
+  /**
+   * 生命周期函数--监听页面加载
+   */
+  onLoad: function (options) {
+    this.setData({
+      areaName: '西宁市城东区',
+      communityId:'7020181217000001',
+      communityName: '格兰小镇',
+      appUserName: '吴学文',
+      appUserId: '772019092507000013',
+      idCard: '632126199109162011',
+      link: '17797173942',
+      active: 1
+    });
+
+  },
+
+  /**
+   * 生命周期函数--监听页面初次渲染完成
+   */
+  onReady: function () {
+
+  },
+
+  /**
+   * 生命周期函数--监听页面显示
+   */
+  onShow: function () {
+
+  },
+
+  /**
+   * 生命周期函数--监听页面隐藏
+   */
+  onHide: function () {
+
+  },
+
+  /**
+   * 生命周期函数--监听页面卸载
+   */
+  onUnload: function () {
+
+  },
+
+  /**
+   * 页面相关事件处理函数--监听用户下拉动作
+   */
+  onPullDownRefresh: function () {
+
+  },
+
+  /**
+   * 页面上拉触底事件的处理函数
+   */
+  onReachBottom: function () {
+
+  },
+
+  /**
+   * 用户点击右上角分享
+   */
+  onShareAppMessage: function () {
+
+  }
+})

pages/viewBindOwner/viewBindOwner.json

@@ -0,0 +1,3 @@
+{
+  "navigationBarTitleText": "业主信息"
+}

pages/viewBindOwner/viewBindOwner.wxml

@@ -0,0 +1,26 @@
+<view>
+  <van-steps
+    steps="{{ steps }}"
+    active="{{ active }}"
+  />
+  <view class="block__title">小区信息</view>
+  <van-cell-group>
+    <van-cell title="市/区" value="{{areaName}}" />
+    <van-cell title="小区编码" value="{{communityId}}" />
+    <van-cell title="小区名称" value="{{communityName}}" />
+  </van-cell-group>
+
+  <view class="block__title">业主信息</view>
+  <van-cell-group>
+    <van-cell title="业主编码" value="{{appUserId}}" />
+    <van-cell title="姓名" value="{{appUserName}}" />
+    <van-cell title="身份证" value="{{idCard}}" />
+    <van-cell title="手机号" value="{{link}}" />
+  </van-cell-group>
+
+   <view class="button_up_blank"></view>
+
+  <block wx:if="{{active == 1}}">
+    <van-button type="danger"  size="large" catchtap="bindOwner">解绑业主</van-button>
+  </block>
+</view>

pages/viewBindOwner/viewBindOwner.wxss

@@ -0,0 +1,14 @@
+/* pages/viewBindOwner/viewBindOwner.wxss */
+
+.block__title {
+  margin: 0;
+  font-weight: 400;
+  font-size: 14px;
+  color: rgba(69,90,100,.6);
+  padding: 60rpx 30rpx 20rpx;
+}
+
+
+.button_up_blank{
+  height: 40rpx;
+}