jiuling 8 месяцев назад
Родитель
Сommit
60430fc5ae

+ 5 - 4
src/utils/route-helpers.js

@@ -12,7 +12,7 @@ export function pickName(row) {
 
 // Nav route: name: 'MapNavigation', path: '/map/maplist/navigation/index/:mapId(\\d+)', params: { mapId }
 export function buildNavTo(row) {
-  // const id = pickId(row);
+  const id = pickId(row);
   const mapName = pickName(row);
   console.log("路由跳转mapName:", mapName);
   return { 
@@ -23,16 +23,17 @@ export function buildNavTo(row) {
 
 // Edit route: name: 'MapEdit', path: '/map/maplist/edit/index/:mapId(\\d+)', params: { mapId }
 export function buildEditTo(row) {
-  // const id = pickId(row);
+  const id = pickId(row);
+  const mapName = pickName(row);
   return { 
     name: 'MapEdit', 
-    params: { mapId: id } 
+    params: { mapId: id , mapName:mapName} 
   };
 }
 
 // Calibration route: name: 'MapCalibration', path: '/map/maplist/calibration/index/:mapId(\\d+)', params: { mapId }
 export function buildCalibrateTo(row) {
-  // const id = pickId(row);
+  const id = pickId(row);
   const mapName = pickName(row);
   return { 
     name: 'MapCalibration', 

+ 2 - 2
src/views/map/maplist/calibration.vue

@@ -138,8 +138,8 @@ export default {
       },
       // 当前地图
       currentMap: {
-        id: 1,
-        name: 'sh02'
+        // id: 1,
+        name: this.$route.params.mapName || 'Unknown'
       },
       olWidth: 0,  // 用于存储宽度的变量
       olHeight: 0,

+ 2 - 1
src/views/map/maplist/edit.vue

@@ -172,7 +172,7 @@
 					<OlMap ref="olmap" :width="olWidth + 'px'" :height="olHeight + 'px'" backgroundColor="#F5F5F5"
 						:pointDraSelectEnabled="pointDraSelectEnabled" @elementRoadInitEnd="elementRoadInitEnd"
 						@elementRoadDrawEnd="elementRoadDrawEnd" @removeElementResult="removeElementResult"
-						@selectShowEleResult="selectShowEleResult"></OlMap>
+						@selectShowEleResult="selectShowEleResult":mapName="mapName"></OlMap>
 				</div>
 			</el-col>
 		</el-row>
@@ -558,6 +558,7 @@ export default {
 				{ label: '动态禁行区', value: 22 },
 			],
 			haveDraw: false, // 是否操作过页面元素(新增修改或者删除元素) (在切换页面或者刷新时进行拦截,避免误操作退出页面)
+			mapName:this.$route.params.mapName
 		};
 	},
 	created() {

+ 8 - 142
src/views/map/maplist/navigation.vue

@@ -1,143 +1,6 @@
 <template>
-	<div class="main">
-		<el-row>
-			<el-col :xs="1" :sm="1" :md="1" :lg="1" :xl="1" style="position: relative;">
-				<div class="main-menu">
-					<div class="img-container" :class="{ 'active': activeIndex === 0 }" @click="openDraSetting"><img
-							src="@/assets/icons/img/setting.png" class="notification__image" width="22px" height="22px" />
-						<span class="notification__title">功能</span>
-					</div>
-					<div class="img-container" :class="{ 'active': activeIndex === 1 }" @click="openPoint"><img
-							src="@/assets/icons/img/post.png" class="notification__image" width="22px" height="22px" />
-						<span class="notification__title">目标点</span>
-					</div>
-					<div class="img-container" :class="{ 'active': activeIndex === 2 }" @click="openTask"><img
-							src="@/assets/icons/img/task.png" class="notification__image" width="22px" height="22px" />
-						<span class="notification__title">任务</span>
-					</div>
-					<div class="img-container" :class="{ 'active': activeIndex === 3 }" @click="initNavigation"><img
-							src="@/assets/icons/img/init.png" class="notification__image" width="22px" height="22px" />
-						<span class="notification__title">初始化</span>
-					</div>
-					<div class="img-container" @click="restNavigation"><img src="@/assets/icons/img/restart.png"
-							class="notification__image" width="22px" height="22px" />
-						<span class="notification__title">重启</span>
-					</div>
-					<div class="img-container" @click="offNavigation"><img src="@/assets/icons/img/off.png"
-							class="notification__image" width="22px" height="22px" />
-						<span class="notification__title">结束</span>
-					</div>
-				</div>
-				<!-- 功能设置 -->
-				<div class="drawer" v-show="settingDrawer" style="width: 200px;">
-					<div style="position: relative;">
-						<p>点云</p>
-						<el-radio-group v-model="settingParams.pointCloud" size="mini">
-							<el-radio-button :label="true">开</el-radio-button>
-							<el-radio-button :label="false">关</el-radio-button>
-						</el-radio-group>
-						<p>底图</p>
-						<el-radio-group v-model="settingParams.baseMap" size="mini">
-							<el-radio-button :label="true">开</el-radio-button>
-							<el-radio-button :label="false">关</el-radio-button>
-						</el-radio-group>
-						<p>点ID</p>
-						<el-radio-group v-model="settingParams.pointId" size="mini">
-							<el-radio-button :label="true">开</el-radio-button>
-							<el-radio-button :label="false">关</el-radio-button>
-						</el-radio-group>
-						<p>位置跟随</p>
-						<el-radio-group v-model="settingParams.follow" size="mini">
-							<el-radio-button :label="true">开</el-radio-button>
-							<el-radio-button :label="false">关</el-radio-button>
-						</el-radio-group>
-						<p>网络邻居</p>
-						<el-radio-group v-model="settingParams.network" size="mini">
-							<el-radio-button :label="true">开</el-radio-button>
-							<el-radio-button :label="false">关</el-radio-button>
-						</el-radio-group>
-					</div>
-					<div class="drawer-close" @click="closeDra('hand')"><i class="el-icon-close"></i></div>
-				</div>
-				<!-- 目标点 -->
-				<div class="drawer" v-show="pointDrawer" style="width: 450px;">
-					<div style="position: relative;">
-						<div style="width: 100%;margin-bottom: 10px;">
-							<!-- <el-tooltip class="item" effect="dark" content="将点位显示在地图上" placement="top">
-								<el-button type="primary" icon="el-icon-search" size="mini" :disabled="multiple"></el-button>
-							</el-tooltip> -->
-							<el-tooltip class="item" effect="dark" content="上移" placement="top">
-								<el-button type="primary" icon="el-icon-top" size="mini" :disabled="single" @click="moveUp"></el-button>
-							</el-tooltip>
-							<el-tooltip class="item" effect="dark" content="下移" placement="top">
-								<el-button type="primary" icon="el-icon-bottom" size="mini" :disabled="single"
-									@click="moveDown"></el-button>
-							</el-tooltip>
-							<el-popconfirm title="批量删除选中点位数据?" @confirm="removePoint">
-								<el-button type="danger" icon="el-icon-delete" size="mini" :disabled="multiple" slot="reference"
-									style="margin-left: 10px;"></el-button>
-							</el-popconfirm>
-						</div>
-						<el-table ref="multipleTable" :data="pointList" tooltip-effect="dark" style="width: 100%" max-height="200px"
-							@selection-change="handleSelectionChange" border>
-							<el-table-column type="selection" width="45" align="center">
-							</el-table-column>
-							<el-table-column label="编号" width="60" show-overflow-tooltip align="center">
-								<template slot-scope="scope">{{ scope.row.id }}</template>
-							</el-table-column>
-							<el-table-column label="x坐标" width="90" show-overflow-tooltip align="center">
-								<template slot-scope="scope">{{ scope.row.x }}</template>
-							</el-table-column>
-							<el-table-column label="y坐标" width="90" show-overflow-tooltip align="center">
-								<template slot-scope="scope">{{ scope.row.y }}</template>
-							</el-table-column>
-							<el-table-column label="操作" show-overflow-tooltip align="center">
-								<template slot-scope="scope">
-									<el-button size="mini" type="text" icon="el-icon-edit" @click="editPoint(scope.row)"
-										style="margin-right: 10px;">编辑</el-button>
-									<el-popconfirm title="删除当前点位数据?" @confirm="removePoint(scope.row)">
-										<el-button size="mini" type="text" icon="el-icon-edit" slot="reference">删除</el-button>
-									</el-popconfirm>
-								</template>
-							</el-table-column>
-						</el-table>
-						<div style="width: 100%;margin-top: 10px;">
-							<el-button type="warning" icon="el-icon-caret-right" size="mini" :disabled="single" @click="goto">立即前往</el-button>
-							<el-button type="success" icon="el-icon-folder-add" size="mini" :disabled="multiple"
-								@click="taskGenerateDiaShow = true">生成任务</el-button>
-							<el-button type="success" icon="el-icon-thumb" size="mini" @click="mapSelectEle('open')"
-								v-if="!pointSelectionEnabled">地图选点模式</el-button>
-							<el-button type="danger" icon="el-icon-thumb" size="mini" @click="mapSelectEle('close')"
-								v-else>关闭选点模式</el-button>
-						</div>
-					</div>
-					<div class="drawer-close" @click="closeDra('hand')"><i class="el-icon-close"></i></div>
-				</div>
-				<!-- 任务 -->
-				<div class="drawer" v-if="taskDrawer" style="width: 300px;">
-					<div style="position: relative;">
-						<el-empty description="暂无创建的任务!" v-if="taskDataList.length < 1"></el-empty>
-						<el-collapse v-else>
-							<el-collapse-item v-for="(item, index) in taskDataList" :name="index" :key="item.taskId">
-								<template slot="title"><span>任务名:{{ item.taskName }}</span>
-									<el-tag type="info" v-if="item.status == 1" size="mini" class="task-status-tag">空闲中</el-tag><el-tag
-										type="success" v-else size="mini" class="task-status-tag">执行中</el-tag>
-								</template>
-								<div class="collapse-content-div">
-									<el-button type="danger" size="mini" icon="el-icon-delete"
-										@click="removeTaskItem(item)">删除</el-button>
-									<el-button type="warning" size="mini" icon="el-icon-view">查看</el-button>
-									<el-button type="success" size="mini" icon="el-icon-caret-right" :disabled="item.status == 0"
-										@click="executeTask(item)">执行</el-button>
-								</div>
-							</el-collapse-item>
-						</el-collapse>
-					</div>
-					<div class="drawer-close" @click="closeDra('hand')" style="right: 1px;top: 1px;"><i class="el-icon-close"></i>
-					</div>
-				</div>
-			</el-col>
-			<el-col :xs="23" :sm="23" :md="23" :lg="23" :xl="23">
+	<div class="navigation-container">
+		<div class="map-stage" ref="mapStage">
 				<div class="main-content">
 					<!-- 当前操作类型标记 -->
 					<div class="hand-ment-mark">
@@ -201,7 +64,6 @@
 			/>
 			
 				</div>
-		
 		<!-- 目标点编辑对话框 -->
 		<el-dialog 
 			title="目标点编辑" 
@@ -401,6 +263,8 @@
 				<el-button @click="taskViewDiaShow = false" size="medium">关 闭</el-button>
 			</span>
 		</el-dialog>
+		</div>
+		<MqttComp ref="mqtt" :topics="topics" @message-received="onMessage" />
 	</div>
 </template>
 
@@ -689,7 +553,7 @@ export default {
 			// 	},2,false);
 			// 	this.$refs.olmap.drawPoint()
 			// }
-			this.$refs.olmap.drawTrackLine(-15.491 , -57.526,10.209 , -123.223)
+			// this.$refs.olmap.drawTrackLine(-15.491 , -57.526,10.209 , -123.223)
 		},
 		onMessage({ topic, message }) {
         // console.log("收到消息:", topic, message);
@@ -728,6 +592,8 @@ export default {
     },
 		updateOlCss() {
 			const element = this.$el.querySelector('.map-stage');
+			console.log("地图容器尺寸:", element);
+			
 			this.olWidth = element.offsetWidth;
 			this.olHeight = element.offsetHeight;
 		},
@@ -1821,7 +1687,7 @@ export default {
 
 	.map-stage {
 		position: relative;
-	width: 100%;
+		width: 100%;
 		height: calc(100vh - 84px);
 		min-height: 600px;
 		overflow: hidden;