<template>
  <div class="performance-page">

    <BaseTable v-if="showTableContent" ref="performanceTableRef" :head="tableColumns" :tableName="checkTableName" hidePagination>
      <template #performanceInfo="{row}">
        {{ row.performanceInfo }}
      </template>
    </BaseTable>

  </div>
</template>

<script setup lang="ts">
import { ref, watch, nextTick } from 'vue';
import BaseTable from '@/components/common/table/baseTable.vue';
import { objectTypeArrayRemovesDuplicates } from '@/utils/common';

const props = defineProps({
  checkTaskInfo: {
    type: Array,
    default: () => [],
  },
  checkTableName: {
    type: String,
    default: '',
  },
  cloumnWidth: {
    type: String,
    default: '',
  },
});

const performanceTableRef = ref();
const showTableContent = ref(false);
const tableData = ref<any>([

]);
const tableColumns = ref<any>([

]);

const modelAttribute = ref<any>([

]);

const getTableColumnsFun = (data:any) => {

  const performanceDatas = data || [];

  const names = performanceDatas?.map((item:any) => {
    return item.taskName ;
  });

  const taskNames = Array.from(new Set( names)) ;
  modelAttribute.value = performanceDatas.map((item:any) => {
    const obj:any = {
      name: `${item.nodeName} (${item.method} ${item.targetValue} ${item.unit})`,
      value: item.nodeId,
    };

    obj[item.nodeId] = item.highValue;
    return obj;
  });

  const defaultColumns = [{
    title: '指标信息',
    key: 'performanceInfo',
    isShow: true,
  },
  ];
  const list:any = data || [];

  showTableContent.value = false;
  tableData.value = [];
  tableColumns.value = [];
  let modelcolumns:any = [];
  for (let j = 0;j < taskNames.length;j++) {
    for (let i = 0;i < list.length;i++) {
      if (list[i].taskName === taskNames[j]) {
        const obj:any = {
          title: `${list[i].taskName}`,
          key: `${list[i].nodeId}`,
          isShow: true,
        };
        modelcolumns.push(obj);
      }

    }

  }
  modelcolumns = objectTypeArrayRemovesDuplicates(modelcolumns, 2);
  tableColumns.value = defaultColumns.concat(modelcolumns);
  if (props.cloumnWidth) {
    for (let i = 0;i < tableColumns.value.length;i++) {
      tableColumns.value[i].width = props.cloumnWidth;
    }
  }
  for (let i = 0;i < modelAttribute.value.length;i++) {
    const obj:any = {
    };
    for (let j = 0;j < tableColumns.value.length;j++) {
      if (tableColumns.value[j].key === 'performanceInfo') {
        obj[tableColumns.value[j].key] = modelAttribute.value[i].name;
      } else {
        obj[tableColumns.value[j].key] = modelAttribute.value[i][tableColumns.value[j].key];
      }
    }

    tableData.value.push(obj);
  }

  showTableContent.value = true;
  nextTick(() => {
    performanceTableRef.value.setDataFun(tableData.value);
  });

};

watch(() => props.checkTaskInfo, (newVal) => {
  getTableColumnsFun(newVal);
}, {
  immediate: true,
  deep: true,
});

</script>

<style lang="scss" scoped>

.performance-page{
  width: 100%;
  height: 100%;
}
</style>
