Merge branch 'xhf' of http://git.znkjfw.com/ak/zn-admin-vue3-wcs into xhf

src/views/mapPage/realTimeMap/components-tool/editMapRouteDialog.vue

@@ -127,18 +127,16 @@
       <el-row :gutter="24">
         <el-col :span="12">
           <el-form-item label="正向限速" prop="forwardSpeedLimit" required>
-            <el-input
-              v-model="form.forwardSpeedLimit"
-              type="number"
-              placeholder="请输入正向限速"
-            /> </el-form-item
-        ></el-col>
+            <el-slider v-model="form.forwardSpeedLimit" :min="0" :max="10" :step="0.1" />
+          </el-form-item>
+        </el-col>
         <el-col :span="12">
           <el-form-item label="反向限速" prop="reverseSpeedLimit" required>
-            <el-input
+            <el-slider
               v-model="form.reverseSpeedLimit"
-              type="number"
-              placeholder="请输入反向限速"
+              :min="0"
+              :max="10"
+              :step="0.1"
             /> </el-form-item
         ></el-col>
       </el-row>

src/views/mapPage/realTimeMap/components-tool/map-scale-tool.vue

@@ -334,7 +334,7 @@ const dragCalc = (list, page, spacing, ruler, type) => {
   }
 }
 //水平标尺按下鼠标
-const horizontalDragRuler = () => {
+const horizontalDragRuler = (e) => {
   newLine('x')
 }
 //垂直标尺按下鼠标

src/views/mapPage/realTimeMap/editMap.vue

@@ -8,7 +8,7 @@
             :width="170"
             trigger="click"
             v-if="item.switchType === 'move' || item.switchType === 'revolve'"
-            :disabled="currentItemIndex === -1"
+            :disabled="state.currentItemIndex === -1"
           >
             <template #reference>
               <div
@@ -32,7 +32,7 @@
                 <el-input v-model="state.moveForm.locationX" placeholder="请输入" />
               </el-form-item>
               <el-form-item label="Y">
-                <el-input v-model="state.moveForm.y" placeholder="请输入" />
+                <el-input v-model="state.moveForm.locationY" placeholder="请输入" />
               </el-form-item>
               <div style="text-align: right">
                 <el-button
@@ -203,14 +203,6 @@
     </div>
 
     <div class="map-container" ref="mapContainer" :style="{ cursor: state.cursorStyle }">
-      <map-scale-tool
-        v-if="imgBgObj.height && imgBgObj.width"
-        @input="input"
-        :value="presetLine"
-        :step-length="50"
-        :height="imgBgObj.height"
-        :width="imgBgObj.width"
-      >
       <div
         class="map-bg"
         :style="{
@@ -236,7 +228,7 @@
           v-if="interfaceRefreshed"
         >
           <VueDragResizeRotate
-              v-for="(item, index) in allHistoryList[currentIndex]"
+            v-for="(item, index) in state.allMapPointInfo"
             :key="item.locationX"
             :parent="true"
             :x="Number(item.locationX) - Number(item.locationWide) / 2"
@@ -263,7 +255,7 @@
                 :style="{
                   width: item.locationWide + 'px',
                   height: item.locationDeep + 'px',
-                    backgroundColor: currentItemIndex === index ? '#f48924' : '#000',
+                  backgroundColor: state.currentItemIndex === index ? '#f48924' : '#000',
                   borderRadius: '50%',
                   zIndex: 999
                 }"
@@ -277,7 +269,7 @@
                 :style="{
                   width: item.locationWide + 'px',
                   height: item.locationDeep + 'px',
-                    border: currentItemIndex === index ? '1px dashed #000' : 'none'
+                  border: state.currentItemIndex === index ? '1px dashed #000' : 'none'
                 }"
               />
               <!-- 3 设备点 -->
@@ -291,7 +283,7 @@
                 :style="{
                   width: item.locationWide + 'px',
                   height: item.locationDeep + 'px',
