SPDM/src/components/taskDetail/taskPerformance.vue

<template>
  <div class="task-performance-page">
    <BaseTable tableName="TASK_PERFORMANCE" ref="baseTableRef" showCheckbox hidePagination :actionList="actionList">
      <template #leftOptions>
        <div class="operate-box">
          <el-upload
            class="mr12"
            :limit="1"
            accept=".xls,.xlsx"
            :auto-upload="true"
            :show-file-list="false"
            :on-change="handleLocalChangeExcelFun"
            :before-upload="(File: any) => uploadLocalFileFun(File)"
          >
            <el-button icon="">导入Excel</el-button>
          </el-upload>
          <el-button icon="" @click="exportFileFun">导出Excel</el-button>
          <el-button type="primary" @click="openAddPerformanceWindFun">新增</el-button>
          <el-button v-if="showSaveButton" type="primary" @click="saveFun">保存</el-button>
        </div>

      </template>

      <template #operate="{ row }">
        <el-button type="danger" link @click="delPerformance(row)">删除</el-button>

      </template>

    </BaseTable>

    <addTaskPerformance
      v-if="performanceVisible"
      :tableName="'TASK_PERFORMANCE'"
      @cancel="performanceVisible = false"
      @submit="addPerformanceFun"
    >
    </addTaskPerformance>

  </div>
</template>

<script setup lang="ts">
import { ref, onMounted } from 'vue';
import BaseTable from '@/components/common/table/baseTable.vue';
import { ElMessage } from 'element-plus';
import { getTaskPerformanceApi, batchAddTaskPerformanceApi, batchDeleteTaskPerformanceApi, getRunPerformanceApi } from '@/api/task/taskpool';
import { cloneDeep } from 'lodash-es';
import { FileUtil } from '@/utils/file';
import addTaskPerformance from './addTaskPerformance.vue';

const props = defineProps({
  taskId: {
    type: Number,
    default: 100,
  },
  runInfo: {
    type: Object,
    default: () => {},
  },
  taskInfo: {
    type: Object,
    default: () => {},
  },
  showSaveButton: {
    type: Boolean,
    default: false,
  },
  paramType: {
    type: String,
    default: 'task',
  },
});
const baseTableRef = ref();
const performanceVisible = ref(false);

const performanceData = ref<any>([]);
const getTaskPerformanceDataFun = async () => {
  console.log(props.taskId);
  console.log(props.runInfo);
  const res: any = props.paramType === 'task' ? await getTaskPerformanceApi({ taskId: props.taskInfo?.id }) : await getRunPerformanceApi({ runId: props.runInfo?.uuid }) ;
  if (res && res.code === 200) {
    performanceData.value = res.data;

    console.log(performanceData.value);
    if (baseTableRef.value) {
      baseTableRef.value.setDataFun(performanceData.value);
    }

  }
  // ElMessage.success('获取任务性能指标数据' + props.taskId);

};

const openAddPerformanceWindFun = () => {
  performanceVisible.value = true;
};

const addPerformanceFun = async (data: any) => {

  console.log(data, 'data');
  data.flag = 'add';
  const { fullData, visibleData, tableData, footerData } = baseTableRef.value.tableRef.getTableData();

  const existPerformance = fullData.find((item: any) => {
    return item.nodeName === data.nodeName;
  }) || null;

  if (existPerformance) {
    ElMessage.warning('已存在该指标，无法新增！');
  } else {
    baseTableRef.value.tableRef.insertAt(data, -1);

  }

  console.log(fullData, 'fullData');
  console.log(visibleData, 'visibleData');
  console.log(tableData, 'tableData');
  console.log(footerData, 'footerData');

  performanceVisible.value = false;

};

const deletePerformanceList = ref<any>([]);
const delPerformance = (row: any) => {
  baseTableRef.value.tableRef.remove(row);
  if (row.flag != 'add') {
    deletePerformanceList.value.push(row);
  }

};

