|
|
@@ -0,0 +1,358 @@
|
|
|
+<template>
|
|
|
+ <div class="multimodeSimulation">
|
|
|
+ <search-layout :needBox="true">
|
|
|
+ <template slot="searchItem1">
|
|
|
+ <span class="label">地图名称</span>
|
|
|
+ <el-input
|
|
|
+ v-model="searchParams.mapName"
|
|
|
+ size="small"
|
|
|
+ clearable
|
|
|
+ placeholder="请输入"
|
|
|
+ maxlength="60"
|
|
|
+ >
|
|
|
+ </el-input>
|
|
|
+ </template>
|
|
|
+ <template slot="searchItem1">
|
|
|
+ <span class="label">地图描述</span>
|
|
|
+ <el-input
|
|
|
+ v-model="searchParams.mapDescription"
|
|
|
+ size="small"
|
|
|
+ clearable
|
|
|
+ placeholder="请输入"
|
|
|
+ maxlength="60"
|
|
|
+ >
|
|
|
+ </el-input>
|
|
|
+ </template>
|
|
|
+ <template slot="searchBtn1">
|
|
|
+ <el-button type="primary" @click="doSearch">查询</el-button>
|
|
|
+ </template>
|
|
|
+ </search-layout>
|
|
|
+ <div></div>
|
|
|
+ <div style="display: flex; justify-content: end; margin: 20px 50px">
|
|
|
+ <el-button
|
|
|
+ class="addBtn"
|
|
|
+ icon="el-icon-circle-plus-outline"
|
|
|
+ @click="addConfig"
|
|
|
+ type="primary"
|
|
|
+ >新增</el-button
|
|
|
+ >
|
|
|
+ </div>
|
|
|
+ <tableList
|
|
|
+ ref="table"
|
|
|
+ style="margin: 0 30px 30px"
|
|
|
+ :columns="mapColumns"
|
|
|
+ :getDataWay="getDataWay"
|
|
|
+ :pagination="pagination"
|
|
|
+ index
|
|
|
+ >
|
|
|
+ <el-table-column label="操作" slot="cgInfos" align="center" width="180">
|
|
|
+ <template v-slot="scope">
|
|
|
+ <span @click="editMapDetail(scope.row)" class="elIcon"> 编辑 </span>
|
|
|
+ <span @click="deleteMapById(scope.row)" class="elIcon"> 删除 </span>
|
|
|
+ </template>
|
|
|
+ </el-table-column>
|
|
|
+ </tableList>
|
|
|
+ <el-dialog
|
|
|
+ :title="isEdit ? '编辑地图' : '新增地图'"
|
|
|
+ :visible.sync="editVisible"
|
|
|
+ width="480px"
|
|
|
+ :close-on-click-modal="false"
|
|
|
+ :close-on-press-escape="false"
|
|
|
+ @close="closeDialog"
|
|
|
+ >
|
|
|
+ <el-form
|
|
|
+ ref="editInfo"
|
|
|
+ :model="editInfo"
|
|
|
+ label-width="150px"
|
|
|
+ style="display: flex; flex-wrap: wrap; justify-content: space-between"
|
|
|
+ >
|
|
|
+ <el-form-item label="地图名称">
|
|
|
+ <el-input
|
|
|
+ v-model="editInfo.mapName"
|
|
|
+ placeholder="请输入"
|
|
|
+ :disabled="isEdit"
|
|
|
+ ></el-input>
|
|
|
+ </el-form-item>
|
|
|
+ <el-form-item label="轨迹数量">
|
|
|
+ <el-input v-model="editInfo.pathNum" placeholder="请输入"></el-input>
|
|
|
+ </el-form-item>
|
|
|
+ <el-form-item label="地图描述">
|
|
|
+ <el-input
|
|
|
+ v-model="editInfo.mapDescription"
|
|
|
+ placeholder="请输入"
|
|
|
+ ></el-input>
|
|
|
+ </el-form-item>
|
|
|
+ <el-form-item label="OpenDrive文件" v-if="!isEdit">
|
|
|
+ <el-upload
|
|
|
+ :multiple="false"
|
|
|
+ action=""
|
|
|
+ class="upload-demo"
|
|
|
+ list-type="card"
|
|
|
+ :file-list="openFile"
|
|
|
+ :http-request="(e) => uploadHandle('opendrive', e)"
|
|
|
+ :on-remove="() => fileRemove('opendrive')"
|
|
|
+ >
|
|
|
+ <el-button size="small" type="primary">点击上传</el-button>
|
|
|
+ </el-upload>
|
|
|
+ </el-form-item>
|
|
|
+ <el-form-item label="Json文件" v-if="!isEdit">
|
|
|
+ <el-upload
|
|
|
+ :multiple="false"
|
|
|
+ action=""
|
|
|
+ class="upload-demo"
|
|
|
+ list-type="card"
|
|
|
+ :file-list="jsonFile"
|
|
|
+ :http-request="(e) => uploadHandle('json', e)"
|
|
|
+ :on-remove="() => fileRemove('json')"
|
|
|
+ >
|
|
|
+ <el-button size="small" type="primary">点击上传</el-button>
|
|
|
+ </el-upload>
|
|
|
+ </el-form-item>
|
|
|
+ <el-form-item label="Osgb文件" v-if="!isEdit">
|
|
|
+ <el-upload
|
|
|
+ :multiple="false"
|
|
|
+ action=""
|
|
|
+ class="upload-demo"
|
|
|
+ list-type="card"
|
|
|
+ :file-list="osgbFile"
|
|
|
+ :http-request="(e) => uploadHandle('osgb', e)"
|
|
|
+ :on-remove="() => fileRemove('osgb')"
|
|
|
+ >
|
|
|
+ <el-button size="small" type="primary">点击上传</el-button>
|
|
|
+ </el-upload>
|
|
|
+ </el-form-item>
|
|
|
+ </el-form>
|
|
|
+ <div style="width: 100%; display: flex; justify-content: center">
|
|
|
+ <el-button @click="closeDialog">取消</el-button>
|
|
|
+ <el-button @click="addMulationMap" type="primary">确认</el-button>
|
|
|
+ </div>
|
|
|
+ </el-dialog>
|
|
|
+ </div>
|
|
|
+</template>
|
|
|
+<script>
|
|
|
+import searchLayout from '@/components/grid/searchLayout'
|
|
|
+import tableList from '@/components/grid/TableList'
|
|
|
+export default {
|
|
|
+ name: 'simulationHome', // 多模式仿真
|
|
|
+ components: { searchLayout, tableList },
|
|
|
+ data() {
|
|
|
+ return {
|
|
|
+ searchParams: {
|
|
|
+ mapName: '', // 地图名称
|
|
|
+ mapDescription: '', // 地图描述
|
|
|
+ },
|
|
|
+ selectMapId: '', // 当前编辑地图id
|
|
|
+ editVisible: false, // 地图编辑
|
|
|
+ isEdit: false,
|
|
|
+ openFile: [], // opendrive文件
|
|
|
+ jsonFile: [], // json文件
|
|
|
+ osgbFile: [], // osgb文件
|
|
|
+ // 地图管理表头
|
|
|
+ mapColumns: [
|
|
|
+ {
|
|
|
+ label: '地图名称',
|
|
|
+ prop: 'mapName',
|
|
|
+ },
|
|
|
+ {
|
|
|
+ label: '轨迹数量',
|
|
|
+ prop: 'pathNum',
|
|
|
+ },
|
|
|
+ {
|
|
|
+ label: '地图描述',
|
|
|
+ prop: 'mapDescription',
|
|
|
+ },
|
|
|
+ {
|
|
|
+ label: '创建时间',
|
|
|
+ prop: 'createTime',
|
|
|
+ },
|
|
|
+ {
|
|
|
+ label: '操作',
|
|
|
+ prop: 'cgInfos',
|
|
|
+ template: true,
|
|
|
+ },
|
|
|
+ ],
|
|
|
+ editInfo: {
|
|
|
+ mapName: '',
|
|
|
+ mapDescription: '',
|
|
|
+ pathNum: '',
|
|
|
+ }, // 编辑数据
|
|
|
+ pagination: {
|
|
|
+ //分页使用
|
|
|
+ currentPage: 1,
|
|
|
+ pageSize: 10,
|
|
|
+ position: 'right',
|
|
|
+ pageSizes: [10, 30, 50, 100, 200],
|
|
|
+ layout: 'sizes, total, prev, pager, next, jumper',
|
|
|
+ },
|
|
|
+ getDataWay: {
|
|
|
+ //加载表格数据
|
|
|
+ dataType: 'url',
|
|
|
+ type: 'post',
|
|
|
+ data: this.$api.multimode.queryMulationMapList,
|
|
|
+ param: {},
|
|
|
+ },
|
|
|
+ }
|
|
|
+ },
|
|
|
+ methods: {
|
|
|
+ refreshList(param) {
|
|
|
+ param
|
|
|
+ ? this.$refs['table'].loadData(param)
|
|
|
+ : this.$refs['table'].loadData()
|
|
|
+ },
|
|
|
+ doSearch() {
|
|
|
+ this.refreshList({ ...this.searchParams })
|
|
|
+ },
|
|
|
+ doReset() {
|
|
|
+ this.searchParams = {
|
|
|
+ mapName: '', // 地图名称
|
|
|
+ mapDescription: '', // 地图描述
|
|
|
+ }
|
|
|
+ this.refreshList()
|
|
|
+ },
|
|
|
+ // 仿真任务状态更新
|
|
|
+ updateTask(row) {
|
|
|
+ const { id, projectStatus } = row
|
|
|
+ this.$axios({
|
|
|
+ method: 'post',
|
|
|
+ url: this.$api.multimode.updateMulationStatus,
|
|
|
+ data: {
|
|
|
+ projectId: id,
|
|
|
+ projectStatus: projectStatus == 0 || 2 ? 1 : 2,
|
|
|
+ },
|
|
|
+ }).then((res) => {
|
|
|
+ if (res.code == 200) {
|
|
|
+ this.$message.success('状态更新成功')
|
|
|
+ this.doSearch()
|
|
|
+ } else {
|
|
|
+ this.$message.error(res.message || '更新失败')
|
|
|
+ }
|
|
|
+ })
|
|
|
+ },
|
|
|
+ uploadHandle(type, e) {
|
|
|
+ switch (type) {
|
|
|
+ case 'opendrive':
|
|
|
+ this.openFile = [e.file]
|
|
|
+ break
|
|
|
+ case 'json':
|
|
|
+ this.jsonFile = [e.file]
|
|
|
+ break
|
|
|
+ case 'osgb':
|
|
|
+ this.osgbFile = [e.file]
|
|
|
+ break
|
|
|
+ }
|
|
|
+ },
|
|
|
+ // 地图编辑
|
|
|
+ editMapDetail(row) {
|
|
|
+ const { id } = row
|
|
|
+ this.selectMapId = id
|
|
|
+ this.$axios({
|
|
|
+ method: 'post',
|
|
|
+ url: this.$api.multimode.queryMapDetailByID,
|
|
|
+ data: {
|
|
|
+ mapId: id,
|
|
|
+ },
|
|
|
+ }).then((res) => {
|
|
|
+ if (res.code == 200) {
|
|
|
+ this.editInfo = {
|
|
|
+ mapName: res.info.mapName,
|
|
|
+ mapDescription: res.info.mapDescription,
|
|
|
+ pathNum: res.info.pathNum,
|
|
|
+ }
|
|
|
+ this.editVisible = true
|
|
|
+ this.isEdit = true
|
|
|
+ } else {
|
|
|
+ this.$message.error(res.message || '查询详情信息失败')
|
|
|
+ }
|
|
|
+ })
|
|
|
+ },
|
|
|
+ fileRemove(type) {
|
|
|
+ switch (type) {
|
|
|
+ case 'opendrive':
|
|
|
+ this.openFile = []
|
|
|
+ break
|
|
|
+ case 'json':
|
|
|
+ this.jsonFile = []
|
|
|
+ break
|
|
|
+ case 'osgb':
|
|
|
+ this.osgbFile = []
|
|
|
+ break
|
|
|
+ }
|
|
|
+ },
|
|
|
+ // 更新地图
|
|
|
+ updateMap() {
|
|
|
+ this.$axios({
|
|
|
+ method: 'post',
|
|
|
+ url: this.$api.multimode.updateMapDetail,
|
|
|
+ data: {
|
|
|
+ mapId: this.selectMapId,
|
|
|
+ path_num:this.editInfo.pathNum,
|
|
|
+ map_description:this.editInfo.mapDescription
|
|
|
+ },
|
|
|
+ }).then((res) => {})
|
|
|
+ },
|
|
|
+ deleteMapById(row){
|
|
|
+ const { id } = row
|
|
|
+ this.$axios({
|
|
|
+ method: 'post',
|
|
|
+ url: this.$api.multimode.deleteMapById,
|
|
|
+ data: {
|
|
|
+ mapId: id,
|
|
|
+ },
|
|
|
+ }).then((res) => {})
|
|
|
+ },
|
|
|
+ addMulationMap() {
|
|
|
+ if (this.isEdit) {
|
|
|
+ this.updateMap()
|
|
|
+ return
|
|
|
+ }
|
|
|
+ // addMulationMap
|
|
|
+ let formData = new FormData()
|
|
|
+ const json = JSON.stringify(this.editInfo)
|
|
|
+ const blob = new Blob([json], {
|
|
|
+ type: 'application/json',
|
|
|
+ })
|
|
|
+ formData.append('content', blob)
|
|
|
+ formData.append('fileJson', this.jsonFile[0])
|
|
|
+ formData.append('fileDriver', this.openFile[0])
|
|
|
+ formData.append('fileOsgb', this.osgbFile[0])
|
|
|
+ this.$axios({
|
|
|
+ method: 'post',
|
|
|
+ url: this.$api.sceneLibrary.queryScoringRulesInfo,
|
|
|
+ data: formData,
|
|
|
+ withCredentials: true,
|
|
|
+ headers: {
|
|
|
+ 'Content-type': 'multipart/form-data',
|
|
|
+ },
|
|
|
+ }).then((res) => {
|
|
|
+ console.log('res', res)
|
|
|
+ })
|
|
|
+ },
|
|
|
+ addConfig() {
|
|
|
+ this.editVisible = true
|
|
|
+ this.isEdit = false
|
|
|
+ },
|
|
|
+ closeDialog() {
|
|
|
+ this.editInfo = {
|
|
|
+ mapName: '',
|
|
|
+ mapDescription: '',
|
|
|
+ pathNum: '',
|
|
|
+ }
|
|
|
+ this.editVisible = false
|
|
|
+ },
|
|
|
+ },
|
|
|
+}
|
|
|
+</script>
|
|
|
+<style lang='less' scoped>
|
|
|
+// @import './common/util.less';
|
|
|
+.naturalDrivingScenarioListPanel {
|
|
|
+ .inputBox {
|
|
|
+ .label {
|
|
|
+ min-width: 75px;
|
|
|
+ }
|
|
|
+ }
|
|
|
+
|
|
|
+ .btnsPanel {
|
|
|
+ text-align: right;
|
|
|
+ }
|
|
|
+}
|
|
|
+</style>
|
linchengzhe