修改实时地图

src/views/board/device/createEditDialog.vue

@@ -12,7 +12,7 @@
         </el-select>
       </el-form-item>
       <el-form-item  label="设备编号" prop="deviceNo">
-        <el-input v-model="formData.deviceNo" :disabled="false" placeholder="请输入设备编号" />
+        <el-input v-model="formData.deviceNo" :disabled="false" placeholder="请输入设备编号" maxlength="25"/>
       </el-form-item>
       
       <el-form-item  label="Mac地址" prop="macAddress">

src/views/board/device/index.vue

@@ -181,7 +181,7 @@ const filterTypeFun = (type, list) => {
 //地图定位
 const goMap = (item) => {
   if(item.floor == null || item.positionMapId == null){
-    message.warning('该设备未配置地图信息')
+    message.warning('该设备未配置地图信息，请前往实时地图-编辑地图进行配置')
     return
   }
     console.log(item.floor,item.positionMapId)

src/views/mapPage/realTimeMap/components/indexPage.vue

@@ -176,7 +176,10 @@
               </div>
             </el-popover>
             <!-- 设备点 -->
-            <img
+
+            <el-popover placement="top-start" trigger="hover" width="auto" v-if="item.type == 3" >
+              <template #reference>
+                <img
               v-if="item.type == 3"
               :src="
                 item.formattedData.mapImageUrl ||
@@ -184,6 +187,23 @@
               "
               :style="nodeStyle(item, index)"
             />
+              </template>
+              <div>
+                <div class="indexpage-popover-item">
+                  <div> 设备编号： </div>
+                  <div>
+                    {{ item.showData?.deviceNo || '' }}
+                  </div>
+                </div>
+                <div class="indexpage-popover-item">
+                  <div> 设备类型： </div>
+                  <div>
+                    {{ item.showData?filterTypeFun(item.showData.deviceType, typeList)  : '' }}
+                  </div>
+                </div>
+              </div>
+            </el-popover>
+            
             <!-- 停车点 -->
             <img
               v-if="item.type == 4"
@@ -330,6 +350,7 @@ import carDialog from './carDialog.vue'
 import { is } from 'bpmn-js/lib/util/ModelUtil'
 import JSONBigInt from 'json-bigint'
 import { propTypes } from '@/utils/propTypes'
+import { DICT_TYPE, getDictOptions } from '@/utils/dict'
 const imgUrl = ref('')
 const carDialogRef = ref(null)
 const socketClient = ref(null)
@@ -343,7 +364,7 @@ const carWidth = ref(60)
 const carHeight = ref(32)
 
 const nodeStyle = (item, index) => {
-  console.log(item.locationWidePx, item.locationDeepPx,item)
+  // console.log(item.locationWidePx, item.locationDeepPx,item)
   return {
     verticalAlign: 'top',
     objectFit: 'cover',
@@ -351,6 +372,23 @@ const nodeStyle = (item, index) => {
     height: Number(item.locationDeepPx) * Number(radio.value) + 'px'
   }
 }
+const typeList = ref([])
+
+const getTypeList = () => {
+  typeList.value = getDictOptions(DICT_TYPE.DEVICE_TYPE)&&getDictOptions(DICT_TYPE.DEVICE_TYPE).length?JSON.parse(JSON.stringify(getDictOptions(DICT_TYPE.DEVICE_TYPE))):[]
+
+}
+//根据type和列表返回对应中文
+const filterTypeFun = (type, list) => {
+	if (list.length) {
+		let obj = list.find(item => {
+			return item.value == type
+		})
+		return obj == undefined ? type : obj.label
+	} else {
+		return type
+	}
+}
 const isFull = ref(false)
 // 定义属性
 const props = defineProps({
@@ -370,6 +408,11 @@ const convertActualToBrowser = (pointX, pointY) => {
     y: y / resolution - carHeight.value / resolution / 100 / 2
   }
 }
+
+// 设备点悬浮
+const showPopdevice = (e, item) => {
+  console.log(e, item)
+}
 //是否可以拖拽
 const isDrag = ref(false)
 const changeIsDrag = () => {
@@ -576,7 +619,7 @@ const getPositionMapListFun = async (positionMapId) => {
 
   pointList.value?.forEach((item) => {
     item.formattedData = item.dataJson ? JSON.parse(item.dataJson) : ''
-    item.showData = item.dataJson ? JSON.parse(item.dataJson)[0] : null
+    item.showData = item.dataJson ? (item.type == 1 ? JSON.parse(item.dataJson)[0] : JSON.parse(item.dataJson)) : null
     item.imgUrl = formatTypeImg(item.type)
 
     if (item.type === 1) {
@@ -996,6 +1039,7 @@ const observeWidthChange = (id, callback) => {
 let stopObserving
 defineExpose({ getMapData }) // 提供 open 方法，用于打开弹窗
 onMounted(() => {
+  getTypeList()
   // getList()
   // window.addEventListener('resize', computedRatio)
   stopObserving = observeWidthChange('indexpage-container', (newWidth) => {