<template>
  <view class="auth-content">
    <image class="auth-logo" src="../static/logo.png" />
    <view class="auth-title">请先授权头像昵称</view>
    <view class="auth-btn-group">
      <u-button size="medium" :custom-style="customBtnStyle" class="auth-btn" @click="onHideAuthorize">拒绝</u-button>
      <u-button
        type="primary"
        size="medium"
        open-type="getUserInfo"
        :custom-style="customBtnStyle"
        lang="zh_CN"
        @getuserinfo="getUserData"
      >
        好的
      </u-button>
    </view>
  </view>
</template>

<script>
export default {
  name: 'yi-authorize',
  data() {
    return {
      customBtnStyle: {
        border: 'none',
      },
    };
  },
  methods: {
    onHideAuthorize() {
      this.$emit('onHideAuthorize');
    },
    getUserData() {
      this.$emit('getUserData');
    },
  },
};
</script>

<style scoped lang="scss">
.auth-content {
  padding: 30rpx;
  background-color: #fff;
  //height: 400rpx;
  display: flex;
  flex-direction: column;
  justify-content: center;
  align-items: center;
  .auth-title {
    text-align: center;
    font-size: 30rpx;
    margin: 20rpx;
  }
  .auth-btn-group {
    display: flex;
    flex-direction: row;
    justify-content: space-around;
    align-items: center;
    margin-top: 20rpx;
    .auth-btn {
      margin-right: 30rpx;
    }
  }
  .auth-logo {
    width: 50px;
    height: 50px;
  }
}
</style>
