<template>
  <base-table border stripe size="small" height="100%" :columns="columns" :data="taskDetail"></base-table>
</template>

<script setup lang="ts" name="GroupSetting">
/** 任务设置 - 按小组设置 */
import { watch } from 'vue'
import useFetch from '@/hooks/useFetch'
import BaseTable from '@/components/element/BaseTable.vue'

import type { EpTableColumn } from 'global-type'

const props = defineProps<{
  mainNumber?: number | string
  markingGroupNumber?: number | string
  subjectCode?: string
}>()

const { fetch: getTaskDetail, result: taskDetail } = useFetch('getTaskDetail')

const columns: EpTableColumn[] = [
  { label: '小组', prop: 'markingGroupNumber' },
  { label: '计划量', prop: 'markCount' },
  { label: '已完成量', prop: 'finishCount' },
]

watch(
  props,
  () => {
    if (props.mainNumber && props.markingGroupNumber && props.subjectCode) {
      getTaskDetail({ ...props })
    }
  },
  { immediate: true }
)
</script>

<style scoped lang="scss"></style>
