<template>
  <div id="index_login_container" class="animation-slide-right">
    <view class="solid-bottom text-xl padding text-center">
      <img class="back regist_back_btn" @click="goIndex" src="https://img.shuimuai.com/fanhui.png"/>
      <text class=" text-bold title_color">注册会员</text>
    </view>
    <view class="text-df text-center slogen">请输入手机号码，以便更好的享受我们的服务</view>
    <div class="register_form_container text-center">
      <form action="">
        <view class="cu-form-group">
          <view class="title">手机号码</view>
          <input placeholder="请输入手机号" v-model="phone"/>
          <view class="cu-capsule radius">
            <view class='cu-tag bg-blue '>
              +86
            </view>
            <view class="cu-tag line-blue">
              中国大陆
            </view>
          </view>
        </view>
        <view class="cu-form-group">
          <view class="title">验证码</view>
          <input placeholder="请输入验证码" name="input"/>
          <button class='cu-btn bg-primary text-white shadow' @click="get_verify_code">获取验证码</button>
        </view>
      </form>
    </div>

    <div class="text-center padding">
      <button class="cu-btn lg cu-btn-primary text-white text-center">
        微信授权登录
      </button>
    </div>
    <view class="text-center text-xs">
      <text class="text-gray">如果您在我们的实体店，请在店员的指导下链接脑环</text>
    </view>
  </div>
</template>

<script>
export default {
  name: "regist",
  data(){
    return {
      phone:""
    }
  },
  methods: {
    //跳转到首页
    goIndex() {
      this.$emit('changeStatus', 'login')
    },
    //获取验证码
    get_verify_code(){
      let $this = this;
      let $params = {
        phone:$this.phone
      }
      $this.$fly.post('user/get-code',$params).then((res)=>{
        let $data = res.data;
        if (!res.code){
          console.log($data)
        }
      });
    },
    //微信授权登录
    wechat_login(){

    }
  }
}
</script>

<style scoped>
.regist_back_btn {
  width: 22px;
  height: 20px;
  position: absolute;
  left: 20px;;
}
</style>
