personTable.vue 3.34 KB
<template>
  <!--            人员表格-->
  <el-table :data="tableData" class="mt20">
    <el-table-column type="index" :label="language==0?'序号':'Index'" width="80" align="center"/>
    <el-table-column :label="language==0?'姓氏':'Surname'" prop="xing" min-width="100"/>
    <el-table-column :label="language==0?'名':'Name'" prop="ming" min-width="100"/>
    <el-table-column :label="language==0?'所属国家/地区':'Nationality'" prop="countryName" min-width="100"/>
    <el-table-column :label="language==0?'性别':'Gender'" prop="sexStr"/>
    <!--    <el-table-column :label="language==0?'年龄':'Age'" prop="age"/>-->
    <el-table-column :label="language==0?'证件类型':'ID Type'" prop="idcTypeStr" :min-width="language==0?'80':'160'"/>
    <el-table-column :label="language==0?'证件号码':'ID NO.'" prop="idcCode" width="200"/>
    <el-table-column :label="language==0?'出生日期':'Birth'" prop="birth" width="110"/>
    <el-table-column :label="language==0?'会员角色':'Role'" width="150">
      <template #default="scope">
        <div class="esp">
          <span v-for="item in scope.row.label?.split(',')" :key="item.id" class="text-primary">
            <span v-if="item==='0'" class="ml5">{{ language == 0 ? '运动员' : 'Athletes' }}</span>
            <span v-if="item==='1'" class="ml5">{{ language == 0 ? '教练' : 'Coach' }}</span>
            <span v-if="item==='2'" class="ml5">{{ language == 0 ? '领队' : 'Leader' }}</span>
            <span v-if="item==='4'" class="ml5">{{ language == 0 ? '队医' : 'Nurse' }}</span>
            <span v-if="item==='5'" class="ml5">{{ language == 0 ? '翻译' : 'Translator' }}</span>
            <span v-if="item==='6'" class="ml5">{{ language == 0 ? '官员' : 'Official' }}</span>
            <span v-if="item==='3'" class="ml5">{{ language == 0 ? '其他' : 'Other' }}</span>
          </span>
        </div>
      </template>
    </el-table-column>
    <el-table-column :label="language==0?'WDSF会员号':'WDSF MIN'" prop="wdsfMin" width="110"/>
    <!--    <el-table-column :label="language==0?'详细地址':'Detailed Address'" prop="address" min-width="140"/>-->
    <el-table-column :label="language==0?'操作':'Actions'" fixed="right" width="160" header-align="center"
                     align="center">
      <template #default="scope">
        <a class="text-primary pd10" @click="editCoach(scope.row)">
          {{ language == 0 ? '编辑' : 'Edit' }}
        </a>
        <a class="text-primary pd10" @click="delperson(scope.row)">
          {{ language == 0 ? '删除' : 'Delete' }}
        </a>
      </template>
    </el-table-column>
  </el-table>
  <!--  <paginationPc-->
  <!--      v-show="total>0"-->
  <!--      v-model:page="query.pageNum"-->
  <!--      v-model:limit="query.pageSize"-->
  <!--      :total="total"-->
  <!--      @pagination="getList"-->
  <!--  />-->
</template>

<script setup>
import {ref} from "vue";
import {useStorage} from "@vueuse/core/index";

const language = useStorage('language', 0)
const emit = defineEmits(['edit', 'delete'])
let title = ''
const props = defineProps({
  tableData: {
    type: Array,
    required: true
  }
})
const editCoach = (row) => {
  // scope.row.id,scope.row.groupId
  title = (language.value == 0 ? '编辑人员' : 'Edit')
  emit('edit', row, title)
}
const delperson = (row) => {
  emit('delete', row)

}
</script>

<style scoped>

</style>