1
杨磊
3 天以前 2c39f839ba8f9df4fa70f7423b3c2e027cdeb32a
src/views/model/children/landerModel.vue
@@ -61,7 +61,7 @@
                @click="handlePreview(scope.row)"
                >预览</el-button
              >
              <el-button
              <!-- <el-button
                v-if="scope.$index !== 0"
                type="success"
                size="small"
@@ -74,7 +74,7 @@
                size="small"
                @click="handleMoveDown(scope)"
                >下移</el-button
              >
              > -->
            </div>
          </template>
        </el-table-column>
@@ -92,16 +92,8 @@
        />
      </div>
    </div>
    <el-dialog v-model="dialogTableVisible" title="预览">
      <div>
        <iframe
          style="width: 100%; height: 500px"
          src="../static/modelView/index.html?md5=62d4eadc420b7403fce2be993baa095d&name=飞行棋&domain=https://www.jlstp.cn&target=iframe"
          frameborder="0"
        ></iframe>
      </div>
    </el-dialog>
    <!-- 预览 -->
  <previewModule ref="previewModelRef"></previewModule>
    <el-dialog v-model="dialogFormVisible" title="新建模型">
      <el-form :rules="rules" :model="form" ref="formRef">
        <el-form-item
@@ -121,6 +113,19 @@
            style="--el-switch-on-color: #13ce66"
          />
        </el-form-item>
        <el-form-item label="模型文件" :label-width="formLabelWidth">
          <el-upload
            :before-upload="beforeUpload"
            :limit="1"
            v-if="!form.ModelFile"
          >
            <template #trigger>
              <el-button type="primary">上传模型</el-button>
            </template>
          </el-upload>
          <div v-else>{{ form.ModelFile.name }}</div>
        </el-form-item>
        <el-form-item label="备注" :label-width="formLabelWidth">
          <el-input
            v-model="form.ModelRemarks"
@@ -146,6 +151,8 @@
import { inject, onMounted, reactive, ref, watch } from "vue";
import { Plus } from "@element-plus/icons-vue";
import { curStoreInfo } from "@/store/index";
import SparkMD5 from "spark-md5";
import previewModule from "@/components/previewModelDialog.vue";
import {
  ComponentSize,
  ElMessage,
@@ -172,6 +179,8 @@
const background = ref(true);
const isLoading = ref(false);
const tableData = ref([]);
const file = ref(null);
const md5 = ref("");
const previewUrl = ref(
  "./static/modelView/index.html?md5=62d4eadc420b7403fce2be993baa095d&name=飞行棋&domain=https://www.jlstp.cn&target=iframe"
);
@@ -180,7 +189,10 @@
  JointData: "",
  IsSimulation: false,
  ModelRemarks: "",
  ModelFile: null,
});
const progress = ref(0);
const seleStore = curStoreInfo();
//分页数据量
const tableTotal = ref(0);
@@ -198,6 +210,101 @@
  }
);
const beforeUpload = (file) => {
  file.value = file;
  md5.value = "";
  progress.value = 0;
  if (file.value) {
    const md5 = calculateMD5(file.value);
    console.log(md5, "md5md5md5md5.value");
  }
  console.log(file.value, "file.value");
  console.log(md5.value, "md5.value");
  return false;
};
// 计算MD5
const calculateMD5 = (file) => {
  const chunkSize = 1 * 1024 * 1024; // 2MB分块
  const chunks = Math.ceil(file.size / chunkSize);
  const spark = new SparkMD5.ArrayBuffer();
  const fileReader = new FileReader();
  let currentChunk = 0;
  fileReader.onload = (e) => {
    spark.append(e.target.result);
    currentChunk++;
    progress.value = Math.min(100, Math.floor((currentChunk / chunks) * 100));
    if (currentChunk < chunks) {
      loadNextChunk();
    } else {
      md5.value = spark.end();
      console.log(md5.value, "md5.value");
      console.log(file, "file.value");
      if (md5.value) {
        initFile(md5.value, file);
      }
      progress.value = 100;
    }
  };
  fileReader.onerror = () => {
    console.error("文件读取错误");
  };
  const loadNextChunk = () => {
    const start = currentChunk * chunkSize;
    const end = Math.min(start + chunkSize, file.size);
    fileReader.readAsArrayBuffer(file.slice(start, end));
  };
  loadNextChunk();
};
const initFile = (md5, file) => {
  form.ModelFile = {
    name: file.name,
    md5: md5,
  };
  MG.dps5
    .postFileUploadGetFileInfo({
      md5: md5,
    })
    .then((res) => {
      console.log(res, "res");
      if (res && !res.id) {
        const body = {
          name: file.name,
          md5: md5,
          fileName: file.value.name,
          extension: file.name.split(".").pop(),
          fileType: "model",
          metaData: "",
          type: "model",
          icon: "",
          size: file.size,
          accessType: "Private", // Public and Private
        };
        MG.dps5.postFileUploadInitFile(body).then((initRes) => {
          console.log(initRes, "initRes");
          const params = {
            Md5: md5,
            IsLastOne: true,
            Offset: 0,
            file,
          };
          MG.dps5.postFileUploadUpload(params).then((uploadRes) => {
            console.log(uploadRes, "uploadRes");
          });
        });
      }
    });
};
// 搜索
const handleSearch = () => {
  console.log(input4.value, "input4");
@@ -238,8 +345,18 @@
  getTableData();
};
//预览操作
const handlePreview = (row) => {
  dialogTableVisible.value = true;
const previewModelRef = ref<any>();
const showModelData = ref<any>(null);
const handlePreview = (row: any) => {
  let md5: any = null;
  try {
    const fileData = row.fieldList.find((item: any) => item.FileList.length);
    md5 = fileData.FileList[0].File.Md5;
  } catch (error) {}
  previewModelRef.value.handleDialogVisible(true, {
    name: row.name,
    md5,
  });
};
//上移操作
const handleMoveUp = (row) => {};
@@ -253,6 +370,7 @@
  isLoading.value = true;
  const fields = {
    ModelName: [],
    ModelFile: [],
    JointData: [],
    IsSimulation: [],
    ModelRemarks: [],
@@ -360,6 +478,9 @@
              case "ModelRemarks":
                fieldObj["textValue"] = form[key];
                break;
              case "ModelFile":
                fieldObj["linkFiles"].push(form[key].md5);
                break;
            }
            editObj.add.push(fieldObj);
          }
@@ -428,9 +549,16 @@
            case "ModelRemarks":
              fieldObj["textValue"] = form[key];
              break;
            case "ModelFile":
              fieldObj["linkFiles"].push(form[key].md5);
              break;
          }
          fieldList.push(fieldObj);
        }
        console.log(fieldList, "fieldList");
        debugger;
        const params = {
          accessModule: "",
          accessPath: seleStore.channelInfo.data.idPath,