地图点位样式修改，曲线逻辑修改，引导功能修改

src/pages/modules/build/driver-modal.vue

@@ -0,0 +1,65 @@
+<template>
+  <el-dialog
+    class="config_dialog config_dialog_h"
+    :class="{'enClass': $i18n.locale === 'en-us'}"
+    title="新手指导"
+    :visible.sync="dialogVisible"
+    width="80%"
+    :before-close="handleClose">
+    <el-row  type="flex" justify="space-between" style="height: calc(100% - .46rem);padding: 0 .2rem;">
+      <el-col :span="7">
+        <div class="step_w"><img src="../../../images/new/step_1.jpg" alt=""></div>
+        <p class="step_p">1.车辆将自动扫描周边环境，拖动车辆即可开始记录行走路线；</p>
+      </el-col>
+      <el-col :span="7">
+        <div class="step_w"><img src="../../../images/new/step_2.jpg" alt=""></div>
+        <p class="step_p">2.当车辆移动到目标工位点时，点击「打点」按钮，即可保存当前位置为工位点；</p>
+      </el-col>
+      <el-col :span="7">
+        <div class="step_w"><img src="../../../images/new/step_3.jpg" alt=""></div>
+        <p class="step_p">3.路线与工位点记录完成后，点击「结束建图」，等待系统自动生成地图即可。</p>
+      </el-col>
+    </el-row>
+    <button class="button_control" style="display: inherit;margin:.1rem auto 0 auto;" @click="driverConfirm"><p>我知道了</p></button>
+  </el-dialog>
+</template>
+
+<script>
+export default {
+  data () {
+    return {
+      dialogVisible: false
+    }
+  },
+  methods: {
+    init () {
+      this.dialogVisible = true
+    },
+    handleClose (done) {
+      done()
+      this.$emit('driverConfirm')
+    },
+    driverConfirm () {
+      this.dialogVisible = false
+      this.$emit('driverConfirm')
+    }
+  }
+}
+</script>
+
+<style lang="stylus" scoped>
+ .step_w
+  display: flex;
+  justify-content: center;
+  align-items: center;
+  height 50%
+  background-color rgba(255,255,255,0.3)
+  img
+    width 100%
+    height auto
+.step_p
+  font-size .2rem
+  color #fff
+  line-height .26rem
+  padding-top .1rem
+</style>

src/pages/modules/build/gl-map.vue

@@ -13,9 +13,9 @@
 /* eslint-disable */
 import * as THREE from 'three'
 import { mapGetters } from 'vuex'
