新增录入实际点位生成节点

src/views/mapPage/realTimeMap/editMap.vue

@@ -200,7 +200,7 @@
               trigger="click"
               v-else-if="item.switchType === 'marker'"
               width="220"
-              :visible="state.popoverVisible"
+              :visible="state.markPopoverVisible"
             >
               <template #reference>
                 <div
@@ -344,7 +344,7 @@
           @click="toolbarClick(item)"
         >
           <el-popover
-            placement="bottom"
+            placement="left"
             :width="170"
             trigger="click"
             v-if="item.switchType === 'routeWidth'"
@@ -373,6 +373,46 @@
             </el-form>
           </el-popover>
 
+          <!-- 手动录入实际点位 -->
+          <el-popover
+            placement="left"
+            trigger="click"
+            v-else-if="item.switchType === 'entryActualNode'"
+            width="250"
+            :visible="state.entryNodePopoverVisible"
+          >
+            <template #reference>
+              <div @click="toolbarClick(item)">
+                <Icon :icon="item.icon" :size="20" />
+                <div class="name"> {{ item.name }} </div>
+              </div>
+            </template>
+            <!-- 位置 -->
+            <el-form :model="state.entryActualNodeForm" class="mt-2" label-width="78">
+              <el-form-item label="实际点位X">
+                <el-input v-model="state.entryActualNodeForm.x" placeholder="请输入" />
+              </el-form-item>
+              <el-form-item label="实际点位Y">
+                <el-input v-model="state.entryActualNodeForm.y" placeholder="请输入" />
+              </el-form-item>
+              <div style="text-align: right">
+                <el-button
+                  size="small"
+                  style="width: 4rem; height: 1.875rem; background: #efefef"
+                  @click="entryActualNodeFormCancel()"
+                  >取消</el-button
+                >
+                <el-button
+                  size="small"
+                  style="width: 4rem; height: 1.875rem; background: #00329f"
+                  color="#00329F"
+                  @click="entryActualNodeFormSubmit()"
+                  >确认</el-button
+                >
+              </div>
+            </el-form>
+          </el-popover>
+
           <div v-else>
             <Icon :icon="item.icon" :size="20" />
             <div class="name"> {{ item.name }} </div>
@@ -1486,6 +1526,12 @@ const state = reactive({
       name: '线上加点',
       icon: 'ep:add-location',
       isActive: false
+    },
+    {
+      switchType: 'entryActualNode',
+      name: '录入节点',
+      icon: 'ep:avatar',
+      isActive: false
     }
   ],
   isShowToolbar: false, //工具栏展示隐藏
@@ -1543,7 +1589,12 @@ const state = reactive({
     robotNo: '' //车辆编号
   }, //标记的表单
   mapMarkCarList: [], //标记的车辆列表
-  popoverVisible: false, //标记弹窗
+  markPopoverVisible: false, //标记弹窗
+  entryNodePopoverVisible: false, //录入点位弹窗
+  entryActualNodeForm: {
+    x: '',
+    y: ''
+  }, //录入点位的表单
   noLocationNumberList: [], //没有排序的库位index
   isShowSortNum: false, //是否显示序号
   actualLocation: {
@@ -1876,6 +1927,10 @@ const toolbarClick = async (item) => {
         item.isActive = false
       }
       break
+    case 'entryActualNode':
+      // 录入实际点位
+      state.entryNodePopoverVisible = true
+      break
   }
 }
 
@@ -1950,6 +2005,51 @@ const rotationFormSubmit = () => {
   addEditHistory()
 }
 
+//录入实际点位
+const entryActualNodeFormCancel = () => {
+  state.entryNodePopoverVisible = false
+  state.entryActualNodeForm.x = ''
+  state.entryActualNodeForm.y = ''
+}
+
+const entryActualNodeFormSubmit = () => {
+  if (!state.entryActualNodeForm.x || !state.entryActualNodeForm.y) {
+    message.warning('请输入实际点位X和Y')
+    return
+  } else {
+    let pointPx = convertActualToBrowser(state.entryActualNodeForm.x, state.entryActualNodeForm.y)
+    state.allMapPointInfo.push({
+      positionMapId: imgBgObj.positionMapId, //地图的id
+      layerSelectionShow: true,
+      locationX: pointPx.x,
+      locationY: pointPx.y,
+      actualLocationX: state.entryActualNodeForm.x,
+      actualLocationY: state.entryActualNodeForm.y,
+      locationDeep: 40,
+      locationWide: 40,
+      locationDeepPx: 8,
+      locationWidePx: 8,
+      angle: 0,
+      draggable: true,
+      resizable: true,
+      rotatable: false,
+      lockAspectRatio: false, //横纵比
+      mapImageUrl: '',
+      locationYaw: 0, //弧度
+      type: 1, //默认类型1 路径节点
+      dataList: [], //存库位的
+      dataObj: {} //存 设备点 停车点 文字
+    })
+    addEditHistory()
+    state.entryNodePopoverVisible = false
+    message.success('录入成功')
+    setTimeout(() => {
+      state.entryActualNodeForm.x = ''
+      state.entryActualNodeForm.y = ''
+    }, 200)
+  }
+}
+
 //标记
 const mapMark = async () => {
   state.mapMarkCarList = await MapApi.getListByMapId(imgBgObj.positionMapId)
@@ -1974,7 +2074,7 @@ const mapMark = async () => {
     state.markForm.markProperty = ''
     state.markForm.originalNode = ''
   }
-  state.popoverVisible = true
+  state.markPopoverVisible = true
 }
 //标记提交
 const macAddressChange = (e) => {
@@ -1985,7 +2085,7 @@ const macAddressChange = (e) => {
 }
 //取消标记
 const markFormCancel = () => {
-  state.popoverVisible = false
+  state.markPopoverVisible = false
   state.markForm.markProperty = ''
   state.markForm.originalNode = ''
   state.markForm.macAddress = ''
@@ -2064,7 +2164,7 @@ const markFormSubmit = async () => {
   } else {
     message.warning('未采集到该AGV点位信息')
   }
-  state.popoverVisible = false
+  state.markPopoverVisible = false
 }
 
 //鼠标拖动绘制节点