commit

electron/main.js

@@ -66,7 +66,7 @@ ipcMain.on('open-rviz', (event, arg) => {
 
 ipcMain.on('close-gazebo', (event, arg) => {
     console.log('Received close-gazebo event');
-    exec('pkill -f gazebo', (error, stdout, stderr) => {
+    exec('pkill -f gzserver & pkill -f gzclient', (error, stdout, stderr) => {
         if (error) {
             console.error(`exec error: ${error}`);
             return;

electron/preload.js

@@ -3,19 +3,19 @@ const { contextBridge, ipcRenderer } = require('electron');
 
 contextBridge.exposeInMainWorld('electronAPI', {
     openGazebo: () => {
-        console.log('Sending open-gazebo event');
+        console.log('打开 gazebo');
         ipcRenderer.send('open-gazebo');
     },
     openRviz: () => {
-        console.log('Sending open-rviz event');
+        console.log('打开 rviz');
         ipcRenderer.send('open-rviz');
     },
     closeGazebo: () => {
-        console.log('Sending close-gazebo event');
+        console.log('关闭 gazebo');
         ipcRenderer.send('close-gazebo');
     },
     closeRviz: () => {
-        console.log('Sending close-rviz event');
+        console.log('关闭 rviz');
         ipcRenderer.send('close-rviz');
     },
 });

src/views/AboutView.vue

@@ -1,15 +1,168 @@
 <template>
-  <div class="about">
-    <h1>This is an about page</h1>
-  </div>
+  <el-form :model="form" label-width="auto" style="max-width: 600px">
+    <!--    <el-form-item label="发布终点     ：">-->
+    <!--      <el-button type="primary" @click="onSubmit">默认终点</el-button>-->
+    <!--      <el-button type="primary" @click="onSubmit">自定义终点</el-button>-->
+    <!--    </el-form-item>-->
+    <el-form-item label="发布终点     ：">
+      <el-radio-group v-model="form.resource">
+        <el-radio value="Sponsor">默认终点</el-radio>
+        <el-radio value="Venue">自定义终点</el-radio>
+      </el-radio-group>
+    </el-form-item>
+    <el-form-item label="加载默认障碍物：">
+      <el-radio-group v-model="form.resource">
+        <el-radio value="Sponsor">是</el-radio>
+        <el-radio value="Venue">否</el-radio>
+      </el-radio-group>
+    </el-form-item>
+
+    <!--    <el-form-item label="Activity zone">-->
+    <!--      <el-select v-model="form.region" placeholder="please select your zone">-->
+    <!--        <el-option label="Zone one" value="shanghai" />-->
+    <!--        <el-option label="Zone two" value="beijing" />-->
+    <!--      </el-select>-->
+    <!--    </el-form-item>-->
+    <!--    <el-form-item label="Activity time">-->
+    <!--      <el-col :span="11">-->
+    <!--        <el-date-picker-->
+    <!--            v-model="form.date1"-->
+    <!--            type="date"-->
+    <!--            placeholder="Pick a date"-->
+    <!--            style="width: 100%"-->
+    <!--        />-->
+    <!--      </el-col>-->
+    <!--      <el-col :span="2" class="text-center">-->
+    <!--        <span class="text-gray-500">-</span>-->
+    <!--      </el-col>-->
+    <!--      <el-col :span="11">-->
+    <!--        <el-time-picker-->
+    <!--            v-model="form.date2"-->
+    <!--            placeholder="Pick a time"-->
+    <!--            style="width: 100%"-->
+    <!--        />-->
+    <!--      </el-col>-->
+    <!--    </el-form-item>-->
+    <!--    <el-form-item label="Instant delivery">-->
+    <!--      <el-switch v-model="form.delivery" />-->
+    <!--    </el-form-item>-->
+    <!--    <el-form-item label="Activity type">-->
+    <!--      <el-checkbox-group v-model="form.type">-->
+    <!--        <el-checkbox value="Online activities" name="type">-->
+    <!--          Online activities-->
+    <!--        </el-checkbox>-->
+    <!--        <el-checkbox value="Promotion activities" name="type">-->
+    <!--          Promotion activities-->
+    <!--        </el-checkbox>-->
+    <!--        <el-checkbox value="Offline activities" name="type">-->
+    <!--          Offline activities-->
+    <!--        </el-checkbox>-->
+    <!--        <el-checkbox value="Simple brand exposure" name="type">-->
+    <!--          Simple brand exposure-->
+    <!--        </el-checkbox>-->
+    <!--      </el-checkbox-group>-->
+    <!--    </el-form-item>-->
+
+    <!--    <el-form-item label="Activity form">-->
+    <!--      <el-input v-model="form.desc" type="textarea" />-->
+    <!--    </el-form-item>-->
+    <el-form-item label="            ">
+      <!--      <el-button type="primary" @click="goToMain">开始执行</el-button>-->
+      <el-button type="primary" @click="dialogVisible = true">开始执行</el-button>
+
+      <el-dialog
+          v-model="dialogVisible"
+          title="请输入自定义终点配置参数"
+          width="300"
+          :before-close="handleClose"
+      >
+        <template #footer>
+          <div class="dialog-footer">
+            <el-form :model="form" label-width="auto">
+              <el-form-item style="margin-bottom: 10px" label="位置 X ：">
+                <el-input v-model="form.name" />
+              </el-form-item>
+              <el-form-item style="margin-bottom: 10px" label="位置 Y ：">
+                <el-input v-model="form.name" />
+              </el-form-item>
+              <el-form-item style="margin-bottom: 10px" label="位置 Z ：">
+                <el-input v-model="form.name" />
+              </el-form-item>
+              <el-form-item style="margin-bottom: 10px" label="姿态 X ：">
+                <el-input v-model="form.name" />
+              </el-form-item>
+              <el-form-item style="margin-bottom: 10px" label="姿态 Y ：">
+                <el-input v-model="form.name" />
+              </el-form-item>
+              <el-form-item style="margin-bottom: 10px" label="姿态 Z ：">
+                <el-input v-model="form.name" />
+              </el-form-item>
+              <el-form-item style="margin-bottom: 10px" label="姿态 W ：">
+                <el-input v-model="form.name" />
+              </el-form-item>
+            </el-form>
+<!--            -->
+<!--            <el-button @click="dialogVisible = false">取消</el-button>-->
+            <el-button type="primary" @click="dialogVisible = false">开始执行</el-button>
+          </div>
+        </template>
+      </el-dialog>
+      <el-button style="margin-left: 10px;" type="primary" @click="goToMain">更换终点并执行</el-button>
+    </el-form-item>
+    <el-form-item label="            ">
+      <el-button type="primary" @click="goToMain">算法评价</el-button>
+    </el-form-item>
+    <el-form-item label="            ">
+      <el-button type="primary" @click="goToMain">返回</el-button>
+    </el-form-item>
+
+  </el-form>
 </template>
 
-<style>
-@media (min-width: 1024px) {
-  .about {
-    min-height: 100vh;
-    display: flex;
-    align-items: center;
-  }
+<script lang="ts" setup>
+import {useRouter} from 'vue-router'; // 导入 Vue Router 的 useRouter 钩子
+import {reactive} from 'vue'
+import {ref} from 'vue'
+import {ElMessageBox} from 'element-plus'
+
+const formInline = reactive({
+  user: '',
+  region: '',
+  date: '',
+})
+
+const dialogVisible = ref(false)
+
+const handleClose = (done: () => void) => {
+  // ElMessageBox.confirm('是否关闭对话框？')
+  //     .then(() => {
+  //       done()
+  //     })
+  //     .catch(() => {
+  //       // catch error
+  //     })
+  done()
 }
-</style>
+
+// do not use same name with ref
+const form = reactive({
+  name: '',
+  region: '',
+  date1: '',
+  date2: '',
+  delivery: false,
+  type: [],
+  resource: '',
+  desc: '',
+})
+
+const onSubmit = () => {
+  console.log('submit!')
+}
+const router = useRouter();
+
+const goToMain = () => {
+  router.push('/')
+}
+
+</script>

src/views/ReportView.vue

@@ -12,22 +12,22 @@
         <el-form style=" background-color: rgba(0,0,0,0%);" :inline="true" :model="queryLine"
                  class="demo-form-inline">
           <el-form-item label="数据名称">
-            <el-input v-model="queryLine.teamName" placeholder="请输入数据名称" clearable/>
-          </el-form-item>
-          <el-form-item label="数据标签">
-            <el-input v-model="queryLine.teamName" placeholder="请输入数据标签" clearable/>
+            <el-input v-model="queryLine.dataName" placeholder="请输入数据名称" clearable/>
           </el-form-item>
+          <!--          <el-form-item label="数据标签">-->
+          <!--            <el-input v-model="queryLine.teamName" placeholder="请输入数据标签" clearable/>-->
+          <!--          </el-form-item>-->
           <el-form-item label="设备名称">
-            <el-input v-model="queryLine.teamName" placeholder="请输入设备名称" clearable/>
+            <el-input v-model="queryLine.equipmentName" placeholder="请输入设备名称" clearable/>
           </el-form-item>
           <el-form-item label="设备类型">
-            <el-input v-model="queryLine.teamName" placeholder="请输入设备类型" clearable/>
+            <el-input v-model="queryLine.equipmentTypeName" placeholder="请输入设备类型" clearable/>
           </el-form-item>
           <el-form-item label="触发器名称">
-            <el-input v-model="queryLine.teamName" placeholder="请输入触发器名称" clearable/>
+            <el-input v-model="queryLine.triggerName" placeholder="请输入触发器名称" clearable/>
           </el-form-item>
           <el-form-item label="触发器类型">
-            <el-input v-model="queryLine.teamName" placeholder="请输入触发器类型" clearable/>
+            <el-input v-model="queryLine.triggerTypeName" placeholder="请输入触发器类型" clearable/>
           </el-form-item>
           <el-form-item>
             <el-button type="danger" @click="onSubmit">查询</el-button>
@@ -39,7 +39,7 @@
         <el-button type="primary" @click="onSubmit">算法镜像导入</el-button>
         <el-button style="margin-left: 100px;" type="primary" @click="onSubmit">选择算法镜像版本</el-button>
         <el-switch
-            v-model="value1"
+            v-model="algorithmContainerState"
             class="ml-2"
             inline-prompt
             style="margin-left: 100px;--el-switch-on-color: #13ce66; --el-switch-off-color: #ff4949"
@@ -47,20 +47,22 @@
             inactive-text="算法容器已关闭"
         />
         <el-switch
-            v-model="value2"
+            v-model="gazeboState"
             class="ml-2"
             inline-prompt
             style="margin-left: 100px; --el-switch-on-color: #13ce66; --el-switch-off-color: #ff4949"
             active-text="Gazebo 已开启"
             inactive-text="Gazebo 已关闭"
+            @click="gazebo"
         />
         <el-switch
-            v-model="value3"
+            v-model="rvizState"
             class="ml-2"
             inline-prompt
             style="margin-left: 100px;--el-switch-on-color: #13ce66; --el-switch-off-color: #ff4949"
             active-text="Rviz 已开启"
             inactive-text="Rviz 已关闭"
+            @click="rviz"
         />
         <el-button style="margin-left: 100px;" type="primary" @click="onSubmit">地图更新</el-button>
         <br>
@@ -68,31 +70,17 @@
         <el-table stripe style="background-color: rgba(255,0,0,99%);width: 100%" border :data="tableData"
                   fixed ref="multipleTableRef">
           <el-table-column type="selection" width="55"/>
-          <el-table-column prop="id" label="数据名称"/>
-          <el-table-column prop="id" label="数据容量"/>
-          <el-table-column sortable prop="id" label="设备名称"/>
-          <el-table-column sortable prop="id" label="设备类型"/>
-          <el-table-column sortable prop="id" label="触发器名称"/>
-          <el-table-column sortable prop="id" label="触发器类型"/>
-          <el-table-column sortable prop="id" label="上报时间"/>
-          <el-table-column sortable prop="id" label="数据状态"/>
-          <el-table-column width="300" fixed="right" label="操作">
-            <template #default="scope">
-              <el-button
-                  size="small"
-                  type="danger"
-                  @click="openGazebo"
-              >仿真测试
-              </el-button
-              >
-              <el-button
-                  size="small"
-                  type="danger"
-                  @click="openRviz"
-              >算法评价
-              </el-button
-              >
-            </template>
+          <el-table-column prop="dataName" label="数据名称"/>
+          <el-table-column prop="dataSize" label="数据容量" :formatter="dataSizeFormatter"/>
+          <el-table-column prop="equipmentName" label="设备名称"/>
+          <el-table-column prop="equipmentTypeName" label="设备类型"/>
+          <el-table-column prop="triggerName" label="触发器名称"/>
+          <el-table-column prop="triggerTypeName" label="触发器类型"/>
+          <el-table-column prop="callbackTime" label="上报时间"/>
+          <el-table-column prop="dataStateName" label="数据状态"/>
+          <el-table-column width="100" fixed="right" label="操作">
+            <el-button size="small" type="danger" @click="goToDetail">仿真测试</el-button>
+<!--            <el-button size="small" type="danger" @click="goToDetail">算法评价</el-button>-->
           </el-table-column>
         </el-table>
 
@@ -109,6 +97,7 @@
             @size-change="handleSizeChange"
             @current-change="handleCurrentChange"
         />
+        <!--        <el-pagination background layout="prev, pager, next" :total="1000"/>-->
       </el-main>
       <!--      <el-footer style="background-color: rgba(255,0,0,99%)">国家智能网联汽车创新中心</el-footer>-->
     </el-container>
@@ -120,30 +109,60 @@ import {onBeforeMount, ref} from "vue";
 import axios from "axios";
 import {reactive} from 'vue'
 import {ElTable} from "element-plus";
-import {Check, Close} from '@element-plus/icons-vue'
-
-const value1 = ref(true)
-const value2 = ref(true)
-const value3 = ref(true)
+import { useRouter } from 'vue-router'; // 导入 Vue Router 的 useRouter 钩子
 
+const router = useRouter();
+const algorithmContainerState = ref(false)
+const gazeboState = ref(false)
+const rvizState = ref(false)
 const multipleTableRef = ref<InstanceType<typeof ElTable>>
 
 
-const openGazebo = () => {
-  if (window.electronAPI) {
-    console.log('Calling gazebo & rviz');
-    window.electronAPI.openGazebo();
+const goToDetail = () => {
+  router.push('/about')
+}
+
+// 数据容量单位从B转成MB
+const dataSizeFormatter = (row, column, cellValue, index) => {
+  // 假设 1MB = 1024 * 1024 字节
+  if (cellValue) {
+    const mb = (cellValue / (1024 * 1024)).toFixed(2); // 保留两位小数
+    return `${mb}MB`;
+  }
+  return cellValue; // 如果cellValue为null或undefined，则返回原值或你想要的默认值
+}
+
+const gazebo = () => {
+  if (gazeboState.value) {
+    if (window.electronAPI) {
+      window.electronAPI.openGazebo(); // 关闭 gazebo
+    } else {
+      console.error('electronAPI is not defined');
+    }
+    // gazeboState.value = false
   } else {
-    console.error('electronAPI is not defined');
+    if (window.electronAPI) {
+      window.electronAPI.closeGazebo();
+    } else {
+      console.error('electronAPI is not defined');
+    }
+    // gazeboState.value = true
   }
 }
 
-const openRviz = () => {
-  if (window.electronAPI) {
-    console.log('Calling gazebo & rviz');
-    window.electronAPI.openRviz();
+const rviz = () => {
+  if (rvizState.value) {
+    if (window.electronAPI) {
+      window.electronAPI.openRviz();
+    } else {
+      console.error('electronAPI is not defined');
+    }
   } else {
-    console.error('electronAPI is not defined');
+    if (window.electronAPI) {
+      window.electronAPI.closeRviz();
+    } else {
+      console.error('electronAPI is not defined');
+    }
   }
 }
 
@@ -202,12 +221,12 @@ const openPdf = (index: number, row: any) => {
 }
 
 
-const fit = 'fill'
-const fits = ['fill', 'contain', 'cover', 'none', 'scale-down']
-// const logoUrl = 'src/assets/img.png'
 const queryLine = reactive({
-  teamName: '',
-  topic: '',
+  dataName: '',
+  equipmentName: '',
+  equipmentTypeName: '',
+  triggerName: '',
+  triggerTypeName: '',
 })
 
 const onSubmit = () => {
@@ -221,7 +240,7 @@ onBeforeMount(() => {
 })
 
 function page() {
-  axios.get('http://1.202.169.139:8081/open/scene/list?page=1&size=10',
+  axios.get('http://1.202.169.139:8081/open/scene/list?page=' + currentPage.value + '&size=' + pageSize.value,
       {
         headers: {
           "Authorization": "4773hd92ysj54paflw2jem3onyhywxt2"
@@ -229,7 +248,7 @@ function page() {
       }
   ).then(function (response) {
     tableData.value = response.data.data.content
-    total.value = response.data.totalElements
+    total.value = response.data.data.totalElements
     // total.value = tableData.value.length
     // console.log(tableData);
     // console.log(response.data.data);