<template>
  <div class="audit-button-group">
    <el-badge v-if="review" :is-dot="isDot" class="mr-12">
      <el-button type="primary" size="mini" @click="onClick('review')">查看</el-button>
    </el-badge>
    <template v-if="type === 'result'">
      <el-button
        :class="{ 'mr-12': marginRight }"
        type="primary"
        size="mini"
        @click="onClick('result')"
      >驳回</el-button>
    </template>
    <template v-if="type === 'audit'">
      <el-button :class="{ 'mr-12': marginRight }" type="primary" size="mini" @click="onClick('audit')">审核</el-button>
    </template>
  </div>
</template>
<script>
export default {
  name: 'AuditButtonGroup',
  props: {
    isDot: {
      type: Boolean,
      default: false
    },
    type: {
      type: String,
      default: 'result',
      validator: (value) => ['result', 'audit'].includes(value)
    },
    marginRight: {
      type: Boolean,
      default: false
    },
    review: {
      type: Boolean,
      default: false
    }
  },
  methods: {
    onClick(type) {
      this.$emit('click', type)
    }
  }
}
</script>

<style lang="scss" scoped>
::v-deep {
  .el-badge {
    sup {
      right: 5px !important;
    }
  }
}

.audit-button-group {
  display: inline-block;

  .mr-12 {
    margin-right: 12px;
  }
}
</style>
