<template>
  <el-table :data="list" border style="width: 100%">
    <el-table-column :label="language==0?'组别代码':'Group code'" width="120px" prop="zuName"/>
    <el-table-column :label="language==0?'组别':'Group'" prop="project.name"/>
    <el-table-column :label="language==0?'舞种':'Dance Style'" width="120px" prop="project.danceType"/>
    <el-table-column :label="language==0?'参赛说明':'Participation Instructions'" prop="project.remarks"/>
    <el-table-column :label="language==0?'参赛运动员':'Participating athletes'" width="120px">
      <template #default="scope">
        <div>
          <span v-for="s in scope.row.athletes">{{ s.name }},</span>
        </div>
      </template>
    </el-table-column>
    <el-table-column :label="language==0?'报名费':'Registration Fee'" width="120px" prop="">
      <template #default="scope">
        <div class="text-primary">
          ¥{{ scope.row.project.serviceFee }}
        </div>
      </template>
    </el-table-column>
    <el-table-column  v-if="hasAction" :label="language==0?'操作':'Actions'" fixed="right" width="150" align="center">
      <template #default="scope">
        <el-button  type="primary" link  @click="remove(scope.row.signId)">
          {{language == 0 ? '删除' : 'Delete' }}
        </el-button>

      </template>
    </el-table-column>
  </el-table>

</template>

<script setup>
const emit = defineEmits(['delete'])
const props = defineProps({
  list: {
    type: Array,
    required: true
  },
  hasAction:{
    type: Boolean,
    required: false,
    default: true
  }
})
import cache from "@/plugins/cache";
const language = ref(cache.local.get('language') || 0)
const remove = (id) => {
  emit('delete', id)
}
</script>

<style scoped>

</style>