personTable.vue 2.52 KB
<template>
  <!--            人员表格-->
  <el-table :data="tableData" class="mt20">
    <el-table-column type="index" label="序号" width="80" align="center"/>
    <el-table-column label="所属国家" prop="countryName"/>
    <el-table-column label="姓氏" prop="xing"/>
    <el-table-column label="名" prop="ming"/>
    <el-table-column label="短名" prop="shortName"/>
    <el-table-column label="性别" prop="sexStr"/>
    <el-table-column label="年龄" prop="age"/>
    <el-table-column label="出生日期" prop="birth" width="100"/>
    <el-table-column label="手机号码" prop="phone" width="120"/>
    <el-table-column label="邮箱" prop="email" width="150"/>
    <el-table-column label="证件类型" prop="idcTypeStr"/>
    <el-table-column label="证件号码" prop="idcCode" width="200"/>
    <el-table-column label="会员角色">
      <template #default="scope">
          <span v-for="item in scope.row.label?.split(',')" :key="item.id">
            <el-tag type="primary" size="mini" v-if="item==='0'" effect="dark" class="ml10">运动员</el-tag>
            <el-tag type="info" size="mini" v-if="item==='1'" effect="dark" class="ml10">教练</el-tag>
            <el-tag type="info" size="mini" v-if="item==='2'" effect="dark" class="ml10">领队</el-tag>
            <el-tag type="info" size="mini" v-if="item==='3'" effect="dark" class="ml10">队医</el-tag>
            <el-tag type="info" size="mini" v-if="item==='4'" effect="dark" class="ml10">翻译</el-tag>
            <el-tag type="info" size="mini" v-if="item==='5'" effect="dark" class="ml10">官员</el-tag>
            <el-tag type="info" size="mini" v-if="item==='6'" effect="dark" class="ml10">其他</el-tag>
          </span>
      </template>
    </el-table-column>
    <el-table-column label="详细地址" prop="address"/>
    <el-table-column label="操作" fixed="right" width="160" header-align="center" align="center">
      <template #default="scope">
        <a class="text-primary pd10" @click="editCoach(scope.row.id,scope.row.groupId)">编辑</a>
        <a class="text-primary pd10" @click="delperson(scope.row)">删除</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>
const props = defineProps({
  tableData:{
    type:Array,
    required:true
  }
})
const editCoach = () => {

}
</script>

<style scoped>

</style>