-                    border: currentItemIndex === index ? '1px dashed #000' : 'none'
+                  border: state.currentItemIndex === index ? '1px dashed #000' : 'none'
                 }"
               />
               <!-- 4 停车点 -->
@@ -302,7 +294,7 @@
                 :style="{
                   width: item.locationWide + 'px',
                   height: item.locationDeep + 'px',
-                    border: currentItemIndex === index ? '1px dashed #000' : 'none'
+                  border: state.currentItemIndex === index ? '1px dashed #000' : 'none'
                 }"
               />
               <!-- 5 区域变更点 -->
@@ -313,7 +305,7 @@
                 :style="{
                   width: item.locationWidee + 'px',
                   height: item.locationDeep + 'px',
-                    border: currentItemIndex === index ? '1px dashed #000' : 'none'
+                  border: state.currentItemIndex === index ? '1px dashed #000' : 'none'
                 }"
               />
               <!-- 6 等待点 -->
@@ -324,7 +316,7 @@
                 :style="{
                   width: item.locationWide + 'px',
                   height: item.locationDeep + 'px',
-                    border: currentItemIndex === index ? '1px dashed #000' : 'none'
+                  border: state.currentItemIndex === index ? '1px dashed #000' : 'none'
                 }"
               />
               <div
@@ -333,7 +325,7 @@
                   color: item.fontColor,
                   fontSize: item.fontSize + 'px',
                   fontFamily: item.fontFamily,
-                    border: currentItemIndex === index ? '1px dashed #000' : 'none'
+                  border: state.currentItemIndex === index ? '1px dashed #000' : 'none'
                 }"
               >
                 {{ item.text }}
@@ -348,7 +340,6 @@
               style="position: absolute; top: 0; left: 0; z-index: 9"
               id="svgId"
             >
-                <template v-for="(curve, index) in state.mapRouteList" :key="index">
               <!-- 实时绘制当前直线 -->
               <line
                 v-if="state.isDrawing && toolbarSwitchType === 'clickDrawRoute'"
@@ -359,7 +350,8 @@
                 stroke="#00329F"
                 stroke-width="5"
               />
-
+              <template v-if="state.mapRouteList.length > 0">
+                <template v-for="(curve, index) in state.mapRouteList" :key="index">
                   <!-- 直线 -->
                   <line
                     v-if="curve.method === 0"
@@ -384,6 +376,7 @@
                     />
                     <!-- 第一条控制线 -->
                     <line
+                      v-if="state.currentDragTarget.index == index"
                       :x1="Number(curve.startPointX)"
                       :y1="Number(curve.startPointY)"
                       :x2="curve.beginControlX"
@@ -394,6 +387,7 @@
                     />
                     <!-- 第二条控制线 -->
                     <line
+                      v-if="state.currentDragTarget.index == index"
                       :x1="Number(curve.endPointX)"
                       :y1="Number(curve.endPointY)"
                       :x2="curve.endControlX"
@@ -403,6 +397,7 @@
                       stroke-width="2"
                     />
                     <circle
+                      v-if="state.currentDragTarget.index == index"
                       id="startCircle"
                       :cx="curve.beginControlX"
                       :cy="curve.beginControlY"
@@ -411,6 +406,7 @@
                       @mousedown="startDrag(curve, index, 'start')"
                     />
                     <circle
+                      v-if="state.currentDragTarget.index == index"
                       id="endCircle"
                       :cx="curve.endControlX"
                       :cy="curve.endControlY"
@@ -420,6 +416,7 @@
                     />
                   </template>
                 </template>
+              </template>
             </svg>
           </div>
         </div>
@@ -505,7 +502,6 @@
           class="input-box-class"
         />
       </div>
-      </map-scale-tool>
     </div>
 
     <!-- 节点编辑 -->
@@ -587,16 +583,6 @@ const inputBoxRef = ref() //文字输入框
 
 const message = useMessage() // 消息弹窗
 
