hospital-project/src/components/personList/index.vue

<template>
  <div class="mr-8">
    <el-table :data="tableData" style="width: 100%">
      <el-table-column prop="title" width="100">
        <template #default="scope">
          <div class="text-black">{{ scope.row.quotaName }}</div>
        </template>
      </el-table-column>
      <el-table-column
        v-if="showList?.showIndicRemark"
        prop="remark"
        label="指标说明"
      />
      <el-table-column
        v-if="showList?.showScoreRule"
        prop="scoreRule"
        label="评价标准"
      />
      <el-table-column
        v-if="showList?.showDatasource"
        prop="datasoure"
        label="数据来源"
      />
      <el-table-column
        v-if="showList?.showTargetValue"
        prop="targetValue"
        label="目标值"
      />
      <el-table-column prop="finalValue" label="完成值" />
      <el-table-column
        v-if="showList?.showStartValue"
        prop="startValue"
        label="门槛值"
      />
      <el-table-column
        v-if="showList?.showChallengeValue"
        prop="challengeValue"
        label="挑战值"
      />
      <el-table-column prop="ranking" label="排名" />
      <el-table-column prop="quotaScore" label="得分" />
    </el-table>
  </div>
</template>

<script lang="ts" setup>
import { ref, nextTick, watch } from "vue";
const tableData = ref([]);
const showList = ref();
const watchData = ref();
const init = (data?: any) => {
  if (data) {
    tableData.value = [];
    watchData.value = data;
    setTimeout(() => {
      nextTick(() => {
        showList.value = data[0]?.dimensionList[0];
        tableData.value = data[0]?.dimensionList[0].quotaList;
        // tableData.value = data;
      });
    }, 0);
  }
};
watch(
  watchData.value,
  newVal => {
    showList.value = newVal[0]?.dimensionList[0];
    tableData.value = newVal[0]?.dimensionList[0].quotaList;
  },
  { deep: true }
);
// nextTick(() => {
//   init();
// });
defineExpose({
  init
});
</script>