<script setup lang="ts">
export type AuditActiveTab = "pendingMine" | "handledMine";

const activeTab = defineModel<AuditActiveTab>("activeTab", { required: true });

defineProps<{
  canBatchRemind: boolean;
  canExport: boolean;
  canSlaRead: boolean;
  slaStat: {
    pendingTotal: number;
    timeout4h: number;
    timeout12h: number;
    timeout24h: number;
  };
}>();

const emit = defineEmits<{
  load: [];
  batchRemind: [];
  exportOpinions: [];
  tabChange: [];
}>();
</script>

<template>
  <el-tabs v-model="activeTab" class="mb-sm" @tab-change="emit('tabChange')">
    <el-tab-pane label="待我处理" name="pendingMine" />
    <el-tab-pane label="我处理过的" name="handledMine" />
  </el-tabs>
  <el-button type="primary" @click="emit('load')">
    刷新
  </el-button>
  <el-button
    v-if="canBatchRemind"
    class="ml-sm"
    @click="emit('batchRemind')"
  >
    批量催办
  </el-button>
  <el-button
    v-if="canExport"
    class="ml-sm"
    @click="emit('exportOpinions')"
  >
    导出审核意见
  </el-button>
  <!-- <span v-if="canSlaRead" class="ml-md text-regular">
    SLA：待处理 {{ slaStat.pendingTotal }} / 超时4h {{ slaStat.timeout4h }} / 超时12h {{ slaStat.timeout12h }} / 超时24h
    {{ slaStat.timeout24h }}
  </span> -->
</template>
