Browse Source

feat: word生成上传

HeWang 9 months ago
parent
commit
14ba384776
2 changed files with 71 additions and 56 deletions
  1. 2 2
      electron/main.js
  2. 69 54
      src/views/ReportView.vue

+ 2 - 2
electron/main.js

@@ -116,7 +116,7 @@ ipcMain.on('docker-import', (event, sudoPassword, filePath, tag) => {
 ipcMain.on('generate-world', (event, {rosbag_path}) => {
 
     // 使用 spawn 启动脚本
-    const serviceProcess = spawn('bash', ["/home/cicv/work/pji_desktop/run_map2gazebo.sh"], { detached: true });
+    const serviceProcess = spawn('bash', ["/home/cicv/work/pji_desktop/world_generation/run_map2gazebo.sh"], { detached: true });
 
     // 设置为后台进程
     serviceProcess.unref();
@@ -142,7 +142,7 @@ ipcMain.on('generate-world', (event, {rosbag_path}) => {
 
     function startSecondScript() {
         // 启动第二个脚本
-        const script2 = exec('bash /home/cicv/work/pji_desktop/play_rosbag.sh ' + rosbag_path, (error, stdout, stderr) => {
+        const script2 = exec('bash /home/cicv/work/pji_desktop/world_generation/play_rosbag.sh ' + rosbag_path, (error, stdout, stderr) => {
             if (error) {
                 console.error(`执行第二个脚本时出错: ${error}`);
                 event.sender.send('generate-world-result', { success: false, output: error });

+ 69 - 54
src/views/ReportView.vue

@@ -48,6 +48,7 @@
               title="地图更新"
               width="400"
               :before-close="handleClose"
+              :close-on-click-modal="false"
           >
             <el-steps style="max-width: 600px" :active="update_active" finish-status="success">
               <el-step title="数据格式检查"/>
@@ -64,6 +65,7 @@
               title="地图续扫提醒"
               width="400"
               :before-close="handleMapClose"
+              :close-on-click-modal="false"
           >
             <el-form :model="mapRescanForm">
               <el-form-item label="请输入地图续扫提醒阈值" label-width="170">
@@ -95,6 +97,7 @@
                 title="请输入算法版本"
                 width="300"
                 :before-close="handleClose"
+                :close-on-click-modal="false"
             >
               <template #footer>
                 <div class="dialog-footer">
@@ -150,6 +153,7 @@
             title="生成world"
             width="400"
             :before-close="handleWorldClose"
+            :close-on-click-modal="false"
         >
           <el-steps style="max-width: 600px" :active="world_active" finish-status="success">
             <el-step title="数据准备"/>
@@ -159,7 +163,21 @@
 
           <template #footer>
             <el-button @click="nextToUpload" v-if="world_active != 2" :disabled="world_active !== 1">下一步</el-button>
-            <el-button @click="nextToUpload" v-if="world_active == 2" >上传</el-button>
+            <el-upload
+                v-if="world_active == 2"
+                ref="upload"
+                class="upload-demo"
+                :action="uploadUrl"
+                :limit="1"
+                :before-upload="beforeUpload"
+                :on-exceed="handleExceed"
+                :auto-upload="true"
+                :multiple="false"
+                :on-success="uploadSuccess"
+                :on-error="errorMessage"
+            >
+              <el-button @click="nextToUpload" >上传</el-button>
+            </el-upload>
           </template>
         </el-dialog>
         <el-table stripe style="background-color: rgba(255,0,0,99%);width: 100%" border :data="tableData"
@@ -175,7 +193,7 @@
           <el-table-column prop="dataStateName" label="数据状态"/>
           <el-table-column width="300" fixed="right" label="操作">
             <template v-slot="scope">
-              <el-button size="small" type="danger" @click="generateWorld(scope.row.id)">生成world</el-button>
+              <el-button size="small" type="danger" @click="generateWorld(scope.row)">生成world</el-button>
               <el-button size="small" type="danger" @click="goToDetail">仿真测试</el-button>
               <!--            <el-button size="small" type="danger" @click="goToDetail">算法评价</el-button>-->
             </template>
@@ -208,6 +226,8 @@ import axios from "axios";
 import {reactive} from 'vue'
 import {ElTable, ElLoading, ElMessage} from "element-plus";
 import {useRouter} from 'vue-router'; // 导入 Vue Router 的 useRouter 钩子
+import { genFileId } from 'element-plus'
+import type { UploadInstance, UploadProps, UploadRawFile } from 'element-plus'
 
 
 const value
@@ -225,13 +245,15 @@ const mapDialogVisible = ref(false)
 const updateDialogVisible = ref(false)
 const worldDialogVisible = ref(false)
 
-const loading = ref(true)
+const upload = ref<UploadInstance>()
+const uploadUrl = ref<string>()
 
 
 const handleClose = (done: () => void) => {
   done()
 }
 const handleWorldClose = (done: () => void) => {
+  world_active.value = 0
   done()
 }
 const handleMapClose = (done: () => void) => {
@@ -241,6 +263,42 @@ const nextToUpload = () => {
   world_active.value = 2
 }
 
+const handleExceed: UploadProps['onExceed'] = (files) => {
+  upload.value!.clearFiles()
+  const file = files[0] as UploadRawFile
+  file.uid = genFileId()
+  upload.value!.handleStart(file)
+}
+
+const beforeUpload = (file) => {
+  const isWorld = file.name.endsWith(".world")
+  if(!isWorld) {
+    ElMessage.error("请上传world文件(以.world结尾)!")
+    return false
+  } else {
+    return true
+  }
+}
+
+//上传文件失败
+const errorMessage = (response) => {
+  return ElMessage({
+    message: "文件上传失败,请联系管理员",
+    type: "error",
+    offset: 60
+  })
+}
+
+//上传文件成功
+const uploadSuccess = (response, file, fileList) => {
+  world_active.value = 3
+  ElMessage({
+    message: "文件上传成功,请关闭对话框",
+    type: "success",
+    offset: 60
+  })
+}
+
 const multipleSelection = ref<[]>([])
 
 // do not use same name with ref
@@ -377,42 +435,18 @@ const rviz = () => {
 }
 
 
-const generateWorld = async (id) => {
-
+const generateWorld = async (row) => {
+  const id = row.id
+  const equipmentNo = row.equipmentNo
+  const sceneNo = "scene-" + id
   console.log("id", id);
+
+  uploadUrl.value = "http://127.0.0.1:8888/world/uploadworldfile?equipmentNo=" + equipmentNo + "&sceneNo=" + sceneNo
+  console.log("uploadUrl.value=" + uploadUrl.value)
+
   console.log("Starting download: map.bag...")
   worldDialogVisible.value = true
 
-  // axios.get('http://127.0.0.1:8888/map/downloadmapbagfile?id=1820978518251540482',
-  //     {
-  //       responseType: 'stream'
-  //     }
-  // ).then(function (response) {
-  //   console.log("response", response);
-  //   console.log("response", response.data.message);
-  //   // const url = window.URL.createObjectURL(new Blob([response.data]));
-  //   // const link = document.createElement('a');
-  //   // link.href = url;
-  //   // link.setAttribute('download', "test.pdf"); // 设置下载的文件名
-  //   // document.body.appendChild(link);
-  //   // link.click();
-  //
-  //   let filePath = "/home/cicv/work/pji_desktop"
-  //
-  //   //从header中读取文件名称
-  //   const headerFilename = response.headers['content-disposition']?.split(';')[1].split('=')[1];
-  //   console.log("response.headers", response.headers)
-  //   console.log("headerFilename",  headerFilename);
-  //   const fileName = decodeURIComponent(headerFilename);
-  //
-  //   downloadByData(response.data, fileName, 'application/json');
-  //
-  //
-  //
-  // }).catch(function (error) {
-  //   console.log(error);
-  // });
-
   const url = "http://127.0.0.1:8888/map/downloadmapbagfile?id=" + id
   const fileName = "map-" + id + ".bag"
   const savePath = "/home/cicv/work"
@@ -441,25 +475,6 @@ const generateWorld = async (id) => {
 }
 
 
-
-// function downloadByData(data: BlobPart, filename: string, mime?: string, bom?: BlobPart) {
-//   const blobData = typeof bom !== 'undefined' ? [bom, data] : [data];
-//   const blob = new Blob(blobData, { type: mime || 'application/octet-stream' });
-//
-//   const blobURL = window.URL.createObjectURL(blob);
-//   const tempLink = document.createElement('a');
-//   tempLink.style.display = 'none';
-//   tempLink.href = blobURL;
-//   tempLink.setAttribute('download', filename);
-//   if (typeof tempLink.download === 'undefined') {
-//     tempLink.setAttribute('target', '_blank');
-//   }
-//   document.body.appendChild(tempLink);
-//   tempLink.click();
-//   document.body.removeChild(tempLink);
-//   window.URL.revokeObjectURL(blobURL);
-// }
-
 const queryLine = reactive({
   dataName: '',
   equipmentName: '',