任务

src/main.js

@@ -5,7 +5,7 @@ import store from './vuex/store'
 import './style/reset.css'
 import VueTouchKeyboard from 'vue-touch-keyboard'
 import 'vue-touch-keyboard/dist/vue-touch-keyboard.css'
-import { Row, Col, Button, Icon, Dialog, Form, FormItem, Input, Select, Option, Table, TableColumn, Tabs, TabPane, Popover, Loading, MessageBox, Message, Progress, Steps, Step } from 'element-ui'
+import { Row, Col, Button, Icon, Dialog, Form, FormItem, Input, Select, Option, Table, TableColumn, Tabs, TabPane, Popover, Loading, MessageBox, Message, Progress } from 'element-ui'
 import 'element-ui/lib/theme-chalk/index.css'
 import './style/common.styl'
 import i18n from './i18n/i18n'
@@ -31,8 +31,6 @@ Vue.use(TabPane)
 Vue.use(Popover)
 Vue.use(Loading)
 Vue.use(Progress)
-Vue.use(Steps)
-Vue.use(Step)
 Vue.prototype.$confirm = MessageBox.confirm
 Vue.prototype.$message = Message
 Vue.use(VueTouchKeyboard)

src/pages/modules/building.vue

@@ -6,7 +6,7 @@
     <gl-map ref="glMap"/>
     <el-row type="flex" justify="end">
       <button class="button_control" @click="$router.push('/index/home')"><p>放弃建图</p></button>
-      <button class="button_control" style="margin-left: 10px" :disabled="disabled" @click="_stopMapping"><p>结束建图</p></button>
+      <button class="button_control" style="margin-left: 10px" :disabled="disabled" @click="stopMappingConfirm"><p>结束建图</p></button>
     </el-row>
     <el-dialog
       title="设置站点"
@@ -230,6 +230,20 @@ export default {
         this.disabled = false
       }
     },