-const allHistoryList = ref([]) //全部的历史记录
-const currentIndex = ref(0) //用于记录是哪条历史记录的
-const currentItemIndex = ref(-1) //用于记录是在编辑那个具体的节点、图标等
-const allMapPointInfo = ref([]) //所有的图标的列表
-
-const presetLine = ref([])
-const input = (list) => {
-  presetLine.value = list
-}
-
 // 缩放停止
 const interfaceRefreshed = ref(true)
 const resizeEnd = (locationX, locationY, w, h, item, index) => {
@@ -605,10 +591,10 @@ const resizeEnd = (locationX, locationY, w, h, item, index) => {
     let x = Number(locationX) + Number(item.locationWide) / 2
     let y = Number(locationY) + Number(item.locationDeep) / 2
 
-    allMapPointInfo.value[index].locationX = x
-    allMapPointInfo.value[index].locationY = y
-    allMapPointInfo.value[index].locationWide = w
-    allMapPointInfo.value[index].locationDeep = h
+    state.allMapPointInfo[index].locationX = x
+    state.allMapPointInfo[index].locationY = y
+    state.allMapPointInfo[index].locationWide = w
+    state.allMapPointInfo[index].locationDeep = h
     addEditHistory()
 
     state.mapRouteList.forEach((route) => {
@@ -631,6 +617,7 @@ const resizeEnd = (locationX, locationY, w, h, item, index) => {
     })
   })
 }
