库位长度限制

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

@@ -7,7 +7,7 @@
     class="map-edit-route-dialog"
     @close="dialogClose"
   >
-    <el-form :model="form" label-width="120" ref="ruleFormRef">
+    <el-form :model="form" label-width="120" ref="ruleFormRef" :rules="rules">
       <el-row :gutter="30">
         <el-col :span="12">
           <el-form-item label="开始点位x轴" prop="startPointX" required>
@@ -15,7 +15,6 @@
               style="width: 100%"
               v-model="form.startPointX"
               :min="0"
-              :max="imgBgObj.width"
               placeholder="请输入开始点位x轴"
               controls-position="right"
             />
@@ -27,7 +26,6 @@
               style="width: 100%"
               v-model="form.startPointY"
               :min="0"
-              :max="imgBgObj.height"
               placeholder="请输入开始点位y轴"
               controls-position="right"
             />
@@ -41,7 +39,6 @@
               style="width: 100%"
               v-model="form.endPointX"
               :min="0"
-              :max="imgBgObj.width"
               placeholder="请输入结束点位x轴"
               controls-position="right"
             />
@@ -53,7 +50,6 @@
               style="width: 100%"
               v-model="form.endPointY"
               :min="0"
-              :max="imgBgObj.height"
               placeholder="请输入结束点位y轴"
               controls-position="right"
             />
@@ -210,8 +206,50 @@ const ruleFormRef = ref()
 const dialogFormVisible = ref(false) //列表的
 
 const rules = reactive({
-  skuInfo: [{ required: true, message: '请输入物料区域名称', trigger: 'blur' }],
-  areaName: [{ required: true, message: '请输入物料名称', trigger: 'blur' }]
+  startPointX: [
+    { required: true, message: '请输入开始点位x轴坐标', trigger: 'blur' },
+    {
+      type: 'number',
+      min: 0,
+      max: Number(props.imgBgObj.width),
+      message: `不能超过地图宽度${props.imgBgObj.width}`,
+      trigger: 'blur'
+    }
+  ],
+  startPointY: [
+    { required: true, message: '请输入开始点位y轴坐标', trigger: 'blur' },
+    {
+      type: 'number',
+      min: 0,
+      max: Number(props.imgBgObj.height),
+      message: `不能超过地图宽度${props.imgBgObj.height}`,
+      trigger: 'blur'
+    }
+  ],
+  endPointX: [
+    { required: true, message: '请输入结束点位x轴坐标', trigger: 'blur' },
+    {
+      type: 'number',
+      min: 0,
+      max: Number(props.imgBgObj.width),
+      message: `不能超过地图宽度${props.imgBgObj.width}`,
+      trigger: 'blur'
+    }
+  ],
+  endPointY: [
+    { required: true, message: '请输入结束点位y轴坐标', trigger: 'blur' },
+    {
+      type: 'number',
+      min: 0,
+      max: Number(props.imgBgObj.height),
+      message: `不能超过地图宽度${props.imgBgObj.height}`,
+      trigger: 'blur'
+    }
+  ],
+  expansionZoneFront: [{ required: true, message: '请输入膨胀区域前', trigger: 'blur' }],
+  expansionZoneAfter: [{ required: true, message: '请输入膨胀区域后', trigger: 'blur' }],
+  expansionZoneLeft: [{ required: true, message: '请输入膨胀区域左', trigger: 'blur' }],
+  expansionZoneRight: [{ required: true, message: '请输入膨胀区域右', trigger: 'blur' }]
 })
 
 //新增

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

@@ -12,7 +12,6 @@
           style="width: 100%"
           v-model="form.locationX"
           :min="0"
-          :max="imgBgObj.width"
           placeholder="请输入"
           controls-position="right"
         />
@@ -22,21 +21,10 @@
           style="width: 100%"
           v-model="form.locationY"
           :min="0"
-          :max="imgBgObj.height"
           placeholder="请输入"
           controls-position="right"
         />
       </el-form-item>