const batchAddTaskPerformanceFun = async () => {

  const list = baseTableRef.value.tableRef.getInsertRecords();

  console.log(list, 'list');
  console.log(props.paramType, 'paramType');

  const performanceList: any = [];

  for (let i = 0; i < list.length; i++) {
    const obj :any = {
      uuid: '',
      nodeId: '',
      performanceName: list[i].performanceName,
      nodeName: list[i].nodeName,
      englishName: list[i].englishName,
      nodeCode: list[i].nodeCode,
      poolName: list[i].poolName,
      performanceType: list[i].performanceType,
      unit: list[i].unit,
      targetValue: list[i].targetValue,
      lowValue: list[i].lowValue,
      highValue: list[i].highValue,
      method: list[i].method,
      description: list[i].description,
      taskName: list[i].taskName,
      standard: list[i].standard,
      tenantId: list[i].tenantId,
      createTime: list[i].createTime,
      pid: 0,
    };

    if (props.paramType === 'task') {
      obj.taskId = props.taskInfo?.uuid;
    }

    if (props.paramType === 'run') {
      obj.runId = props.runInfo.uuid;
      obj.taskId = props.runInfo.taskId;

    }

    console.log(obj, 'objobjobj');

    performanceList.push(obj);
  }

  if (!list.length) {
    return;
  }

  const param:any = {
    performanceList: performanceList,
  };

  if (props.paramType === 'task') {
    param.taskId = props.taskInfo?.uuid;
  }

  if (props.paramType === 'run') {
    param.taskId = props.runInfo.taskId;
    param.runId = props.runInfo.uuid;
  }
  const res: any = await batchAddTaskPerformanceApi(param);
  if (res && res.code === 200) {
    // ElMessage.success('新增成功！');
  } else {

  }

};

const batchDeleteTaskPerformanceFun = async () => {
  const ids = deletePerformanceList.value.map((item: any) => {
    return item.id;
  });

  if (!ids.length) {
    return;
  }
  const res: any = await batchDeleteTaskPerformanceApi(ids);
  if (res && res.code === 200) {

  } else {

  }
};

const saveFun = async () => {

  await batchAddTaskPerformanceFun();
  await batchDeleteTaskPerformanceFun();

};

const uploadLocalFileFun = async (File: any) => {
  console.log(File);

  ElMessage.success('正在导入列表，请勿重复导入！');
  return false;
};

const performanceInfoList = [
  {
    chineseName: '指标名称',
    englishName: 'nodeName',
  },
  {
    chineseName: '英文名',
    englishName: 'englishName',
  },
  {
    chineseName: '指标类型',
    englishName: 'performanceType',
  },
  {
    chineseName: '达标方式',
    englishName: 'method',
  },
  {
    chineseName: '目标值',
    englishName: 'highValue',
  },
  {
    chineseName: '分析值',
    englishName: 'value',
  },
  {
    chineseName: '单位',
    englishName: 'unit',
  },
  {
    chineseName: '描述',
    englishName: 'description',
  },
  {
    chineseName: '低性能',
    englishName: 'lowValue',
  },
  {
    chineseName: '节点编号',
    englishName: 'nodeCode',
  },
  {
    chineseName: '节点id',
    englishName: 'nodeId',
  },
  {
    chineseName: '节点名称',
    englishName: 'nodeName',
  },
  {
    chineseName: 'pid',
    englishName: 'pid',
  },
  {
    chineseName: '库名称',
    englishName: 'poolName',
  },
  {
    chineseName: '标准',
    englishName: 'standard',
  },
  {
    chineseName: 'targetValue',
    englishName: 'targetValue',
  },
  {
    chineseName: '任务名称',
    englishName: 'taskName',
  },
  {
    chineseName: 'tenantId',
    englishName: 'tenantId',
  },
  {
    chineseName: 'uuid',
    englishName: 'uuid',
  },

];

