SPDM/src/components/taskDetail/taskPerformance.vue

<template>
  <div class="task-performance-page">
    <BaseTable
      tableName="TASK_RUN_PERFORMANCE"
      ref="baseTableRef"
      :export-file-name="'指标列表'"
      :export-api="exportPerformanceApi"
      showCheckbox
      hidePagination
      :actionList="showLeftOptions ? actionList : []"
      :export-params="excelParams"
      :full-height="fullHeight"
    >
      <template v-if="showLeftOptions" #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 #completeStatus="{ row }">
        <StatusDot
          :status="getTaskAchieveStyleClass(row.completeStatus || '0')"
          :title="RESULT_ACHIEVE_STATUS.O[row.completeStatus || '0']"
        />
      </template>

      <template #unit="{ row }">
        {{ PERFORMANCE_UNIT.O[row.unit] }}
      </template>

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

    <addTaskPerformance
      v-if="performanceVisible"
      :tableName="'TASK_RUN_PERFORMANCE'"
      @cancel="performanceVisible = false"
      @submit="addPerformanceFun"
    >
    </addTaskPerformance>
    <editPerformancePage
      v-if="editPerformanceVisible"
      @cancel="editPerformanceVisible = false"
      :performance-info="currentPerformance"
      @submit="updatePerformanceFun"
    ></editPerformancePage>
  </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 addTaskPerformance from './addTaskPerformance.vue';
import { editPerformanceApi, exportPerformanceApi } from '@/api/task/taskPerformance';
import { getFormConfigureApi } from '@/api/system/systemData';
import editPerformancePage from './editPerformancePage.vue';
import { getTaskAchieveStyleClass } from '../common/statusDot/statusMap';
import { useDict } from '@/utils/useDict';
import StatusDot from '@/components/common/statusDot/index.vue';

const props = defineProps({
  taskId: {
    type: String,
    default: '',
  },
  runInfo: {
    type: Object,
    default: () => {},
  },
  taskInfo: {
    type: Object,
    default: () => {},
  },
  showSaveButton: {
    type: Boolean,
    default: false,
  },
  paramType: {
    type: String,
    default: 'task',
  },
  fullHeight: {
    type: Boolean,
    default: false,
  },
  showLeftOptions: {
    type: Boolean,
    default: true,
  },
});

const baseTableRef = ref();
const performanceVisible = ref(false);
const editPerformanceVisible = ref(false);
const performanceData = ref<any>([]);
const getTaskPerformanceDataFun = async () => {
  const res: any =
    props.paramType === 'task'
      ? await getTaskPerformanceApi({ taskId: props.taskInfo?.uuid })
      : await getRunPerformanceApi({ runId: props.runInfo?.uuid });
  if (res && res.code === 200) {
    performanceData.value = res.data.map((item: any) => {
      const completeStatus = getPerformanceSTatus(item) || 0;
      return {
        ...item,
        completeStatus,
      };
    });

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

const { RESULT_ACHIEVE_STATUS, PERFORMANCE_UNIT } = useDict(
  'RESULT_ACHIEVE_STATUS',
  'PERFORMANCE_UNIT'
);

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

const addPerformanceFun = async (data: any) => {
  data.flag = 'add';
  const { fullData } = 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);
  }

  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();

  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;
    }

    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 excelHeaders = ref<any>({});
const excelParams = ref<any>({});
const getFormConfigureFun = async () => {
  const res: any = await getFormConfigureApi({
    formName: 'PERFORMANCE_POOL',
  });

  if (res && res.code === 200) {
    const cloumn: any = JSON.parse(res.data.formConfig) || [];
    excelHeaders.value = cloumn.map((item: any) => {
      return {
        key: item.key,
        title: item.title,
      };
    });

    if (props.paramType === 'run') {
      excelParams.value = {
        runId: props.runInfo.uuid,
      };
    } else {
      excelParams.value = {
        taskId: props.taskInfo.uuid,
      };
    }
  }
};

const getPerformanceSTatus = (row: any) => {
  let status: any = 0;
  // 当指标值，达标方式，目标值有一个不存在时，返回状态未分析
  if (!row?.method || !row?.highValue || !row?.targetValue) {
    return status;
  }

  if (row?.method && row?.highValue && row?.targetValue) {
    const highValue = Number(row?.highValue);
    const targetValue = Number(row?.targetValue);
    const lowValue = Number(row?.lowValue);

    // 小于等于
    if (row.method === '≤') {
      if (targetValue <= highValue) {
        status = 2;
      } else {
        status = 1;
      }
    }

    // 小于
    if (row.method === '<') {
      if (targetValue < highValue) {
        status = 2;
      } else {
        status = 1;
      }
    }
    // 大于
    if (row.method === '>') {
      if (targetValue > highValue) {
        status = 2;
      } else {
        status = 1;
      }
    }
    // 大于等于
    if (row.method === '≥') {
      if (targetValue >= highValue) {
        status = 2;
      } else {
        status = 1;
      }
    }
    // 包含
    if (row.method === '[]') {
      if (targetValue <= highValue && targetValue >= lowValue) {
        status = 2;
      } else {
        status = 1;
      }
    }
  }

  return status;
};

defineExpose({
  saveFun,
  baseTableRef,
});

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

const currentPerformance = ref<any>({});
const editPerformanceFun = (row: any) => {
  currentPerformance.value = row;
  editPerformanceVisible.value = true;
};

const updatePerformanceFun = async (data: any) => {
  editPerformanceVisible.value = false;
  const res: any = await editPerformanceApi(data);
  if (res && res.code === 200) {
    ElMessage.success('操作成功');
    await getTaskPerformanceDataFun();
  }
};

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

  await getFormConfigureFun();
});
</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>