-      <el-form-item label="弧度" prop="locationYaw" required>
-        <el-input-number
-          style="width: 100%"
-          v-model="form.locationYaw"
-          :min="0"
-          placeholder="请输入"
-          controls-position="right"
-          :precision="2"
-        />
-      </el-form-item>
       <el-form-item label="类型" prop="type" required>
         <el-select v-model="form.type" placeholder="请选择类型" @change="typeChange">
           <el-option label="路径点位" :value="1" />
@@ -47,10 +35,21 @@
           <el-option label="等待点" :value="6" />
         </el-select>
       </el-form-item>
+      <el-form-item label="弧度" prop="locationYaw" required>
+        <el-input-number
+          class="!w-200px"
+          v-model="form.locationYaw"
+          :min="0"
+          :max="10000"
+          placeholder="请输入"
+          :precision="2"
+        />
+      </el-form-item>
 
       <div v-if="form.type === 2 || form.type === 3 || form.type === 4">
         <el-form-item label="层数" prop="layersNumber" required v-if="form.type === 2">
           <el-input-number
+            class="!w-200px"
             v-model="form.layersNumber"
             :min="1"
             :max="4"
@@ -61,7 +60,7 @@
           <el-text class="mx-1">（最大层数：4）</el-text>
         </el-form-item>
         <el-form-item label="排序" prop="locationNumber" v-if="form.type === 2" required>
-          <el-input-number v-model="form.locationNumber" :min="1" :max="10000000" />
+          <el-input-number class="!w-200px" v-model="form.locationNumber" :min="1" />
           <el-text class="mx-1">（最大值：10000000）</el-text>
         </el-form-item>
         <el-form-item label="编号" prop="deviceId" required v-if="form.type === 3">
@@ -100,10 +99,10 @@
         <el-form-item label="库位长度" prop="locationDeep" required>
           <div style="display: flex">
             <el-input-number
+              class="!w-200px"
               placeholder="请输入"
               v-model="form.locationDeep"
               :min="10"
-              :max="imgBgObj.height"
             />
             <span class="ml-2">cm</span>
           </div>
@@ -111,10 +110,10 @@
         <el-form-item label="库位宽度" prop="locationWide" required>
           <div style="display: flex">
             <el-input-number
+              class="!w-200px"
               placeholder="请输入"
               v-model="form.locationWide"
               :min="10"
-              :max="imgBgObj.width"
             />
             <span class="ml-2">cm</span>
           </div>
@@ -195,16 +194,73 @@ const form = ref({
   locationYaw: undefined //弧度
 })
 
+const mapWidthCm = ref(0)
+const mapHeightCm = ref(0)
+
+watch(
+  () => props.imgBgObj,
+  (val) => {
+    mapWidthCm.value = (Number(val.width) * Number(val.resolution) * 100).toFixed(2)
+    mapHeightCm.value = (Number(val.height) * Number(val.resolution) * 100).toFixed(2)
+  },
+  { immediate: true }
+)
+
 const rules = reactive({
-  locationX: [{ required: true, message: '请输入X', trigger: 'blur' }],
-  locationY: [{ required: true, message: '请输入Y', trigger: 'blur' }],
+  locationX: [
+    { required: true, message: '请输入X', trigger: 'blur' },
+    {
+      type: 'number',
+      min: 0,
+      max: Number(props.imgBgObj.width),
+      message: `不能超过地图宽度${props.imgBgObj.width}`,
+      trigger: 'blur'
+    }
+  ],
+  locationY: [
+    { required: true, message: '请输入Y', trigger: 'blur' },
+    {
+      type: 'number',
+      min: 0,
+      max: Number(props.imgBgObj.height),
+      message: `不能超过地图长度${props.imgBgObj.height}`,
+      trigger: 'blur'
+    }
+  ],
   locationYaw: [{ required: true, message: '请输入弧度', trigger: 'blur' }],
   type: [{ required: true, message: '请选择类型', trigger: 'blur' }],
   layersNumber: [{ required: true, message: '请输入层数', trigger: 'blur' }],
-  locationNumber: [{ required: true, message: '请输入排序', trigger: 'blur' }],
+  locationNumber: [
+    { required: true, message: '请输入排序', trigger: 'blur' },
+    {
+      type: 'number',
+      min: 0,
+      max: 10000000,
+      message: `不能超过10000000`,
+      trigger: 'blur'
+    }
+  ],
   deviceId: [{ required: true, message: '请选择设备编号', trigger: 'blur' }],
-  locationDeep: [{ required: true, message: '请选择库位长度', trigger: 'blur' }],
-  locationWide: [{ required: true, message: '请选择库位宽度', trigger: 'blur' }]
+  locationDeep: [
+    { required: true, message: '请选择库位长度', trigger: 'blur' },
+    {
+      type: 'number',
+      min: 0,
+      max: Number(mapWidthCm.value),
+      message: `不能超过${Number(mapWidthCm.value)}cm`,
+      trigger: 'blur'
+    }
+  ],
+  locationWide: [
+    { required: true, message: '请选择库位宽度', trigger: 'blur' },
+    {
+      type: 'number',
+      min: 0,
+      max: Number(mapHeightCm.value),
+      message: `不能超过${Number(mapHeightCm.value)}cm`,
+      trigger: 'blur'
+    }
+  ]
 })
 
 const emit = defineEmits(['submitNodeSuccess', 'addEventListener'])
