soc_app/src/components/table/index.vue

<template>
  <div class="table">
    <ve-table
      :border-x="true"
      :border-y="true"
      :border-around="true"
      :columns="columns"
      :table-data="dataList" />
  </div>
</template>

<script>

export default {
  props:{
    data:{
      type: Array,
      default: ()=>[],
    }
  },
  data(){
    return {
      columns:[
        {
          field: "index",
          key: "index",
          title: "序号",
          width: 50,
          align: "center",
          fixed: "left",
          renderBodyCell: ({ row, column, rowIndex }, h) => {
            return ++rowIndex;
          },
        },
        {field:'orgName',key:'2',title:'单位名称',align: "center" },
        {field:'finish',key:'3',title:'应培训数',align: "center" },
        {field:'shouldFinish',key:'4',title:'已培训数',align: "center" },
        {field:'finishRate',key:'5',title:'完成率',align: "center" },
      ],
      dataList:[],
    }
  },
  watch:{
    data:{
      handler(val){
        console.log(val,'val')
        this.dataList = this.data;
      },
      immediate:true,
      deep:true
    }
  },
  methods:{

  }
}
</script>