<template>
  <view class="flex card">
    <view class="info">
      <view class="title">绑定申请</view>
      <view class="row">
        <view class="row-label">绑定人：</view>
        <view class="row-content">{{ data.name }}</view>
      </view>
      <view class="row">
        <view class="row-label">申请人ID：</view>
        <view class="row-content">{{ data.userId }}</view>
      </view>
      <view class="row">
        <view class="row-label">申请时间：</view>
        <view class="row-content">{{ data.createTime }}</view>
      </view>
      <view class="btns">
        <button class="btn" @click="onReject">拒绝</button>
        <button class="btn" @click="onConfirm">同意</button>
      </view>
    </view>
  </view>
</template>

<script>

  export default {
    props: {
      data: {
        type: Object,
        default() {
          return {}
        }
      },
      value: {
        type: String,
        default: null,
      },
      showRadio: {
        type: Boolean,
        default: false
      },
    },
    data() {
      return {
      }
    },
    methods: {
      onReject() {
        // todo: fetch reject
        this.$emit('submitted')
      },
      onConfirm() {
        // todo: fetch confirm
        this.$emit('submitted')
      },
    },
  }
</script>

<style scoped lang="scss">
  @import './card.scss';

  .btns {
    margin-top: 16rpx;
  }

  .btn {
    padding: 10rpx 50rpx;
    font-family: PingFang SC;
    font-size: 28rpx;
    font-weight: 500;
    line-height: 1.4;
    color: #252545;
    border: 2rpx solid #252545;
    border-radius: 32rpx;

    & + & {
      margin-left: 24rpx;
    }
  }
</style>