<template>
<div v-if="canIUse" class="welcome" >
    <div class="title">欢迎使用汉阳手机律师小程序</div>
    <div class="sub-title">律师端</div>
    <button v-if='auth' type="primary" @tap="verify" >注册为律师</button>
    <button v-else open-type="getUserInfo" type="primary" @getuserinfo="bindGetUserInfo" >开始使用</button>
</div>
<div v-else style="title">请升级微信版本</div>
</template>

<script>
export default {
  data() {
    return {
      canIUse: wx.canIUse('button.open-type.getUserInfo'),
      auth: false
    }
  },
  methods: {
    bindGetUserInfo(e) {
      var that = this
      if (e.target.userInfo) {
        //允许授权
        wx.switchTab({ url: "../news/main" })
        // wx.showModal({
        //   title: '授权成功',
        //   content: '使用程序前，请先注册为律师',
        //   showCancel: false,
        //   confirmText: '确定',
        //   success: res => {
        //     if (res.confirm) {
        //       this.text = '注册为律师'
        //       console.log('用户点击了“返回授权”')
        //     }
        //   }
        // })
        // this.auth = true
      } else {
        //用户按了拒绝按钮
        wx.showModal({
          title: '提示',
          content: '您点击了拒绝授权，为了更好的用户体验，请授权之后再进入!',
          showCancel: false,
          confirmText: '返回授权',
          success: res => {
            if (res.confirm) {
              console.log('用户点击了“返回授权”')
            }
          }
        })
      }
    },
    verify() {
      wx.redirectTo({ url: '../verify/main' })
    }
  }
}
</script>

<style lang='stylus' scoped>
.welcome
  position fixed
  Flex(flex, center, center, column)
  height 100%
  width 100%
  background themeColor
  letter-spacing 2rpx
.title
  Font(45rpx)
  margin-bottom 30rpx
  color white
.sub-title
  Font(34rpx)
  margin-bottom 120rpx
  color #BBB
button
  width 360rpx
  border-radius 80rpx
  font-size 37rpx
</style>