@@ -280,7 +336,6 @@ const dialogClose = () => {
 
 const equipmentList = ref([]) //用过的设备列表
 const open = (item, list) => {
-  console.log(item)
   form.value = item
   form.value.layersNumber = item.dataList?.length || ''
   form.value.deviceId = item?.deviceId || item?.dataObj?.id || ''

src/views/mapPage/realTimeMap/editMap.vue

@@ -315,7 +315,7 @@
         >
           <VueDragResizeRotate
             v-for="(item, index) in state.allMapPointInfo"
-            :key="index"
+            :key="index + Number(item.locationX)"
             :parent="true"
             :x="Number(item.locationX) - Number(item.locationWidePx) / 2"
             :y="Number(item.locationY) - Number(item.locationDeepPx) / 2"
@@ -642,6 +642,7 @@
 
     <!-- 节点编辑 -->
     <editNodeProperties
+      v-if="imgBgObj.positionMapId"
       ref="editNodePropertiesRef"
       :positionMapId="imgBgObj.positionMapId"
       :imgBgObj="imgBgObj"
@@ -681,6 +682,7 @@
     />
     <!-- 编辑地图路线 -->
     <editMapRouteDialog
+      v-if="imgBgObj.positionMapId"
       ref="editMapRouteDialogRef"
       @editMapRouteDialogSubmit="editMapRouteDialogSubmit"
       @addEventListener="addEventListener"
@@ -1101,7 +1103,7 @@ const state = reactive({
       switchType: 'tools',
       name: '工具',
       icon: 'ep:briefcase',
-      isActive: true
+      isActive: false
     },
     {
       switchType: 'lineLibrary',
@@ -1149,7 +1151,7 @@ const state = reactive({
       switchType: 'grid',
       name: '网格',
       icon: 'ep:grid',
-      isActive: true
+      isActive: false
     },
     {
       switchType: 'larger',
@@ -1214,8 +1216,8 @@ const state = reactive({
       isActive: false
     }
   ],
-  isShowToolbar: true, //工具栏展示隐藏
-  isShowGrid: true, //网格展示隐藏
+  isShowToolbar: false, //工具栏展示隐藏
+  isShowGrid: false, //网格展示隐藏
   moveForm: {
     locationX: 0,
     locationY: 0
@@ -1412,6 +1414,9 @@ const toolbarClick = async (item) => {
         state.currentDragTarget.index = null
       }
       addEditHistory()
+      setTimeout(() => {
+        toolbarSwitchType.value = ''
+      }, 200)
       break
     case 'tools':
       //工具