-// import { points } from '../../config/point.js'
-// import { points1 } from '../../config/point1.js'
-// import { points2 } from '../../config/point2.js'
+// import { points } from '@/config/point.js'
+// import { points1 } from '@/config/point1.js'
+// import { points2 } from '@/config/point2.js'
 export default {
   name: 'PointCloudMap',
   data() {

src/pages/modules/build/index copy.vue

@@ -0,0 +1,615 @@
+<template>
+  <div class="page_container" :class="{'enClass': $i18n.locale === 'en-us'}">
+    <div id="v-step-1" class="map_container">
+      <gl-map ref="glMap"/>
+    </div>
+    <el-row type="flex" justify="space-between">
+      <el-col :span="15">
+        <el-row type="flex">
+          <button id="v-step-2" class="button_control" :disabled="disabled" @click="addPoint"><p>{{$t('MarkPoint')}}</p></button>
+          <button class="button_control" style="margin-left: 10px" :disabled="disabled" @click="closeCloud"><p>{{cloudOff ? $t('EnablePointCloud') : $t('DisablePointCloud')}}</p></button>
+          <div class="car-info">{{$t('CartPosition')}}: <span>{{ carPosition.x }}, {{carPosition.y}}</span></div>
+        </el-row>
+      </el-col>
+      <el-col :span="1" style="color: #fff;">{{ autoBackEnable }}, {{autoBackFinish}}</el-col>
+      <el-col :span="8">
+        <el-row type="flex" justify="end">
+          <button class="button_control" @click="$router.push('/index/home')"><p>{{$t('AbandonMapbuild')}}</p></button>
+          <button id="v-step-3" class="button_control" :class="{'button_control_gray': autoLoopEnable !== '1'}" style="margin-left: 10px" :disabled="disabled" @click="stopMappingConfirm"><p>{{$t('FinishMapbuild')}}</p></button>
+        </el-row>
+      </el-col>
+    </el-row>
+    <el-dialog
+      :title="$t('SetUpStation')"
+      :visible.sync="dialogVisible"
+      :close-on-click-modal="false"
+      :close-on-press-escape="false"
+      width="55%">
+      <el-form :model="dataForm" ref="dataForm" :rules="dataRule" :label-width="$i18n.locale === 'en-us' ? '' : '1.1rem'" size="mini" @submit.native.prevent>
+        <el-form-item :label="$t('StationName')" prop="stationName">
+          <el-input v-model="dataForm.stationName" id="stationName"></el-input>
+        </el-form-item>
+      </el-form>
+      <el-row type="flex" justify="space-around" style="margin-top: .3rem">
+        <el-col :span="7"><button class="button_control button_control_disabled" @click="dialogVisible = false"><p>{{$t('Cancel')}}</p></button></el-col>
+        <el-col :span="7"><button class="button_control" @click="stationConfirm"><p>{{$t('Save')}}</p></button></el-col>
+      </el-row>
+    </el-dialog>
+    <transition name="custom-message" >
+      <div v-if="message" class="message" :style="{'top': isTop ? '.87rem' : '.57rem', 'color': error ? '#F56C6C' : '#67C23A'}">
+        <i :class="error ? 'el-icon-error' : 'el-icon-success'"></i>
+        <p>{{ message }}</p>
+      </div>
+    </transition>
+    <div v-if="showProgress" class="progress-mask">
+      <!-- 进度条内容区 -->
+      <div class="progress-container">
+        <div class="progress_tip">{{warnTip ? $t('Mapdeployed') : $t('Mapgenerated')}}</div>
+        <el-progress
+          v-show="!warnTip" 
+          :percentage="percentage" 
+          :stroke-width="10"
+          style="width: 300px;"
+        ></el-progress>
+      </div>
+    </div>
+    <div v-if="tipShow" class="progress-mask">
+      <div class="progress-container">
+        <div class="progress_tip">{{autoBackFinish === '2' ? $t('autobackfailedmanually') : $t('vehicleautobacknotmanwaitcompleted')}}</div>
+        <button v-if="autoBackFinish === '2'" class="button_control" style="margin-top: 25px;" @click="failHandle"><p>{{$t('Confirm')}}</p></button>
+      </div>
+    </div>
+  </div>
+</template>
+
+<script>
+import GlMap from './gl-map.vue'
+import { driver } from 'driver.js'
+import 'driver.js/dist/driver.css'
+import { startMapping, stopMapping, getMappingStatus, setStation, oneClickDeployment, abandonMapping, sendAutoBack } from '@/config/getData.js'
+import { mapGetters } from 'vuex'
+export default {
+  name: 'ModuleBuilding',
+  components: {
+    GlMap
+  },
+  beforeRouteLeave (to, from, next) {
+    if (this.needsConfirmation) {
+      this.$confirm(this.$t('Doabandonmapattempt'), this.$t('Prompt'), {
+        confirmButtonText: this.$t('Confirm'),
+        cancelButtonText: this.$t('Cancel'),
+        type: 'warning'
+      }).then(async () => {
+        try {
+          // 显示加载中状态
+          this.loading = this.$loading({
+            lock: true,
+            spinner: 'el-icon-loading',
+            background: 'rgba(0, 0, 0, 0.6)'
+          })
+          // 调用放弃建图接口
+          const res = await abandonMapping()
+          this.loading.close()
+          if (res && res.code === 200) {
+            // 接口成功，允许离开页面
+            this.needsConfirmation = false // 标记无需再确认
+            next()
+          } else {
+            // 接口返回失败，提示错误并阻止离开
+            this.$message.error(res.message)
+            next(false)
+          }
+        } catch (error) {
+          // 发生异常，提示错误并阻止离开
+          this.loading.close()
+          next(false)
+        }
+      }).catch(() => {
+        next(false) // 阻止离开
+      })
+    } else {
+      next()
+    }
+  },
+  data () {
+    const validateStationName = (rule, value, callback) => {
+        if (value && value.includes(',')) {
+            callback(new Error(this.$t('stationnotcommas')));
+        } else {
+            callback();
+        }
+    }
+    return {
+      cloudOff: false,
+      driver: null,
+      driverActive: true,
+      needsConfirmation: true,
+      mapName: '',
+      dialogVisible: false,
+      dataForm: {
+        stationCode: '',
+        stationName: ''
+      },
+      dataRule: {
+        stationName: [
+          { validator: validateStationName, trigger: 'blur' }
+        ]
+      },
+      submitSuccess: false,
+      keyPoints: [],
+      disabled: false,
+      message: '', // 用于显示消息
+      error: false,
+      showProgress: false,
+      warnTip: false,
+      percentage: 0,
+      intervalId: null, // 用于存储定时器ID
+      backActive: false, // 打点完成后新增一个弹框 提示用户是否自动开回上一个点
+      tipShow: false // 正在自动回退中的提示
+    }
+  },
+  computed: {
+    ...mapGetters(['isTop', 'carPosition', 'autoLoopEnable', 'autoBackEnable', 'autoBackFinish'])
+  },
+  watch: {
+    autoBackEnable: {
+      handler (val) {
+        this.backHandleChange(this.backActive, val)
+      },
+      deep: true
+    },
+    backActive: {
+      handler (val) {
+        this.backHandleChange(val, this.autoBackEnable)
+      },
+      deep: true
+    },
+    autoBackFinish: {
+      handler (val) {
+        if (val === '1') {
+          this.$nextTick(() => {
+            this.$refs.glMap.init()
+          })
+          this.tipShow = false
+        }
+      },
+      deep: true
+    }
+  },
+  beforeDestroy () {
+    document.removeEventListener('keydown', this.handleKeydown);
+    if (this.intervalId) {
+      clearTimeout(this.intervalId)
+    }
+  },
+  mounted() {
+    // 初始化并启动引导
+    this.$nextTick(() => {
+      this.initGuide()
+    })
+    document.addEventListener('keydown', this.handleKeydown);
+  },
+  methods: {
+    /* eslint-disable */
+    backHandleChange(active, val) {
+      if (active && val === '0') {
+        this.loading = this.$loading({
+          lock: true,
+          text: this.$t('systemcalculatingnotmovevehicle'),
+          spinner: 'el-icon-loading',
+          background: 'rgba(0, 0, 0, 0.6)'
+        })
+      }
+      if (active && val === '1') {
+        this.loading.close()
+      }
+      if (active && val === '2') {
+        this.loading.close()
+        this.$confirm(this.$t('Whetherdrivebackpoint'), this.$t('Prompt'), {
+          confirmButtonText: this.$t('yes'),
+          cancelButtonText: this.$t('no'),
+          type: 'warning'
+        }).then(() => {
+          this._sendAutoBack('0')
+          this.backActive = false
+        }).catch(() => {
+          this._sendAutoBack('1')
+          this.backActive = false
+        })
+      }
+    },
+    handleKeydown(event) {
+      // 仅在对话框可见时响应Enter键
+      if (this.dialogVisible && event.key === 'Enter') {
+        event.preventDefault(); // 阻止默认行为
+        this.stationConfirm();
+      }
+    },
+    initGuide() {
+      const config = {
+        // allowClose: false,
+        overlayOpacity: 0.7,
+        popoverClass: 'driverjs-theme',
+        stagePadding: 0,
+        nextBtnText: this.$t('next'),
+        prevBtnText: this.$t('previous'),
+        doneBtnText: this.$t('close'),
+        onDestroyed: () => {
+          this.driverActive = false
+          this._startMapping()
+        },
+        onPopoverRender: (popover, {config, state}) => {
+          if (state.activeIndex === 0) {
+            const popoverElement = document.querySelector('.driver-popover')
+            if (popoverElement) {
+              setTimeout(()=>{
+                popoverElement.style.top = '25%'
+                popoverElement.style.bottom = 'auto'
+                popoverElement.style.left = 'calc(2% + 0.2rem)'
+                popoverElement.style.right = 'auto'
+              }, 20)
+            }
+          }
+        }
+      }
+      const steps = [
+        {
+          element: '#v-step-1',
+          popover: {
+            description: this.$t('driverTxt1'),
+            side: 'left',
+            align: 'center'
+          }
+        },
+        {
+          element: '#v-step-2',
+          popover: {
+            description: this.$t('driverTxt2'),
+            side: 'top',
+            align: 'start'
+          }
+        },
+        {
+          element: '#v-step-3',
+          popover: {
+            description: this.$t('driverTxt3'),
+            side: 'top',
+            align: 'end'
+          }
+        }
+      ];
+      this.driver = driver({
+        ...config,
+        steps
+      })
+      this.driver.drive()
+    },
+    // 开始建图
+    async _startMapping () {
+      try {
+        this.loading = this.$loading({
+          lock: true,
+          spinner: 'el-icon-loading',
+          background: 'rgba(0, 0, 0, 0.6)'
+        })
+        const now = new Date()
+        const year = now.getFullYear()
+        const month = String(now.getMonth() + 1).padStart(2, '0') // 月份从0开始，补0
+        const day = String(now.getDate()).padStart(2, '0')
+        const hours = String(now.getHours()).padStart(2, '0')
+        const minutes = String(now.getMinutes()).padStart(2, '0')
+        const seconds = String(now.getSeconds()).padStart(2, '0')
+        this.mapName = `apt_map_${year}${month}${day}${hours}${minutes}${seconds}`
+        let res = await startMapping(this.mapName)
+        if (res && res.code === 200) {
+          this.message = this.$t('carbuildingmap')
+          this.error = false
+          this.$nextTick(() => {
+            this.$refs.glMap.init()
+          })
+        }
+        this.loading.close()
+      } catch (e) {
+        this.message = this.$t('errorbuildingredone')
+        this.error = true
+        this.loading.close()
+      }
+    },
+    // 打点
+    addPoint () {
+      if (this.driverActive) return
+      this.dialogVisible = true
+      this.dataForm.stationCode = 'B' + (this.keyPoints.length + 1)
+      const na = this.$i18n.locale === 'en-us' ? 'Work point ' : '工作点'
+      this.dataForm.stationName = `${na}${this.keyPoints.length + 1}`
+
+      this.$nextTick(() => {
+        const input = document.getElementById('stationName');
+        if (input) {
+          input.focus();
+        }
+      })
+    },
+    // 打点->保存
+    stationConfirm () {
+      this.$refs.dataForm.validate((valid) => {
+        if (valid) {
+          this.submitSuccess = true
+          this._setStation()
+          setTimeout(() => {
+              this.submitSuccess = false
+          }, 3000)
+        } else {
+          return false
+        }
+      })
+    },
+    async _setStation () {
+      this.disabled = true
+      try {
+        let res = await setStation(this.dataForm.stationName, this.dataForm.stationCode)
+        if (res) {
+          if (res.code === 200) {
+            this.$message({
+              type: 'success',
+              message: res.message
+            })
+            this.keyPoints.push(this.dataForm.stationCode)
+            this.backActive = true
+          } else {
+            this.$message.error(res.message)
+            this.backActive = false
+          }
+        }
+        this.dialogVisible = false
+        this.disabled = false
+      } catch (e) {
+        this.$message.error(e)
+        this.dialogVisible = false
+        this.disabled = false
+        this.backActive = false
+      }
+    },
+    stopMappingConfirm () {
+      if (this.autoLoopEnable !== '1') return
+      if (this.driverActive) return
+      this.$confirm(this.$t('sureendbuilding'), this.$t('Prompt'), {
+        confirmButtonText: this.$t('Confirm'),
+        cancelButtonText: this.$t('Cancel'),
+        type: 'warning'
+      }).then(() => {
+        this._stopMapping()
+      }).catch(() => {
+        this.$message({
+            type: 'info',
+            message: this.$t('endbuildingcancel')
+          })
+      })
+    },
+    // 结束建图
+    async _stopMapping () {
+      this.disabled = true
+      try {
+        this.loading = this.$loading({
+          lock: true,
+          spinner: 'el-icon-loading',
+          background: 'rgba(0, 0, 0, 0.6)'
+        })
+        let res = await stopMapping()
+        if (res && res.code === 200) {
+          this.message = ''
+          this.error = false
+          this.$nextTick(() => {
+            this.$refs.glMap.closeWebSocket()
+          })
+          this._getMappingStatus()
+        }
+        this.disabled = false
+        this.loading.close()
+      } catch (e) {
+        this.message = this.$t('errorendbuilding')
+        this.error = true
+        this.disabled = false
+        this.loading.close()
+      }
+    },
+    // 进度条
+    async _getMappingStatus () {
+      try {
+        let res = await getMappingStatus()
+        this.showProgress = true
+        this.percentage = Number(res.mapping_percent) || 0
+        if (res.mapping_return === '0') {
+          if (this.intervalId) clearTimeout(this.intervalId)
+          this.intervalId = setTimeout(() => this._getMappingStatus(), 1000)
+        }
+        if (res.mapping_return === '1') {
+          if (this.intervalId) clearTimeout(this.intervalId)
+          this.warnTip = true
+          this.percentage = 0
+          this._oneClickDeployment()
+        }
+        if (res.mapping_return === '2') {
+          if (this.intervalId) clearTimeout(this.intervalId)
+          this.showProgress = false
+          this.percentage = 0
+          this.keyPoints = []
+          this.$confirm(this.$t('Newfailedagain'), this.$t('Prompt'), {
+            confirmButtonText: this.$t('Confirm'),
+            cancelButtonText: this.$t('Cancel'),
+            type: 'warning'
+          }).then(() => {
+            this._startMapping()
+          }).catch(() => {
+            this.$message({
+              type: 'info',
+              message: this.$t('Mapbuildingcancel')
+            })
+          })
+        }
+      } catch (e) {
+        this.message = ''
+        this.error = false
+        this.keyPoints = []
+        this.$confirm(this.$t('Newfailedagain'), this.$t('Prompt'), {
+          confirmButtonText: this.$t('Confirm'),
+          cancelButtonText: this.$t('Cancel'),
+          type: 'warning'
+        }).then(() => {
+          this._startMapping()
+        }).catch(() => {
+          this.$message({
+            type: 'info',
+            message: this.$t('Mapbuildingcancel')
+          })
+        })
+      }
+    },
+    async _oneClickDeployment () {
+      try {
+        let res = await oneClickDeployment(this.mapName)
+        if (res && res.code === 200) {
+          this.$message({
+            type: 'success',
+            message: res.message
+          })
+          this.needsConfirmation = false
+          this.$router.push('/index/home')
+        } else {
+          this.$message.error(res.message)
+        }
+        this.showProgress = false
+        this.warnTip = false
+        this.message = ''
+        this.error = false
+        this.disabled = false
+        this.loading.close()
+      } catch (e) {
+        this.showProgress = false
+        this.warnTip = false
+        this.$message.error(e)
+        this.message = ''
+        this.error = false
+        this.disabled = false
+        this.loading.close()
+      }
+    },
+    closeCloud () {
+      this.cloudOff = !this.cloudOff
+      if (this.cloudOff) {
+        this.$nextTick(() => {
+          this.$refs.glMap.closeWebSocket()
+        })
+      } else {
+        this.$nextTick(() => {
+          this.$refs.glMap.init()
+        })
+      }
+    },
+    // 打点功能点击返回成功后
+    async _sendAutoBack (flag) {
+      try {
+        this.loading = this.$loading({
+          lock: true,
+          spinner: 'el-icon-loading',
+          background: 'rgba(0, 0, 0, 0.6)'
+        })
+        let res = await sendAutoBack(flag)
+        if (res && res.code === 200) {
+          if (flag === '0') {
+            this.$nextTick(() => {
+              this.$refs.glMap.closeWebSocket()
+            })
+            this.tipShow = true
+          }
+        }
+        this.loading.close()
+      } catch (e) {
+        this.loading.close()
+      }
+    },
+    failHandle () {
+      this.$nextTick(() => {
+        this.$refs.glMap.init()
+      })
+      this.tipShow = false
+    }
+  }
+}
+</script>
+
+<style lang="stylus" scoped>
+.map_container
+  position relative
+  width 100%
+  height calc(100% - .5rem)
+  margin-bottom .14rem
+.message
+  min-width 380px
+  border 1px solid #e1f3d8
+  border-radius 4px
+  position fixed
+  left 50%
+  transform translateX(-50%)
+  background-color #f0f9eb
+  transition opacity .3s,transform .4s
+  overflow hidden
+  padding 8px 15px
+  z-index 2003
+  display flex
+  align-items center
+  font-size .2rem
+  list-height 1
+  p
+    margin-left 10px
+.custom-message-enter, .custom-message-leave-to
+  opacity 0
+  transform translate(-50%,-100%)
+.progress-mask {
+  position: fixed;
+  top: 0;
+  left: 0;
+  right: 0;
+  bottom: 0;
+  background-color: rgba(0, 0, 0, 0.6); /* 半透明黑色遮罩 */
+  z-index: 9999; /* 确保在最上层 */
+  display: flex;
+  justify-content: center;
+  align-items: center;
+}
+
+/* 进度条容器 */
+.progress-container {
+  background-color: #fff;
+  padding: 30px 40px;
+  border-radius: 8px;
+  text-align: center;
+  box-shadow: 0 2px 12px rgba(0, 0, 0, 0.1);
+}
+.progress_tip {
+  font-size: .2rem
+  line-height: .34rem
+  color: #000
+  font-weight: 700
+}
+.car-info
+  max-width calc(100% - 3rem)
+  background: rgba(30, 95, 239, 60%);
+  padding: 0 10px;
+  border-radius: 8px;
+  margin-left: 10px;
+  font-size: 0.2rem;
+  line-height: 0.36rem;
+  color: #fff
+  overflow: hidden
+.button_control
+  p
+    font-size .26rem
+.enClass
+  .button_control
+    p
+      font-size .18rem
+      line-height .16rem
+  .car-info
+    font-size .16rem
+</style>

src/pages/modules/build/index.vue

@@ -4,14 +4,13 @@
       <gl-map ref="glMap"/>
     </div>
     <el-row type="flex" justify="space-between">
-      <el-col :span="15">
+      <el-col :span="18">
         <el-row type="flex">
           <button id="v-step-2" class="button_control" :disabled="disabled" @click="addPoint"><p>{{$t('MarkPoint')}}</p></button>
           <button class="button_control" style="margin-left: 10px" :disabled="disabled" @click="closeCloud"><p>{{cloudOff ? $t('EnablePointCloud') : $t('DisablePointCloud')}}</p></button>
           <div class="car-info">{{$t('CartPosition')}}: <span>{{ carPosition.x }}, {{carPosition.y}}</span></div>
         </el-row>
       </el-col>
-      <el-col :span="1" style="color: #fff;">{{ autoBackEnable }}, {{autoBackFinish}}</el-col>
       <el-col :span="8">
         <el-row type="flex" justify="end">
           <button class="button_control" @click="$router.push('/index/home')"><p>{{$t('AbandonMapbuild')}}</p></button>
@@ -59,18 +58,19 @@
         <button v-if="autoBackFinish === '2'" class="button_control" style="margin-top: 25px;" @click="failHandle"><p>{{$t('Confirm')}}</p></button>
       </div>
     </div>
+    <driver-modal v-if="driverVisible" ref="driverModal" @driverConfirm="driverConfirm"/>
   </div>
 </template>
 
 <script>
+import DriverModal from './driver-modal.vue'
 import GlMap from './gl-map.vue'
-import { driver } from 'driver.js'
-import 'driver.js/dist/driver.css'
 import { startMapping, stopMapping, getMappingStatus, setStation, oneClickDeployment, abandonMapping, sendAutoBack } from '@/config/getData.js'
 import { mapGetters } from 'vuex'
 export default {
   name: 'ModuleBuilding',
   components: {
+    DriverModal,
     GlMap
   },
   beforeRouteLeave (to, from, next) {
@@ -120,9 +120,8 @@ export default {
         }
     }
     return {
+      driverVisible: false,
       cloudOff: false,
-      driver: null,
-      driverActive: true,
       needsConfirmation: true,
       mapName: '',
       dialogVisible: false,
@@ -184,17 +183,22 @@ export default {
   },
   mounted() {
     // 初始化并启动引导
+    this.driverVisible = true
     this.$nextTick(() => {
-      this.initGuide()
+      this.$refs.driverModal.init()
     })
     document.addEventListener('keydown', this.handleKeydown);
   },
   methods: {
+    driverConfirm () {
+      this._startMapping()
+    },
     /* eslint-disable */
     backHandleChange(active, val) {
       if (active && val === '0') {
         this.loading = this.$loading({
           lock: true,
+          text: this.$t('systemcalculatingnotmovevehicle'),
           spinner: 'el-icon-loading',
           background: 'rgba(0, 0, 0, 0.6)'
         })
@@ -224,65 +228,6 @@ export default {
         this.stationConfirm();
       }
     },
-    initGuide() {
-      const config = {
-        // allowClose: false,
-        overlayOpacity: 0.7,
-        popoverClass: 'driverjs-theme',
-        stagePadding: 0,
-        nextBtnText: this.$t('next'),
-        prevBtnText: this.$t('previous'),
-        doneBtnText: this.$t('close'),
-        onDestroyed: () => {
-          this.driverActive = false
-          this._startMapping()
-        },
-        onPopoverRender: (popover, {config, state}) => {
-          if (state.activeIndex === 0) {
-            const popoverElement = document.querySelector('.driver-popover')
-            if (popoverElement) {
-              setTimeout(()=>{
-                popoverElement.style.top = '25%'
-                popoverElement.style.bottom = 'auto'
-                popoverElement.style.left = 'calc(2% + 0.2rem)'
-                popoverElement.style.right = 'auto'
-              }, 20)
-            }
-          }
-        }
-      }
-      const steps = [
-        {
-          element: '#v-step-1',
-          popover: {
-            description: this.$t('driverTxt1'),
-            side: 'left',
-            align: 'center'
-          }
-        },
-        {
-          element: '#v-step-2',
-          popover: {
-            description: this.$t('driverTxt2'),
-            side: 'top',
-            align: 'start'
-          }
-        },
-        {
-          element: '#v-step-3',
-          popover: {
-            description: this.$t('driverTxt3'),
-            side: 'top',
-            align: 'end'
-          }
-        }
-      ];
-      this.driver = driver({
-        ...config,
-        steps
-      })
-      this.driver.drive()
-    },
     // 开始建图
     async _startMapping () {
       try {
@@ -316,7 +261,6 @@ export default {
     },
     // 打点
     addPoint () {
-      if (this.driverActive) return
       this.dialogVisible = true
       this.dataForm.stationCode = 'B' + (this.keyPoints.length + 1)
       const na = this.$i18n.locale === 'en-us' ? 'Work point ' : '工作点'
@@ -371,7 +315,6 @@ export default {
     },
     stopMappingConfirm () {
       if (this.autoLoopEnable !== '1') return
-      if (this.driverActive) return
       this.$confirm(this.$t('sureendbuilding'), this.$t('Prompt'), {
         confirmButtonText: this.$t('Confirm'),
         cancelButtonText: this.$t('Cancel'),

src/pages/modules/login/index.vue

@@ -59,8 +59,7 @@
 import JSEncrypt from 'jsencrypt'
 import {authlogin} from '@/config/getData'
 import { mapGetters, mapActions } from 'vuex'
-const publicKey = 'MFwwDQYJKoZIhvcNAQEBBQADSwAwSAJBANL378k3RiZHWx5AfJqdH9xRNBmD9wGD\n' +
-  '2iRe41HdTNF8RUhNnHit5NpMNtGL0NPTSSpPjjI1kJfVorRvaQerUgkCAwEAAQ=='
+const publicKey = 'MIGfMA0GCSqGSIb3DQEBAQUAA4GNADCBiQKBgQDI4R+Tpgu6LD33XpV8JF9bk1tb7o/JomSFOeOmOncu0yNkRdOK3Ftnp3gaq7xf/DYtW/gPm6gCXzItNUwwZncqfu78mc1D0V79Nh6SP2TPXZEIb9puFZ0zZ1jjNJmP+3ybQ3y14XwzZgTM+4ee6A1BVdBEkLaeYuCu4ZSFXns4owIDAQAB'
 export default {
   name: 'ModuleLogin',
   data () {
@@ -87,7 +86,7 @@ export default {
     this.baseUrl = this.serverUrl
   },
   methods: {
-    ...mapActions(['setServerUrl']),
+    ...mapActions(['setServerUrl', 'setToken']),
     saveSetup () {
       this.setServerUrl(this.baseUrl)
       this.tab = 0
@@ -109,12 +108,9 @@ export default {
     async _authlogin () {
       try {
         let res = await authlogin(this.username, this.encryptData(this.password))
-        if (res.code === '1') {
-          // let obj = {}
-          // obj = Object.assign({}, res.result)
-          // this.$store.dispatch('userInfo', JSON.stringify(obj))
-          // this.$store.dispatch('setLoginInfo', {username: this.username, password: this.password})
-          this.$router.push('/hub')
+        if (res.code === 200) {
+          this.setToken(res.data.token)
+          this.$router.push('/hub?user=' + res.data.user.userName)
         } else {
           this.Dialog(res.desc)
         }

src/pages/modules/map/index copy.vue

@@ -22,8 +22,6 @@
         <g 
           ref="pointImgGrop"
           id="pointImgGrop"
-          @mousedown="handlePointsDragStart"
-          @touchstart="handlePointsDragStart"
         >
           <g ref="pointGrop">
             <circle
@@ -35,14 +33,25 @@
               fill="green"
             />
           </g>
+          <image
+            v-if="isCarLocked"
+            :href="require('@/images/new/agv_out.png')"
+            alt="小车"
+            width="80"
+            height="80"
+            x="-40"
+            y="-40"
+            @mousedown="handlePointsDragStart"
+            @touchstart="handlePointsDragStart"
+          />
           <image
             ref="carImage"
             :href="require('@/images/new/agv.png')"
             alt="小车"
             width="30"
             height="30"
-            :x="-15"
-            :y="-15"
+            x="-15"
+            y="-15"
             @mousedown="startCarDrag"
             @touchstart="startCarDrag"
           />
@@ -68,7 +77,7 @@
       :getStationName="getStationNameById"
     />
     <div v-show="isCarLocked" class="re-popup">
-      <p>是否确定重定位？</p>
+      <p>{{ $t('yousurereposition') }}</p>
       <el-row style="margin-top: .2rem">
         <el-button type="danger" @click="cancelLocked"><p>{{$t('Cancel')}}</p></el-button>
         <el-button type="primary" @click="confirmLocked"><p>{{$t('Confirm')}}</p></el-button>
@@ -181,6 +190,7 @@ export default {
           this._queryMapAllStation()
         ])
         await Promise.all([
+        // this.preloadImage('map', `${mapData.mapImageAddress}`),
           this.preloadImage('map', `${this.serverUrl}${mapData.mapImageAddress}`),
           this.preloadImage('marker', markerImage)
         ])
@@ -386,13 +396,13 @@ export default {
           this.ctx.drawImage(this.cachedImages.marker, point.px_x - MARKER_SIZE / 2, point.px_y - MARKER_SIZE / 2, MARKER_SIZE, MARKER_SIZE)
         }
         // 绘制点位名称（文字大小随缩放变化）
-        if (point.station_type !== 'Station') {
+        if (point.station_type === 'Station') {
           this.ctx.font = '12px Arial'
           this.ctx.fillStyle = '#62fa0a'
           this.ctx.textAlign = 'center'
           this.ctx.fillText(point.station_name, point.px_x, point.px_y + 22)
-          this.ctx.fillText(point.x, point.px_x, point.px_y + 34)
-          this.ctx.fillText(point.y, point.px_x, point.px_y + 50)
+          // this.ctx.fillText(point.x, point.px_x, point.px_y + 34)
+          // this.ctx.fillText(point.y, point.px_x, point.px_y + 50)
         }
       })
     },

src/pages/modules/map/index.vue

@@ -350,20 +350,7 @@ export default {
     drawPath () {
       if (!this.pathData.length) return
       this.pathData.forEach((point, index) => {
-        const nextPoint = this.pathData[index + 1]
-        let controlX, controlY
-        if (nextPoint) {
-          // 有下一个点时，使用当前终点和下一个起点的中点作为控制点
-          controlX = (point.px_end_x + nextPoint.px_start_x) / 2
-          controlY = (point.px_end_y + nextPoint.px_start_y) / 2
-        } else {
-          // 最后一个点，使用当前终点作为控制点
-          controlX = point.px_end_x
-          controlY = point.px_end_y
-        }
-        this.ctx.beginPath()
-        this.ctx.moveTo(point.px_start_x, point.px_start_y)
-        this.ctx.quadraticCurveTo(controlX, controlY, point.px_end_x, point.px_end_y)
+        // const nextPoint = this.pathData[index + 1]
         if (this.selectedPath.route_id === point.route_id) {
           this.ctx.strokeStyle = '#ff5722' // 橙色高亮
           this.ctx.lineWidth = 4
@@ -371,9 +358,103 @@ export default {
           this.ctx.strokeStyle = '#009de5' // 默认蓝色
           this.ctx.lineWidth = 2
         }
+        this.ctx.beginPath()
+        // this.ctx.moveTo(point.px_start_x, point.px_start_y)
+        if (point.route_type === '0') {
+          this.drawArc(point, index)
+          // let controlX, controlY
+          // if (nextPoint) {
+          //   // 有下一个点时，使用当前终点和下一个起点的中点作为控制点
+          //   controlX = (point.px_end_x + nextPoint.px_start_x) / 2
+          //   controlY = (point.px_end_y + nextPoint.px_start_y) / 2
+          // } else {
+          //   // 最后一个点，使用当前终点作为控制点
+          //   controlX = point.px_end_x
+          //   controlY = point.px_end_y
+          // }
+          // this.ctx.quadraticCurveTo(controlX, controlY, point.px_end_x, point.px_end_y)
+        } else if (point.route_type === '1') {
+          this.drawStraightLine(point)
+          // this.ctx.lineTo(point.px_end_x, point.px_end_y)
+        }
         this.ctx.stroke()
       })
     },
+    drawStraightLine(point) {
+      this.ctx.moveTo(point.px_start_x, point.px_start_y)
+      this.ctx.lineTo(point.px_end_x, point.px_end_y)
+    },
+    drawArc(point, index) {
+      const prevPoint = this.pathData[index - 1]
+      const nextPoint = this.pathData[index + 1]
+      
+      // 计算进入方向（从上一个线段）
+      let entryDirection
+      if (prevPoint && prevPoint.route_type === "1") {
+        // 上一个点是直线，使用上一个线段的朝向
+        entryDirection = Math.atan2(
+          point.px_start_y - prevPoint.px_start_y,
+          point.px_start_x - prevPoint.px_start_x
+        )
+      } else {
+        // 没有上一个点或上一个点也是圆弧，使用默认方向
+        entryDirection = Math.atan2(
+          point.px_end_y - point.px_start_y,
+          point.px_end_x - point.px_start_x
+        )
+      }
+      
+      // 计算离开方向（到下一个线段）
+      let exitDirection
+      if (nextPoint && nextPoint.route_type === "1") {
+        // 下一个点是直线，使用下一个线段的朝向
+        exitDirection = Math.atan2(
+          nextPoint.px_end_y - point.px_end_y,
+          nextPoint.px_end_x - point.px_end_x
+        )
+      } else {
+        // 没有下一个点或下一个点也是圆弧，使用默认方向
+        exitDirection = Math.atan2(
+          point.px_end_y - point.px_start_y,
+          point.px_end_x - point.px_start_x
+        )
+      }
+      
+      // 计算圆弧控制点
+      const controlPoint = this.calculateArcControlPoint(
+        point.px_start_x, point.px_start_y,
+        point.px_end_x, point.px_end_y,
+        entryDirection, exitDirection
+      )
+      
+      this.ctx.moveTo(point.px_start_x, point.px_start_y)
+      this.ctx.quadraticCurveTo(controlPoint.x, controlPoint.y, point.px_end_x, point.px_end_y)
+    },
+    // 计算圆弧控制点
+    calculateArcControlPoint(startX, startY, endX, endY, entryDir, exitDir) {
+      const midX = (startX + endX) / 2
+      const midY = (startY + endY) / 2
+      
+      // 计算方向差异
+      let angleDiff = exitDir - entryDir
+      
+      // 规范化角度差异到 [-PI, PI] 范围
+      while (angleDiff > Math.PI) angleDiff -= 2 * Math.PI
+      while (angleDiff < -Math.PI) angleDiff += 2 * Math.PI
+      
+      // 计算弯曲方向和强度
+      const distance = Math.sqrt((endX - startX) ** 2 + (endY - startY) ** 2)
+      const bendStrength = Math.tan(angleDiff / 4) * distance * 0.5
+      
+      // 计算垂直于平均方向的控制点偏移
+      const avgDirection = (entryDir + exitDir) / 2
+      const perpendicularDir = avgDirection + Math.PI / 2
+      
+      const controlX = midX + bendStrength * Math.cos(perpendicularDir)
+      const controlY = midY + bendStrength * Math.sin(perpendicularDir)
+      
+      return { x: controlX, y: controlY }
+    },
     drawMarkers () {
       if (!this.pointData.length || !this.ctx) return
       if (!this.cachedImages.marker) {
@@ -385,20 +466,24 @@ export default {
         }
         return // 等待图标加载完成后再绘制
       }
-      this.pointData.forEach(point => {
+      this.pointData.forEach((point, index) => {
         // 绘制选中状态
+        this.ctx.beginPath()
+        this.ctx.arc(point.px_x, point.px_y, 5, 0, Math.PI * 2)
         if (point.station_id === this.selectedPointId) {
-          this.ctx.beginPath()
-          this.ctx.arc(point.px_x, point.px_y, 5, 0, Math.PI * 2)
-          this.ctx.fillStyle = '#59ccd2'
+          this.ctx.fillStyle = index === 0 ? '#d700c1' : '#009de5'
           this.ctx.fill()
         } else {
-          this.ctx.drawImage(this.cachedImages.marker, point.px_x - MARKER_SIZE / 2, point.px_y - MARKER_SIZE / 2, MARKER_SIZE, MARKER_SIZE)
+          this.ctx.strokeStyle = index === 0 ? 'rgba(215, 0, 193, 0.6)' : 'rgba(0, 157, 229, 0.6)'
+          this.ctx.lineWidth = 11
+          this.ctx.stroke()
+          this.ctx.fillStyle = 'rgba(255,255,255,0.6)'
         }
+        this.ctx.fill()
         // 绘制点位名称（文字大小随缩放变化）
         if (point.station_type === 'Station') {
           this.ctx.font = '12px Arial'
-          this.ctx.fillStyle = '#62fa0a'
+          this.ctx.fillStyle = index === 0 ? '#d700c1' : '#62fa0a'
           this.ctx.textAlign = 'center'
           this.ctx.fillText(point.station_name, point.px_x, point.px_y + 22)
           // this.ctx.fillText(point.x, point.px_x, point.px_y + 34)