<template>
  <a-card title="我的绩效">
    <a-table :data="data" :columns="columns" row-key="evaluationId">
      <template #action="{ record }">
        <a-button type="text" @click="openDetail(record)">查看详情</a-button>
      </template>
    </a-table>
  </a-card>

  <a-modal v-model:visible="visible" title="绩效详情">
    <div v-if="selected">
      <div>维度：{{ selected.dimensionName }}</div>
      <div>周期：{{ selected.periodName }}</div>
      <div>评分：{{ selected.score }}</div>
      <div>奖金：{{ selected.bonus }}</div>
      <div>评价：{{ selected.comment }}</div>
    </div>
  </a-modal>
</template>

<script setup lang="ts">
import { onMounted, ref } from 'vue'
import { getMyEvaluation } from '@/apis/performance-setting'
import type { PerformanceRule } from '@/apis/performance-setting/type'

const data = ref<any[]>([])
const visible = ref(false)
const selected = ref<any>()

const columns = [
  { title: '维度', dataIndex: 'dimensionName' },
  { title: '周期', dataIndex: 'periodName' },
  { title: '评分', dataIndex: 'score' },
  { title: '奖金', dataIndex: 'bonus' },
  { title: '评价', dataIndex: 'comment' },
  { title: '操作', slotName: 'action' },
]

const load = async () => {
  const res = await getMyEvaluation()
  data.value = res.data || []
}

const openDetail = (row: any) => {
  selected.value = row
  visible.value = true
}

onMounted(load)
</script>