<script setup>
import LiveProductCategory from '@/components/LiveProductCategory.vue'
import { getScoreList } from '../api'

const route = useRoute()
const appList = ref(null)
// 刷新
const handleRefresh = () => {
  appList.value?.refetch()
}
const listParams = reactive({ name: '', check_status: '' })

// 列表配置
const listOptions = computed(() => {
  return {
    remote: { httpRequest: getScoreList, params: listParams },
    filters: [
      { label: '姓名', prop: 'name', type: 'input' },
      {
        label: '状态',
        prop: 'check_status',
        type: 'select',
        options: [
          { label: '暂未评分', value: '0' },
          { label: '评分中', value: '1' },
          { label: '已评分', value: '2' },
        ],
      },
    ],
    columns: [
      { label: '序号', type: 'index', width: 60 },
      { label: 'ID', prop: 'id' },
      { label: '姓名', prop: 'student_name' },
      { label: '专业', prop: 'specialty_name' },
      { label: '班级', prop: 'class_name' },
      { label: '成绩', prop: 'score_display' },
      { label: '状态', prop: 'check_status_name' },
      { label: '评分人', prop: 'checker_name' },
      { label: '提交时间', prop: 'commit_time' },
      { label: '批改时间', prop: 'commit_time' },
      { label: '操作', slots: 'table-x', width: 120 },
    ],
  }
})

// const handleSubmit = () => {
//   studentSubmit().then(() => {
//     handleRefresh()
//   })
// }

const handleExport = () => {
  window.open(`/api/lab/v1/experiment/live-student-record/export?experiment_id=${route.query.experiment_id}`)
}
</script>

<template>
  <AppCard title="成绩管理">
    <AppList v-bind="listOptions" ref="appList">
      <template #header-buttons>
        <!-- <el-button type="primary" @click="handleSubmit">提交成绩</el-button> -->
        <el-button type="primary" @click="handleExport">导出成绩</el-button>
      </template>

      <template #filter-category>
        <LiveProductCategory v-model="listParams.live_commodity_type_id" @change="handleRefresh"></LiveProductCategory>
      </template>
      <template #table-x="{ row }">
        <el-button text type="primary">
          <router-link :to="{ path: '/live/score/view', query: { ...$route.query, id: row.id } }">评分</router-link>
        </el-button>
      </template>
    </AppList>
  </AppCard>
</template>