const performanceFile = ref<any>({});
const handleLocalChangeExcelFun = async (uploadFile: any, uploadFiles: any) => {
  performanceFile.value = uploadFile.raw;
  console.log(uploadFiles);

  let fileInfo: any = [];
  await FileUtil.parsingExcelFile(performanceFile.value).then((result: any) => {
    fileInfo = result;
  });

  conversionName(fileInfo, performanceInfoList, 'chineseName', 'englishName');
  const newList = arraysConvertedToObjects(fileInfo);

  const newData = baseTableRef.value.tableRef.getTableData().visibleData;
  const commonNameList: any = [];
  for (let i = 0; i < newData.length; i++) {
    for (let j = 0; j < newList.length; j++) {
      if (newData[i].code === newList[j].code) {
        commonNameList.push(newList[j].code);
        for (const key in newData[i]) {
          if (key != 'change_flag' && key != 'id' && key != 'value') {
            newData[i][key] = newList[j][key];
          }

          if (key === 'value') {
            if (newData[i][key] != newList[j][key]) {
              if (newData[i].flag != 'add') {
                newData[i].flag = 'edit';
              }
              newData[i][key] = newList[j][key];
            }
          }

          // if (newData[i].change_flag != 'add') {
          //   newData[i].change_flag = 'edit';
          // }
        }
      }
    }
  }
  for (let i = 0; i < newList.length; i++) {
    if (!commonNameList.includes(newList[i].performanceName)) {

      baseTableRef.value.tableRef.insertAt(newList[i]);
    }
  }

  const allData = baseTableRef.value.tableRef.getTableData().visibleData;

  console.log(allData, 'allData.allData');
};

// 性能指标数组中英名称转换
const conversionName = (data: any, names: any, before: string, after: string) => {
  for (let i = 0; i < data[0].length; i++) {
    for (let j = 0; j < names.length; j++) {
      if (data[0][i] === names[j][before]) {
        data[0][i] = names[j][after];
      }
    }
  }
};

// 数据转化成第一行为属性的对象
const arraysConvertedToObjects = (arr: any) => {
  const herder = arr[0];
  const body = arr.slice(1);

  const newArr: any = [];
  for (let i = 0; i < body.length; i++) {
    const obj: any = {};
    for (let j = 0; j < herder.length; j++) {
      obj[herder[j]] = body[i][j];
    }
    obj.change_flag = 'add';
    newArr.push(obj);
  }

  return newArr;
};

// 导出excel
const exportFileFun = () => {
  const statusList = [
    {
      label: '不合格',
      label2: '不合格',
      value: 1,
    },
    {
      label: '风险可控',
      label2: '风险可控',
      value: 2,
    },
    {
      label: '未分析',
      label2: '未评估',
      value: 3,
    },
    {
      label: '合格',
      label2: '合格',
      value: 4,
    },
  ];
  const newData = cloneDeep(baseTableRef.value.tableRef.getTableData().visibleData);

  console.log(1111111111111);

  newData.forEach((item: any) => {
    item.status = statusList.find((item_2: any) => {
      return item_2.value === item.status;
    })?.label;
    item.risk =
      statusList.find((item_2: any) => {
        return item_2.value === item.risk;
      })?.label2 || '未评估';
  });

  FileUtil.exportExcel(newData, '指标', performanceInfoList);
};

defineExpose({
  saveFun,
  baseTableRef,
});

const actionList = ref([
  {
    title: '删除',
    type: 'danger',
    needConfirm: true,
    confirmTip: '确认删除吗？',
    click: (row:any) => {
      delPerformance(row);
    },
  },
]);

onMounted(async () => {
  await getTaskPerformanceDataFun();
});

</script>

<style lang="scss" scoped>
.task-performance-page {
  width: 100%;
  height: 100%;

  .operate-box {
    width: 100%;
    display: flex;
    align-items: center;
  }

  .mr12 {
    margin-right: 12px;
  }
}
</style>