SPDM/src/components/taskDetail/task3DModel.vue

<template>
  <div class="task-performance-page">
    <BaseTable
      tableName="TASK_MODEL_FILE"
      ref="baseTableRef"
      :api="getSimulationTaskFilesApi"
      showCheckbox
      :params="{
        uuid: taskId,
        fileBizType: FILE_TYPE.MODEL_3D_FILE,
        fileName: '',
        startTime: '',
        endTime: '',
      }"
      :actionList="actionList"
    >
      <template v-if="showLeftOptions" #leftOptions>
        <!-- <div v-if="showFilter">
          <el-select v-model="currentId" class="select-style">
            <el-option
              v-for="item in taskRunList"
              :label="item.name"
              :value="item.id"
              :key="item.id"
            ></el-option>
          </el-select>
        </div> -->
        <el-upload :show-file-list="false" :accept="accept" :before-upload="beforeUploadFun">
          <el-button>上传文件</el-button>
        </el-upload>
        <el-button class="ml12" type="primary" @click="downLoadFun">下载文件</el-button>
      </template>
      <template #type="{ row }">
        <span>{{ getfileType(row) }}</span>
      </template>
      <template #fileSize="{ row }">
        <span>{{ formatFileSize(row.fileSize) }}</span>
      </template>
      <template #operate="{ row }">
        <el-button link type="primary">
          <UploadFile v-model="row.id" :name="'下载'" />
        </el-button>
      </template>
    </BaseTable>

    <FilePreview v-model="previewVisible" :fileId="currentRow?.id" />
  </div>
</template>

<script setup lang="ts">
import { ref, onMounted } from 'vue';
import BaseTable from '@/components/common/table/baseTable.vue';
import { batchAddFileInfoApi, getSimulationTaskFilesApi } from '@/api/data/data';
import UploadFile from '@/components/common/uploadFile/index.vue';
import FilePreview from '@/components/common/filePreview/index.vue';
import { FILE_TYPE } from '@/utils/enum/file';
import { downloadFileById, formatFileSize, queryFileIdByNodeIdFun } from '@/utils/file';
import { dataOverViewDeleteSimulationNodeFilesApi } from '@/api/data/dataOverView';
import emitter from '@/utils/eventBus';

const props = defineProps({
  taskId: {
    type: String,
    default: '',
  },
  showFilter: {
    type: Boolean,
    default: true,
  },
  showLeftOptions: {
    type: Boolean,
    default: true,
  },
});

// const env = import.meta.env;

const baseTableRef = ref();
const currentId = ref<any>(props.taskId);
const taskRunList = ref<any>([]);
const nodeFIleId = ref<any>('');
const accept = ref<any>('');
const getTaskRunInfoFun = () => {
  taskRunList.value = [
    {
      name: '当前任务',
      id: props.taskId,
    },
  ];
  currentId.value = taskRunList.value[0].id;
};
const getfileType = (data: any) => {
  const fileType = data.originalName.split('.').pop();
  return fileType;
};

const currentRow = ref();
const previewVisible = ref(false);
const previewFileFun = (row: any) => {
  currentRow.value = row;
  previewVisible.value = true;
};

const actionList = ref([
  {
    title: '下载',
    type: 'primary',
    click: (row: any) => {
      downloadFileById(row.id);
    },
  },
  {
    title: '预览',
    type: 'primary',
    click: (row: any) => {
      previewFileFun(row);
    },
  },
  {
    title: '删除',
    type: 'danger',
    needConfirm: true,
    confirmTip: '删除后不可恢复，确认删除吗？',
    click: (row: any) => {
      deleteFun(row);
    },
    hide: () => {
      return !props.showLeftOptions;
    },
  },
]);

const deleteFun = async (row: any) => {
  const param = {
    deleteId: row.id,
    dataType: 2,
  };

  try {
    const res: any = await dataOverViewDeleteSimulationNodeFilesApi(param);
    if (res && res.code === 200) {
      baseTableRef.value.resetFun();
    }
  } catch (error) {
    console.log(error);
  }
};

const beforeUploadFun = (file: any) => {
  // const { name } = file;
  // const params = {
  //   fileName: name,
  //   dirId: nodeFIleId.value,
  //   file: file,
  //   fileType: FILE_TYPE.MODEL_3D_FILE,
  // };
  // dataOverViewUploadSimulationNodeFilesApi(params).then((res: any) => {
  //   if (res.code === 200) {
  //     ElMessage.success('上传成功');
  //     baseTableRef.value.resetFun();
  //   }
  // });

  const { name, size } = file;

  const sourceFiles = [
    {
      fileName: name,
      size: size,
      raw: file,
      fileType: FILE_TYPE.MODEL_3D_FILE,
    },
  ];

  const params = {
    sourceFiles,
    uploadTaskId: new Date().getTime(),
    dirId: nodeFIleId.value,
    projectId: null,
    type: 0,
  };

  batchAddFileInfoApi(params).then((res: any) => {
    if (res.code === 200) {
      baseTableRef.value.resetFun();
      res.data.forEach((item: any) => {
        emitter.emit('ADD_UPLOAD_FILE', {
          file: file,
          data: {
            ...item,
            isApprove: 0,
            taskType: 1,
          },
        });
      });
    }
  });
  return false;
};

const downLoadFun = async () => {
  const data: any = baseTableRef.value.tableRef.getCheckboxRecords() || [];
  if (data.length) {
    for (let i = 0; i < data.length; i++) {
      downloadFileById(data[i].id);
    }
  }
};

onMounted(async () => {
  getTaskRunInfoFun();
  nodeFIleId.value = await queryFileIdByNodeIdFun(props.taskId);
});
</script>

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

  .select-style {
    width: 120px;
  }

  .ml12 {
    margin-left: 12px;
  }
}
</style>