+
 // 拖拽停止
 const dragEnd = (locationX, locationY, item, index) => {
   let x = Number(locationX) + Number(item.locationWide) / 2
@@ -638,10 +625,10 @@ const dragEnd = (locationX, locationY, item, index) => {
 
   if (x === item.locationX && y === item.locationY) return
   let actualPoint = disposeEventPoint(x, y)
-  allMapPointInfo.value[index].locationX = x
-  allMapPointInfo.value[index].locationY = y
-  allMapPointInfo.value[index].actualStartPointX = actualPoint.actualLocationX
-  allMapPointInfo.value[index].actualStartPointY = actualPoint.actualLocationY
+  state.allMapPointInfo[index].locationX = x
+  state.allMapPointInfo[index].locationY = y
+  state.allMapPointInfo[index].actualStartPointX = actualPoint.actualLocationX
+  state.allMapPointInfo[index].actualStartPointY = actualPoint.actualLocationY
   addEditHistory()
   //更改路线里的
   state.mapRouteList.forEach((route) => {
@@ -665,26 +652,26 @@ const dragEnd = (locationX, locationY, item, index) => {
 }
 // 旋转
 const rotateEnd = (angle, item, index) => {
-  allMapPointInfo.value[index].angle = angle
+  state.allMapPointInfo[index].angle = angle
   addEditHistory()
 }
 
 //节点选中
 const editNodePropertiesRef = ref()
 const activatedHandle = (item, index) => {
-  currentItemIndex.value = index
+  state.currentItemIndex = index
 
   //让路线不选中
   state.selectedCurve = ''
 
-  if (state.currentDragTarget.index !== null) {
+  if (state.mapRouteList.length > 0 && state.currentDragTarget.index !== null) {
     state.mapRouteList[state.currentDragTarget.index].isSelected = false
     state.currentDragTarget = { index: null, type: null }
   }
 
   //节点编辑
   if (toolbarSwitchType.value === 'editNode') {
-    let list = allHistoryList.value[currentIndex.value].filter((item) => item.type === 3)
+    let list = state.allMapPointInfo.filter((item) => item.type === 3)
     editNodePropertiesRef.value.open(JSON.parse(JSON.stringify(item)), list)
   }
 }
@@ -694,31 +681,42 @@ const deactivatedHandle = () => {}
 //添加历史记录
 const addEditHistory = () => {
   //要判断是不是在最新的记录上修改 如果不是 要把currentIndex之后的记录都删掉 保持当前修改是最新的
-  if (currentIndex.value !== allHistoryList.value.length - 1) {
-    allHistoryList.value = allHistoryList.value.splice(0, currentIndex.value)
-    currentIndex.value = allHistoryList.value.length
-    allHistoryList.value.push(JSON.parse(JSON.stringify(allMapPointInfo.value)))
+  if (state.currentIndex !== state.allHistoryList.length - 1) {
+    state.allHistoryList = state.allHistoryList.splice(0, state.currentIndex)
+    state.currentIndex = state.allHistoryList.length
+    state.allHistoryList.push({
+      allMapPointInfo: JSON.parse(JSON.stringify(state.allMapPointInfo)),
+      mapRouteList: JSON.parse(JSON.stringify(state.mapRouteList))
+    })
   } else {
-    allHistoryList.value.push(JSON.parse(JSON.stringify(allMapPointInfo.value)))
-    currentIndex.value++
+    state.allHistoryList.push({
+      allMapPointInfo: JSON.parse(JSON.stringify(state.allMapPointInfo)),
+      mapRouteList: JSON.parse(JSON.stringify(state.mapRouteList))
+    })
+    state.currentIndex++
   }
   interfaceRefreshed.value = true
 }
 
 //上一步
 const backPreviousStep = () => {
-  if (currentIndex.value > 0) {
-    currentIndex.value--
-    allMapPointInfo.value = allHistoryList.value[currentIndex.value]
+  console.log(state.currentIndex)
+  console.log(state.allMapPointInfo)
+  console.log(state.allHistoryList)
+  if (state.currentIndex > 0) {
+    state.currentIndex--
+    state.allMapPointInfo = state.allHistoryList[state.currentIndex]?.allMapPointInfo || []
+    state.mapRouteList = state.allHistoryList[state.currentIndex]?.mapRouteList || []
   } else {
     message.warning('没了老铁')
   }
 }
 //下一步
 const backNextStep = () => {
-  if (currentIndex.value < allHistoryList.value.length - 1) {
-    currentIndex.value++
-    allMapPointInfo.value = allHistoryList.value[currentIndex.value]
+  if (state.currentIndex < state.allHistoryList.length - 1) {
+    state.currentIndex++
+    state.allMapPointInfo = state.allHistoryList[state.currentIndex]?.allMapPointInfo || []
+    state.mapRouteList = state.allHistoryList[state.currentIndex]?.mapRouteList || []
   } else {
     message.warning('没了老铁')
   }
@@ -733,7 +731,7 @@ const mapClick = (e) => {
 
   //绘制节点
   if (toolbarSwitchType.value === 'drawNodes') {
-    allMapPointInfo.value.push({
+    state.allMapPointInfo.push({
       positionMapId: imgBgObj.positionMapId, //地图的id
       layerSelectionShow: true,
       locationX: x,
@@ -782,7 +780,7 @@ const textFormSuccess = (form) => {
 const handleInputEnd = () => {
   if (state.inputBoxValue) {
     state.showInputBox = false
-    allMapPointInfo.value.push({
+    state.allMapPointInfo.push({
       type: 7, //类型  7文字
       positionMapId: imgBgObj.positionMapId, //地图的id
       locationX: state.inputBoxStyle.locationX, //x
@@ -810,9 +808,7 @@ const handleInputEnd = () => {
 }
 //编辑节点成功
 const submitNodeSuccess = (form) => {
-  allMapPointInfo.value[currentItemIndex.value] = form
-  allHistoryList.value[currentIndex.value][currentItemIndex.value] = form
-
+  state.allMapPointInfo[state.currentItemIndex] = form
   //节点位置改变 通知路径里面的节点也改变
   state.mapRouteList.forEach((item) => {
     if (form.id === item.startingPointId) {
@@ -832,6 +828,7 @@ const submitNodeSuccess = (form) => {
       item.actualEndPointY = disposeEventPoint(form.locationX, form.locationY).actualLocationY
     }
   })
+  addEditHistory()
 }
 
 //工具栏点击
@@ -1036,21 +1033,26 @@ const state = reactive({
   measureDistancesNum: 0, // 存储两点之间的距离
   imageChangeMultiple: 1, //图片放大缩小的倍数
   prohibitedOperation: false, //禁止操作 在框选测距等操作时，禁止所有拖动等操作
-  mapRouteList: [], //仓库点位地图连线
   currentDragTarget: {
     index: null,
     type: null
   }, //当前拖拽的目标（起点、终点、控制点）
   selectedCurve: '', // 当前选中的曲线
   startDrawPointIndex: -1, // 起始点的索引
-  startDrawPoint: null,
-  isDrawing: false,
-  currentDrawX: 0,
-  currentDrawY: 0
+  startDrawPoint: null, //绘制路线开始的点
+  isDrawing: false, //正在绘制
+  currentDrawX: 0, //正在绘制的x轴坐标
+  currentDrawY: 0, //正在绘制的y轴坐标
+  allHistoryList: [], //所有的历史记录 [{allMapPointInfo:[],mapRouteList:[]}]
+  allMapPointInfo: [], //当前页面上的所有节点的列表
+  mapRouteList: [], //当前页面上所有路线的列表
+  currentIndex: 0, //当前处在哪条历史记录
+  currentItemIndex: -1 //当前处在哪个工具
 })
+
 const toolbarClick = (item) => {
   let type = item.switchType
-  if (currentItemIndex.value === -1 && (type === 'move' || type === 'revolve' || type === 'copy')) {
+  if (state.currentItemIndex === -1 && (type === 'move' || type === 'revolve' || type === 'copy')) {
     message.warning('请先选择要操作的对象')
     return
   }
@@ -1058,7 +1060,7 @@ const toolbarClick = (item) => {
   if (
     type === 'delete' &&
     state.currentDragTarget.index === null &&
-    currentItemIndex.value === -1
+    state.currentItemIndex === -1
   ) {
     message.warning('请先选择要操作的对象')
     return
@@ -1125,7 +1127,7 @@ const toolbarClick = (item) => {
       break
     case 'saveAs':
       //另存为 存为json文件 无法直接访问用户的文件系统 不能选择存在那个文件夹里面
-      const jsonString = JSON.stringify(allHistoryList.value[currentIndex.value], null, 2)
+      const jsonString = JSON.stringify(state.allHistoryList[state.currentIndex], null, 2)
       const blob = new Blob([jsonString], { type: 'application/json' })
       const url = URL.createObjectURL(blob)
 
@@ -1149,7 +1151,7 @@ const toolbarClick = (item) => {
       break
     case 'copy':
       //复制
-      let copyMapItem = allHistoryList.value[currentIndex.value][currentItemIndex.value]
+      let copyMapItem = state.allMapPointInfo[state.currentItemIndex]
       state.copyMapItem = {
         positionMapId: copyMapItem.positionMapId,
         locationX: copyMapItem.locationX,
@@ -1172,18 +1174,20 @@ const toolbarClick = (item) => {
       let copyObj = JSON.parse(JSON.stringify(state.copyMapItem))
       copyObj.locationX = Number(copyObj.locationX) + 50
       copyObj.locationY = Number(copyObj.locationY) + 50
-      allMapPointInfo.value.push(copyObj)
+      state.allMapPointInfo.push(copyObj)
       addEditHistory()
       break
     case 'delete':
       //删除
-      if (currentItemIndex.value !== -1) {
-        allMapPointInfo.value.splice(currentItemIndex.value, 1)
-        addEditHistory()
+      if (state.currentItemIndex !== -1) {
+        state.allMapPointInfo.splice(state.currentItemIndex, 1)
+        state.currentItemIndex = -1
       }
       if (state.currentDragTarget.index !== null) {
         state.mapRouteList.splice(state.currentDragTarget.index, 1)
+        state.currentDragTarget.index = null
       }
+      addEditHistory()
       break
     case 'tools':
       //工具
@@ -1256,7 +1260,7 @@ const toolbarClick = (item) => {
     case 'larger':
       //放大
       if (state.imageChangeMultiple < 3) {
-        state.imageChangeMultiple *= 1.2
+        state.imageChangeMultiple += 0.1
       } else {
         message.warning('不能在放大了')
       }
@@ -1264,7 +1268,7 @@ const toolbarClick = (item) => {
     case 'smaller':
       //缩小
       if (state.imageChangeMultiple > 0.3) {
-        state.imageChangeMultiple *= 0.8
+        state.imageChangeMultiple -= 0.1
       } else {
         message.warning('不能在缩小了')
       }
@@ -1291,7 +1295,7 @@ const toolbarClick = (item) => {
       break
     case 'equipment':
       // 设备
-      let equipmentList = allHistoryList.value[currentIndex.value].filter((item) => {
+      let equipmentList = state.allMapPointInfo.filter((item) => {
         return item.type === 3
       })
       equipmentToolDialogRef.value.open(equipmentList)
@@ -1301,25 +1305,35 @@ const toolbarClick = (item) => {
 
 //移动工具表单提交
 const moveFormSubmit = () => {
-  allHistoryList.value[currentIndex.value][currentItemIndex.value].locationX =
-    state.moveForm.locationX
-  allHistoryList.value[currentIndex.value][currentItemIndex.value].locationY =
-    state.moveForm.locationY
+  state.allMapPointInfo[state.currentItemIndex].locationX = Number(state.moveForm.locationX)
+  state.allMapPointInfo[state.currentItemIndex].locationY = Number(state.moveForm.locationY)
+  addEditHistory()
 }
 //旋转工具表单提交
 const rotationFormSubmit = () => {
-  allHistoryList.value[currentIndex.value][currentItemIndex.value].angle = state.rotationForm.angle
+  state.allMapPointInfo[state.currentItemIndex].angle = state.rotationForm.angle
+  addEditHistory()
 }
 
 //鼠标拖动绘制节点
 // 从点开始绘制
 const startFromPoint = (index, event) => {
-  let list = allHistoryList.value[currentIndex.value]
+  let list = state.allMapPointInfo
   const point = list[index]
+  if (point.id) {
     state.startDrawPoint = point //开始点
     state.startDrawPointIndex = index
     state.isDrawing = true
     event.preventDefault() // 防止默认行为
+  } else {
+    message.warning('选择的节点未保存')
+    // 重置状态
+    state.startDrawPointIndex = -1 // 起始点的索引
+    state.startDrawPoint = null
+    state.isDrawing = false
+    state.currentDrawX = 0
+    state.currentDrawY = 0
+  }
 }
 //开始框选绘制
 const startDrawSelection = (event) => {
@@ -1396,8 +1410,19 @@ const endDrawSelection = (event) => {
       // 找到最近的终点
       const endPointIndex = findClosestPoint(state.currentDrawX, state.currentDrawY)
 
+      if (!endPointIndex.id) {
+        message.warning('选择的节点未保存')
+        // 重置状态
+        state.startDrawPointIndex = -1 // 起始点的索引
+        state.startDrawPoint = null
+        state.isDrawing = false
+        state.currentDrawX = 0
+        state.currentDrawY = 0
+        return
+      }
+
       if (endPointIndex !== null && endPointIndex !== state.startDrawPointIndex) {
-        let list = allHistoryList.value[currentIndex.value]
+        let list = state.allMapPointInfo
         const endPoint = list[endPointIndex]
         const newLine = {
           startPointX: state.startDrawPoint.locationX,
@@ -1455,6 +1480,7 @@ const endDrawSelection = (event) => {
             endWidth: endPoint.locationWide, //	终点宽
             endHigh: endPoint.locationDeep //	终点高
           })
+          addEditHistory()
         }
       }
       // 重置状态
@@ -1473,7 +1499,7 @@ const endDrawSelection = (event) => {
 const findClosestPoint = (x, y) => {
   let minDistance = Infinity
   let closestIndex = null
-  let list = allHistoryList.value[currentIndex.value]
+  let list = state.allMapPointInfo
   list.forEach((point, index) => {
     const distance = Math.sqrt((point.locationX - x) ** 2 + (point.locationY - y) ** 2)
     if (distance < minDistance && distance < point.locationWide) {
@@ -1484,10 +1510,9 @@ const findClosestPoint = (x, y) => {
   })
   return closestIndex
 }
-
 //点击区域
 const clickDrawSelectionArea = () => {
-  let points = allHistoryList.value[currentIndex.value]
+  let points = state.allMapPointInfo
 
   state.drawSelectionPointList = []
   state.allDrawSelectionAreaBox.forEach((box) => {
@@ -1511,8 +1536,6 @@ const clickDrawSelectionArea = () => {
   // let routeList = state.drawSelectionPointList.filter((item) => item.type === 1)
   let routeList = state.drawSelectionPointList
 
-  console.log(routeList)
-
   let isHaveId = binLocation.every((item) => {
     item.id
   })
@@ -1600,6 +1623,7 @@ const clickDrawSelectionArea = () => {
     }
     state.selectedCurve = curve
     state.mapRouteList.push(curve)
+    addEditHistory()
   }
 }
 //计算是不是在同一条直线的
@@ -1680,6 +1704,8 @@ const endDrag = (event) => {
   curve.actualEndControlX = actualEndControl.actualLocationX
   curve.actualEndControlY = actualEndControl.actualLocationY
 
+  addEditHistory()
+
   state.currentDragTarget = { index: null, type: null }
   window.removeEventListener('mousemove', handleDrag)
   window.removeEventListener('mouseup', endDrag)
@@ -1710,7 +1736,7 @@ const handleChooseRoute = (item, index) => {
   state.selectedCurve = item
   state.currentDragTarget.index = index
   //让节点不选中
-  currentItemIndex.value = -1
+  state.currentItemIndex = -1
 }
 //编辑路线成功
 const editMapRouteDialogSubmit = (form) => {
@@ -1735,7 +1761,7 @@ const editMapRouteDialogSubmit = (form) => {
       item.actualEndPointY = disposeEventPoint(form.endPointX, form.endPointY).actualLocationY
     }
   })
-  allMapPointInfo.value.forEach((item) => {
+  state.allMapPointInfo.forEach((item) => {
     if (item.id === form.startingPointId) {
       item.locationX = form.startPointX
       item.locationY = form.startPointY
@@ -1749,7 +1775,8 @@ const editMapRouteDialogSubmit = (form) => {
       item.actualLocationY = disposeEventPoint(form.endPointX, form.endPointY).actualLocationX
     }
   })
-  allHistoryList.value[currentIndex.value] = JSON.parse(JSON.stringify(allMapPointInfo.value))
+  //增加一条历史记录
+  addEditHistory()
 }
 
 //测距相关
@@ -1855,9 +1882,9 @@ const getAllNodeList = async () => {
   let list = await MapApi.getPositionMapItemList({
     positionMapId: imgBgObj.positionMapId
   })
-  allMapPointInfo.value = []
-  allHistoryList.value = []
-  currentIndex.value = 0
+  state.allMapPointInfo = []
+  state.allHistoryList = []
+  state.currentIndex = 0
   list.forEach((item) => {
     item.layerSelectionShow = true //用于图层
     item.locationX = Number(item.locationX)
@@ -1922,13 +1949,16 @@ const getAllNodeList = async () => {
       item.rotatable = true
       item.lockAspectRatio = true
     }
-    allMapPointInfo.value.push(item)
+    state.allMapPointInfo.push(item)
   })
-  allHistoryList.value[0] = JSON.parse(JSON.stringify(allMapPointInfo.value))
 }
 //获取所有的路线
 const getAllMapRoute = async () => {
   state.mapRouteList = await MapApi.getPositionMapLineByPositionMapId(imgBgObj.positionMapId)
+  state.allHistoryList[0] = {
+    allMapPointInfo: JSON.parse(JSON.stringify(state.allMapPointInfo)),
+    mapRouteList: JSON.parse(JSON.stringify(state.mapRouteList))
+  }
 }
 //保存地图按钮
 const saveMap = async () => {
@@ -1954,7 +1984,7 @@ const saveMap = async () => {
 }
 //节点的保存
 const saveNodeList = async () => {
-  let list = allHistoryList.value[currentIndex.value]
+  let list = state.allMapPointInfo
   list.forEach((item) => {
     if (item.type === 7) {
       item.dataObj.positionMapId = imgBgObj.positionMapId
@@ -1976,7 +2006,7 @@ const saveMapRoute = async () => {
 }
 //筛选图层
 const layerSelectionSuccess = (typeList) => {
-  allHistoryList.value[currentIndex.value].forEach((item) => {
+  state.allMapPointInfo.forEach((item) => {
     // 如果 type 存在于第一个数组中，则将 layerSelectionShow 设置为 false
     if (typeList.includes(item.type)) {
       item.layerSelectionShow = false
@@ -2013,7 +2043,6 @@ const disposeEventPoint = (x, y) => {
   const actualLocationX = Number(imgBgObj.origin[0]) + Number(x) * Number(imgBgObj.resolution)
   const actualLocationY =
     Number(imgBgObj.origin[1]) + (Number(imgBgObj.height) - Number(y)) * Number(imgBgObj.resolution)
-
   return {
     actualLocationX,
     actualLocationY
@@ -2027,7 +2056,7 @@ document.onmousedown = function (e) {
       state.mapRouteList[state.currentDragTarget.index].isSelected = false
       state.currentDragTarget = { index: null, type: null }
     }
-    currentItemIndex.value = -1
+    state.currentItemIndex = -1
   }
 }
 // 阻止默认菜单弹出
@@ -2035,8 +2064,57 @@ window.document.oncontextmenu = function () {
   return false
 }
 
+//监听键盘事件
+const handleKeyDown = (event) => {
+  if (event.ctrlKey) {
+    if (event.key === 'c') {
+      if (state.currentItemIndex === -1) {
+        message.warning('请先选择要操作的对象')
+        return
+      }
+      let copyMapItem = state.allMapPointInfo[state.currentItemIndex]
+      state.copyMapItem = {
+        positionMapId: copyMapItem.positionMapId,
+        locationX: copyMapItem.locationX,
+        locationY: copyMapItem.locationY,
+        type: copyMapItem.type,
+        dataJson: copyMapItem.dataJson || '',
+        dataObj: copyMapItem.dataObj || {},
+        dataList: copyMapItem.dataList || [],
+        locationDeep: copyMapItem.locationDeep,
+        locationWide: copyMapItem.locationWide,
+        draggable: copyMapItem.draggable,
+        resizable: copyMapItem.resizable,
+        rotatable: copyMapItem.rotatable,
+        lockAspectRatio: copyMapItem.lockAspectRatio
+      }
+      message.success('复制成功')
+    } else if (event.key === 'v') {
+      //粘贴
+      if (!state.copyMapItem) {
+        message.warning('请先复制对象')
+        return
+      }
+      //粘贴
+      let copyObj = JSON.parse(JSON.stringify(state.copyMapItem))
+      copyObj.locationX = Number(copyObj.locationX) + 50
+      copyObj.locationY = Number(copyObj.locationY) + 50
+      state.allMapPointInfo.push(copyObj)
+      addEditHistory()
+    } else if (event.key === 'z') {
+      //撤回
+      backPreviousStep()
+    }
+  }
+}
+
 onMounted(() => {
   getMapList()
+  window.addEventListener('keydown', handleKeyDown)
+})
+
+onUnmounted(() => {
+  window.removeEventListener('keydown', handleKeyDown)
 })
 </script>