diff --git a/.env.dev b/.env.dev index cd36402f..fb9b85ed 100644 --- a/.env.dev +++ b/.env.dev @@ -6,7 +6,7 @@ VITE_DEV=true # 请求路径 # VITE_BASE_URL='http://192.168.0.66:48080' # VITE_BASE_URL='http://192.168.0.189:48080' -VITE_BASE_URL='http://127.0.0.1:48080' +VITE_BASE_URL='http://192.168.0.45:48080' # 文件上传类型：server - 后端上传， client - 前端直连上传，仅支持S3服务 VITE_UPLOAD_TYPE=server diff --git a/.env.local b/.env.local index a3752946..731be2fa 100644 --- a/.env.local +++ b/.env.local @@ -4,8 +4,9 @@ NODE_ENV=development VITE_DEV=true # 请求路径 -VITE_BASE_URL='http://192.168.0.74:48080' +# VITE_BASE_URL='http://192.168.0.74:48080' # VITE_BASE_URL='http://192.168.0.189:48080' +VITE_BASE_URL='http://192.168.0.45:48080' # 文件上传类型：server - 后端上传， client - 前端直连上传，仅支持 S3 服务 VITE_UPLOAD_TYPE=server diff --git a/src/views/mapPage/example/转换成实际坐标demo.vue b/src/views/mapPage/example/转换成实际坐标demo.vue deleted file mode 100644 index cc418af3..00000000 --- a/src/views/mapPage/example/转换成实际坐标demo.vue +++ /dev/null @@ -1,151 +0,0 @@ - - - - - diff --git a/src/views/mapPage/realTimeMap/components-tool/equipmentToolDialog.vue b/src/views/mapPage/realTimeMap/components-tool/equipmentToolDialog.vue index 10e4c45b..2d70e096 100644 --- a/src/views/mapPage/realTimeMap/components-tool/equipmentToolDialog.vue +++ b/src/views/mapPage/realTimeMap/components-tool/equipmentToolDialog.vue @@ -23,8 +23,8 @@ - - + + - + { } //类型改变 const deviceTypeChange = async () => { + deviceInfo.value.deviceInfoId = '' getAllDeviceList() } const getAllDeviceList = async () => { @@ -136,12 +137,20 @@ const getAllDeviceList = async () => { }) } //新增表单新增 +const ruleFormRef = ref() +const rules = reactive({ + deviceType: [{ required: true, message: '请选择设备类型', trigger: 'change' }], + deviceInfoId: [{ required: true, message: '请选择设备类型', trigger: 'change' }] +}) const submitAddForm = async () => { - deviceInfo.value.positionMapId = props.positionMapId - await MapApi.mapBindDeviceInfo(deviceInfo.value) - message.success('新增成功') - addDeviceVisible.value = false - getDeviceList() + await ruleFormRef.value.validate(async (valid, fields) => { + if (!valid) return + deviceInfo.value.positionMapId = props.positionMapId + await MapApi.mapBindDeviceInfo(deviceInfo.value) + message.success('新增成功') + addDeviceVisible.value = false + getDeviceList() + }) } const equipmentList = ref([]) @@ -159,7 +168,7 @@ const dialogClose = () => { const initAddForm = () => { deviceInfo.value.deviceInfoId = '' deviceInfo.value.deviceType = '' - getAllDeviceList() + allDeviceList.value = [] } defineExpose({ open }) // 提供 open 方法，用于打开弹窗 diff --git a/src/views/mapPage/realTimeMap/editMap.vue b/src/views/mapPage/realTimeMap/editMap.vue index 547acba9..86434cac 100644 --- a/src/views/mapPage/realTimeMap/editMap.vue +++ b/src/views/mapPage/realTimeMap/editMap.vue @@ -395,8 +395,6 @@ v-if="item.type === 7 && item.layerSelectionShow" :style="{ position: 'absolute', - left: item.locationX + 'px', - top: item.locationY + 'px', color: item.fontColor, fontSize: item.fontSize + 'px', fontFamily: item.fontFamily, @@ -760,10 +758,15 @@ const resizeEnd = (locationX, locationY, w, h, item, index) => { nextTick(() => { let x = Number(locationX) + Number(item.locationWidePx) / 2 let y = Number(locationY) + Number(item.locationDeepPx) / 2 + let width = Number(w) * imgBgObj.resolution * 100 //实际的宽高cm + let height = Number(h) * imgBgObj.resolution * 100 + let actualPoint = disposeEventPoint(x, y) state.allMapPointInfo[index].locationX = x state.allMapPointInfo[index].locationY = y + state.allMapPointInfo[index].locationWide = width + state.allMapPointInfo[index].locationDeep = height state.allMapPointInfo[index].locationWidePx = w state.allMapPointInfo[index].locationDeepPx = h state.allMapPointInfo[index].actualLocationX = actualPoint.actualLocationX @@ -781,8 +784,8 @@ const resizeEnd = (locationX, locationY, w, h, item, index) => { if (item.id === route.endPointId) { route.endPointX = x route.endPointY = y - route.endHigh = Number(item.locationDeep) - route.endWidth = Number(item.locationDeep) + route.endHigh = Number(item.locationDeepPx) + route.endWidth = Number(item.locationWidePx) route.actualEndPointX = actualPoint.actualLocationX route.actualEndPointY = actualPoint.actualLocationY } @@ -984,7 +987,11 @@ const handleInputEnd = () => { fontFamily: state.inputBoxStyle.fontFamily, //字体类型 fontSize: state.inputBoxStyle.fontSize, dataObj: {}, //存 设备点 停车点 文字 - layerSelectionShow: true + layerSelectionShow: true, + locationDeep: 20, + locationWide: 20, + locationDeepPx: 4, + locationWidePx: 4 }) addEditHistory() state.inputBoxValue = '' @@ -1347,6 +1354,7 @@ const toolbarClick = async (item) => { break case 'move': //移动 + console.log(state.allMapPointInfo[state.currentItemIndex]) state.moveForm.locationX = Number(state.allMapPointInfo[state.currentItemIndex].locationX) state.moveForm.locationY = Number(state.allMapPointInfo[state.currentItemIndex].locationY) break @@ -1696,25 +1704,24 @@ const startFromPoint = (index, event) => { //开始框选绘制 const startDrawSelection = (event) => { if ( - toolbarSwitchType.value !== 'createLineLibrary' && - toolbarSwitchType.value !== 'createRegion' && - toolbarSwitchType.value !== 'drawRoute' && - toolbarSwitchType.value !== 'generateLine' - ) - return + toolbarSwitchType.value === 'createLineLibrary' || + toolbarSwitchType.value === 'createRegion' || + toolbarSwitchType.value === 'drawRoute' || + toolbarSwitchType.value == 'generateLine' + ) { + const backgroundRect = mapBackgroundRef.value.getBoundingClientRect() - const backgroundRect = mapBackgroundRef.value.getBoundingClientRect() + const x = disposeEventPoints(event).x + const y = disposeEventPoints(event).y - const x = disposeEventPoints(event).x - const y = disposeEventPoints(event).y - - // 确保点击在背景区域内 - if (x >= 0 && x <= backgroundRect.width && y >= 0 && y <= backgroundRect.height) { - state.drawSelectionAreaShow = true - state.drawSelectionStartPoint = { x: x, y: y } - state.drawSelectionAreaBox = { x: x, y: y, width: 0, height: 0 } + // 确保点击在背景区域内 + if (x >= 0 && x <= backgroundRect.width && y >= 0 && y <= backgroundRect.height) { + state.drawSelectionAreaShow = true + state.drawSelectionStartPoint = { x: x, y: y } + state.drawSelectionAreaBox = { x: x, y: y, width: 0, height: 0 } + } + event.preventDefault() // 阻止默认行为（避免选中图片或文本） } - event.preventDefault() // 阻止默认行为（避免选中图片或文本） } // 更新框选区域 const updateDrawSelection = (event) => { @@ -1736,7 +1743,6 @@ const updateDrawSelection = (event) => { } } event.preventDefault() // 阻止默认行为（避免选中图片或文本） - return } if (toolbarSwitchType.value === 'clickDrawRoute') { // 实时绘制 @@ -1748,7 +1754,6 @@ const updateDrawSelection = (event) => { state.currentDrawY = y } event.preventDefault() // 阻止默认行为（避免选中图片或文本） - return } } //结束框选绘制 @@ -2468,6 +2473,8 @@ const getAllNodeList = async () => { item.resizable = false item.rotatable = true item.lockAspectRatio = true + item.locationDeep = 20 + item.locationWide = 20 } //要将实际的cm改成px @@ -2515,7 +2522,20 @@ const saveMap = async () => { const saveNodeList = async () => { let list = state.allMapPointInfo list.forEach((item) => { - if (item.type === 7) { + if (item.type === 2) { + // 库位点 类型为数组 + item.dataList.forEach((node) => { + node.locationDeep = item.locationDeep + node.locationWide = item.locationWide + }) + item.dataJson = JSON.stringify(item.dataList) + } else if (item.type === 3 || item.type === 4) { + //设备类型 + item.dataObj.locationWide = item.locationWide + item.dataObj.locationDeep = item.locationDeep + item.dataJson = JSON.stringify(item.dataObj) + } else if (item.type === 7) { + //文字类型 item.dataObj.positionMapId = imgBgObj.positionMapId item.dataObj.text = item.text item.dataObj.fontColor = item.fontColor