标记

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

@@ -7,7 +7,7 @@
     class="equipment-form-dialog"
     @close="dialogClose"
   >
-    <el-form :model="form" label-width="110" ref="ruleFormRef">
+    <el-form :model="form" label-width="110" ref="ruleFormRef" :rules="rules">
       <el-form-item label="物料区域名称" prop="skuInfo" required>
         <el-input v-model="form.skuInfo" placeholder="请输入物料区域名称" />
       </el-form-item>

src/views/mapPage/realTimeMap/editMap.vue

@@ -161,6 +161,7 @@
             trigger="click"
             v-else-if="item.switchType === 'marker'"
             width="220"
+            :visible="state.popoverVisible"
           >
             <template #reference>
               <div
@@ -201,6 +202,12 @@
                 <el-input v-model="state.markForm.originalNode" style="width: 240px" disabled />
               </el-form-item>
               <div style="text-align: right">
+                <el-button
+                  size="small"
+                  style="width: 64px; height: 30px; background: #efefef"
+                  @click="markFormCancel()"
+                  >取消</el-button
+                >
                 <el-button
                   size="small"
                   style="width: 64px; height: 30px; background: #00329f"
@@ -1254,7 +1261,8 @@ const state = reactive({
     originalNode: '', //原节点
     robotNo: '' //AGV编号
   }, //标记的表单
-  mapMarkCarList: [] //标记的车辆列表
+  mapMarkCarList: [], //标记的车辆列表
+  popoverVisible: false //标记弹窗
 })
 
 const toolbarClick = async (item) => {
@@ -1600,6 +1608,7 @@ const mapMark = async () => {
     state.markForm.markProperty = ''
     state.markForm.originalNode = ''
   }
+  state.popoverVisible = true
 }
 //标记提交
 const macAddressChange = (e) => {
@@ -1608,6 +1617,15 @@ const macAddressChange = (e) => {
     state.markForm.robotNo = targetItem.robotNo
   }
 }
+//取消标记
+const markFormCancel = () => {
+  state.popoverVisible = false
+  state.markForm.markProperty = ''
+  state.markForm.originalNode = ''
+  state.markForm.macAddress = ''
+  state.markForm.robotNo = ''
+}
+//确认标记
 const markFormSubmit = async () => {
   if (!state.markForm.macAddress) {
     message.warning('请选择车辆')
@@ -1649,34 +1667,35 @@ const markFormSubmit = async () => {
 
       addEditHistory()
     } else {
-      message.warning('未采集到该AGV点位信息')
+      //新增一个节点
+      state.allMapPointInfo.push({
+        positionMapId: imgBgObj.positionMapId, //地图的id
+        layerSelectionShow: true,
+        locationX: pointPx.x,
+        locationY: pointPx.y,
+        actualLocationX: actualPoint.actualLocationX,
+        actualLocationY: actualPoint.actualLocationY,
+        locationDeep: 40,
+        locationWide: 40,
+        locationDeepPx: 8,
+        locationWidePx: 8,
+        angle: 0,
+        draggable: true,
+        resizable: true,
+        rotatable: false,
+        lockAspectRatio: false, //横纵比
+        mapImageUrl: '',
+        type: 1, //默认类型1 路径节点
+        dataList: [], //存库位的
+        dataObj: {}, //存 设备点 停车点 文字
+        locationYaw: 0 //弧度
+      })
+      addEditHistory()
     }
   } else {
-    //新增一个节点
+    message.warning('未采集到该AGV点位信息')
-    state.allMapPointInfo.push({
-      positionMapId: imgBgObj.positionMapId, //地图的id
-      layerSelectionShow: true,
-      locationX: pointPx.x,
-      locationY: pointPx.y,
-      actualLocationX: actualPoint.actualLocationX,
-      actualLocationY: actualPoint.actualLocationY,
-      locationDeep: 40,
-      locationWide: 40,
-      locationDeepPx: 8,
-      locationWidePx: 8,
-      angle: 0,
-      draggable: true,
-      resizable: true,
-      rotatable: false,
-      lockAspectRatio: false, //横纵比
-      mapImageUrl: '',
-      type: 1, //默认类型1 路径节点
-      dataList: [], //存库位的
-      dataObj: {}, //存 设备点 停车点 文字
-      locationYaw: 0 //弧度
-    })
-    addEditHistory()
   }
+  state.popoverVisible = false
 }
 
 //鼠标拖动绘制节点