<!--pages/mine/information.wxml-->
<view class="container">
     <view class="userInfo bg-color-white">
      <view class="userInfo-hd">
          <text class="font-color-333 font-size-18">我的登录信息</text>
          <text class="font-color-999">由微信授权登录</text>
      </view>
         <view class="userInfo-bd font-size-18">{{userInfo.nickName}}</view>
         <image class="avatarsize" src="{{userInfo.avatarUrl}}" background-size="cover"></image>
     </view>
     <view class="hd-title font-color-999">
         以下请务必填写真实信息,负责将影响资金结算
     </view>
     <view class="listgroup" style="margin-top:0;">
           <navigator url="enterInput?type=name&name={{user.name}}" class="view-list arrow-right line-before-bottom " hover-class="weui-cell_active">
              <view class="list__hd">
                    <view class="weui-label font-color-666">真实姓名</view>
            </view>
            <view class="list__bd">
                 <view class="choose">{{user.name}}</view>
            </view>
           </navigator>
            <navigator url="enterInput?type=phone&phone={{user.phone}}" class="view-list arrow-right line-before-bottom" hover-class="weui-cell_active">
               <view class="list__hd">
                    <view class="weui-label font-color-666">手机号码</view>
                 </view>
            <view class="list__bd">
               <view class="choose">{{user.phone}}</view>
            </view>
           </navigator>
          <view  class="view-list arrow-right  line-before-bottom" >
                 <view class="list__hd">
                    <view class="weui-label font-color-666">客户性别</view>
            </view>
            <view class="list__bd ">
                <view class="weui-cell__bd">
                    <picker bindchange="bindSexChange" value="{{sexIndex}}" range="{{sexs}}">
                        <view class=" choose">{{user.sex || sexs[sexIndex]}}</view>
                    </picker>
                </view> 
               
            </view>
           </view>
            <view class="view-list arrow-right" >
            <view class="list__hd">
                    <view class="weui-label font-color-666">客户年龄</view>
            </view>
            <view class="list__bd">                
              <view class="weui-cell__bd">
                    <picker bindchange="bindAgeChange" value="{{ageIndex}}" range="{{ages}}">
                       <view class="choose">{{user.age || ages[ageIndex]}}</view>
                    </picker>
                </view> 
            </view>
        </view>
     </view>
     <view class="listgroup">
           <navigator url="bankCard" class="view-list arrow-right" hover-class="weui-cell_active">
              <view class="list__hd">
                    <view class="weui-label font-color-666">结算银行卡</view>
            </view>
            <view class="list__bd">
                 <view class="choose">工商银行(2245)</view>
            </view>
           </navigator>
    </view>      
     <view class="listgroup">
           <navigator url="authentication" class="view-list arrow-right " hover-class="weui-cell_active">
              <view class="list__hd">
                    <view class="weui-label font-color-666">身份验证</view>
            </view>
            <view class="list__bd">
                 <view class="choose"><image class="icon" src="/assets/images/my_rz@2x.png"></image>已验证</view>
            </view>
           </navigator>
    </view>     
     <view class="butbox" style="margin:40rpx auto 30rpx; ">
             <view bindtap="backWind" class="but bg-color-c24e4e font-color-white">保存资料</view>
      </view>
</view>

/* pages/mine/information.wxss */
@import '/assets/styles/view-input.wxss';
.userInfo {
    margin-top: 20rpx;
    padding: 0 40rpx;
    display: flex;
    flex-direction: row;
    align-items: center;
    position: relative;
    height: 210rpx;
}
.userInfo .avatarsize {
  width: 150rpx;
  height: 150rpx;
  border-radius: 50%;
  margin-left: 40rpx;
}
.userInfo-hd {
  display: flex;
  flex-direction: column;
}
.userInfo-bd {
  display: flex;
  flex: 1;
  justify-content: flex-end;
}

.listgroup{
    margin-top: 20rpx;
}
.view-list .choose{
    display: flex;
    justify-content: flex-end;
    font-size:36rpx;
}

.view-list .choose .icon{
    width:50rpx;
    height: 50rpx;
    margin-right: 20rpx;
}

// pages/mine/information.js
const app=getApp();
Page({
  data:{
     sexs: ["男", "女"],
     sexIndex: null,
     ages:["20岁以下","20~30岁",'30~40岁','50~60岁','60岁以上'],
     ageIndex:null
  },
  onLoad:function(options){
    // 页面初始化 options为页面跳转所带来的参数
  app.getUserInfo((userInfo)=>{
      //更新数据
      this.setData({
        userInfo:userInfo,
        user:{
          name:'测试',
          phone:'13297090782',
          sex:'男',
          age:'20~30岁',
        }
      })
    })
     
    
  },
   bindSexChange(e) {
          console.log('picker account 发生选择改变，携带值为', e.detail.value);
          this.setData({
              "sexIndex": e.detail.value,
              "user.sex":this.data.sexs[e.detail.value]
          })
      },
  bindAgeChange (e) {
      this.setData({
          "ageIndex": e.detail.value,
           "user.age":this.data.ages[e.detail.value]
      });
  },
  backWind(){
     //关闭并返回 
     wx.navigateBack({
       delta: 1, // 回退前 delta(默认为1) 页面
       success: function(res){
         // success
       },
       fail: function() {
         // fail
       },
       complete: function() {
         // complete
       }
     })
  },
  changeData(data){
     let changetype=data.name || data.phone;
     if(data.name){
       this.setData({
         "user.name": changetype
       })
     }else{
        this.setData({
         "user.phone": changetype
       })

     }
  },
  onReady:function(){
    // 页面渲染完成
  },
  onShow:function(){
    // 页面显示
  },
  onHide:function(){
    // 页面隐藏
  },
  onUnload:function(){
    // 页面关闭
  }
})