+    stopMappingConfirm () {
+      this.$confirm('确定是否结束建图?', '提示', {
+        confirmButtonText: '确定',
+        cancelButtonText: '取消',
+        type: 'warning'
+      }).then(() => {
+        this._stopMapping()
+      }).catch(() => {
+        this.$message({
+            type: 'info',
+            message: '已取消结束建图'
+          })
+      })
+    },
     // 结束建图
     async _stopMapping () {
       this.disabled = true

src/pages/modules/gl-map.vue

@@ -183,20 +183,14 @@ export default {
       this.controls.enableZoom = true;    // 启用缩放
       this.controls.enablePan = true;     // 启用平移（拖动）
       this.controls.screenSpacePanning = true; // 2D平移模式
-      this.controls.touchZoomSpeed = 0.5; // 降低触摸缩放速度
+      this.controls.touchZoomSpeed = 0.5;
-      this.controls.panSpeed = 0.5;       // 降低平移速度
+      this.controls.panSpeed = 0.5;
 
-      // 鼠标/触摸优化
+      this.controls.touches = {
-      this.controls.mouseButtons = {
+        ONE: THREE.TOUCH.PAN, // 单指拖动为平移
-        LEFT: THREE.MOUSE.PAN, // 左键拖动
+        TWO: THREE.TOUCH.DOLLY_PAN // 双指拖动为缩放和平移
-        MIDDLE: THREE.MOUSE.DOLLY // 中键缩放（可选）
       };
 
-      // 触摸支持
-      this.controls.touchAction = 'none';
-      this.controls.touchPan = true;
-      this.controls.touchZoom = true;
-
       // 添加错误处理逻辑
       this.controls.addEventListener('error', (event) => {
         console.error('OrbitControls error:', event);

src/pages/shells/index.vue

@@ -34,10 +34,13 @@
       <div class="absolute hud_left hud_right"></div>
       <router-view></router-view>
     </el-row>
-    <div v-if="JSON.stringify(topInfo) !== '{}'" class="task-tips">
+    <div v-if="JSON.stringify(topInfo) !== '{}'" class="task_wraper">
-      <el-steps :active="currentStep" simple>
+      <div class="task_content">
-        <el-step v-for="(e, i) in taskSeq" :key="i" :title="e" icon="el-icon-location"></el-step>
+        <div class="step_item" v-for="(e, i) in taskSeq" :key="i" :class="{'step_active': currentStep === i, 'step_actived': i < currentStep}">
-      </el-steps>
+          <div class="step_name">{{ e }}</div>
+          <div v-show="i !== taskSeq.length - 1" class="step_arrow"><img src="../../images/new/arrow.png"></div>
+        </div>
+      </div>
     </div>
     <login-modal v-if="loginVisible" ref="loginModal"/>
     <config-modal v-if="configVisible" ref="configModal"/>
@@ -59,26 +62,26 @@ export default {
       websocket: null, // WebSocket实例
       reconnectTimer: null, // 重连计时器
       topInfo: {},
-      // topInfo: {
+      topInfo1: {
-      //   batteryPower: -1.0,
+        batteryPower: -1.0,
-      //   exceptionInfo: {
+        exceptionInfo: {
-      //     exception: ['重定位失败,检查环境或标记是否有变化.', '定位超时，尝试移动小车位置后重试.', '定位超时，尝试移动小车位置后重试.', '定位超时，尝试移动小车位置后重试.'],
+          exception: ['重定位失败,检查环境或标记是否有变化.', '定位超时，尝试移动小车位置后重试.', '定位超时，尝试移动小车位置后重试.', '定位超时，尝试移动小车位置后重试.'],
-      //     exceptionCodes: [1, 17179869185, 1335734829057]
+          exceptionCodes: [1, 17179869185, 1335734829057]
-      //   },
+        },
-      //   id: '1', // 车号ID
+        id: '1', // 车号ID
-      //   ip: '192.168.100.82', // 车辆IP
+        ip: '192.168.100.82', // 车辆IP
-      //   isManual: false, // 是否是手动，true是手动,false是自动
+        isManual: false, // 是否是手动，true是手动,false是自动
-      //   mapId: 39, // 地图ID
+        mapId: 39, // 地图ID
-      //   mapName: 'apt_map_1753078481180', // 地图名称
+        mapName: 'apt_map_1753078481180', // 地图名称
-      //   name: 'V1', // 车辆名称
+        name: 'V1', // 车辆名称
-      //   state: '未知状态', // 车辆状态
+        state: '未知状态', // 车辆状态
-      //   stateId: 7, // 车辆状态ID
+        stateId: 7, // 车辆状态ID
-      //   theta: 0.9073792099952698, // 车辆航向角
+        theta: 0.9073792099952698, // 车辆航向角
-      //   x: 0.004027, // 车辆x坐标
+        x: 0.004027, // 车辆x坐标
-      //   y: -0.001812, // 车辆y坐标
+        y: -0.001812, // 车辆y坐标
-      //   task_seq: 'B1-C',
+        task_seq: '工作点1-工作点2-工作点3',
-      //   task_point: 'C'
+        task_point: '工作点2'
-      // },
+      },
       taskSeq: '',
       currentStep: 0,
       loginVisible: false,
@@ -263,17 +266,66 @@ export default {
   display inline-block
   font-size .16rem
   color #e6bb3c
-.task-tips
+.task_wraper
-  display flex
-  align-items: center;
   position fixed
   bottom 0
-  left 0
+  left 2%
-  width 100%
+  width 96%
-  height .4rem
+  height .5rem
-  padding 0 2%
+  padding 0 .09rem
-  // background linear-gradient(90deg, #1DB8FF,#1DC5E1, #27C8B0,#819269, #E46355)
+  margin-bottom .1rem
-.task-tips-t
+.task_content
+  height 100%
+  display flex
+  justify-content: center
+  border 1px dashed #1e9fe7
+.step_item
+  display flex
+  align-items center
+.step_arrow
+  position relative
+  width .7rem
+  height 12px
+  background-color #0091de
+  overflow hidden
+  img
+    _wh(21px, 9px)
+    position: absolute;
+    left 50%
+    top: 50%;
+    transform: translate(-50%, -50%);
+.step_name
+  _font(.18rem, .3rem, #fff, ,center)
+  padding 0 .06rem
+  border 1px solid #00d0fc
+  background-image linear-gradient(to bottom,rgba(42, 83, 138, 50%), rgba(57, 101, 181, 50%))
+  box-shadow inset 0 0px 3px 1px rgba(98, 180, 243, 50%)
+  border-radius 2px
+.step_active
+  .step_name
+    background-image linear-gradient(to bottom,rgba(251, 143, 0, 30%), rgba(251, 143, 0, 60%))
+    box-shadow inset 0 0px 3px 1px rgba(251, 143, 0, 50%)
+    border-color #fb8f00
+  .step_arrow
+    img
+      left 0
+      animation: moveRight 3s linear infinite;
+.step_actived
+  .step_name
+    background-image linear-gradient(to bottom,rgba(210, 210, 227, 30%), rgba(210, 210, 227, 60%))
+    box-shadow inset 0 0px 3px 1px rgba(210, 210, 227, 50%)
+    border-color #d2d2e3
+  .step_arrow
+    background-color rgba(210, 210, 227, 50%)
+@keyframes moveRight {
+  from {
+    left: 0;
+  }
+  to {
+    left: calc(100% + 11px);
+  }
+}
+.task_wraper-t
   _font(.2rem, .4rem, #fff, ,center)
 .hud_left
   position absolute

src/style/common.styl

@@ -246,7 +246,7 @@
 .main-conatiner
   width 100%
   height calc(100% - .48rem)
-  padding .3rem 0 .4rem 0
+  padding .3rem 0 .6rem 0
 .page_container
   _wh(96%, 100%)
   padding .09rem