ak/zn-admin-vue3-wcs
1
0
Fork 0
Code Issues Pull Requests Actions Packages Projects Releases Wiki Activity

实时地图

Browse Source
This commit is contained in:
yyy 2025-03-08 12:15:21 +08:00
parent b2a46e7132
commit 74701d7fb7
2 changed files with 178 additions and 282 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

459
src/views/mapPage/realTimeMap/components/indexPage.vue
View File

@ -5,7 +5,7 @@
:style="{
height: heightVal + 'px',
cursor: isDrag ? 'pointer' : 'default',
scale: isSizeRaio,
scale: isSizeRadio,
transformOrigin: '0 0'
}"
>
@ -17,7 +17,7 @@
ref="draggableElement"
>
<div class="indexpage-container-box">
<img :src="imgUrl" alt="" class="indexpage-container-box-img" />
<img :src="imgUrl" class="indexpage-container-box-img" />
<div class="indexpage-container-box-point">
<!-- 连线 -->
@ -27,11 +27,27 @@
<template v-for="(item, index) in lineList" :key="index">
<!-- 定义箭头 -->
<defs>
<marker id="forward-arrow" viewBox="0 0 10 10" refX="10" refY="5" orient="auto">
<marker
id="forward-arrow"
viewBox="0 0 10 10"
refX="10"
refY="5"
orient="auto"
markerWidth="2"
markerHeight="2"
>
<path d="M 0 0 L 10 5 L 0 10 z" fill="black" />
</marker>
<!-- 反向箭头 -->
<marker id="backward-arrow" viewBox="0 0 10 10" refX="0" refY="5" orient="auto">
<marker
id="backward-arrow"
viewBox="0 0 10 10"
refX="0"
refY="5"
orient="auto"
markerWidth="2"
markerHeight="2"
>
<path d="M 10 0 L 0 5 L 10 10 z" fill="black" />
</marker>
</defs>
@ -42,7 +58,7 @@
:x2="Number(item.endPointX) * radio"
:y2="Number(item.endPointY) * radio"
:stroke="item.isSelect ? '#f48924' : '#00329F'"
:stroke-width="5 * radio"
:stroke-width="4 * radio"
:marker-start="item.direction === 2 ? 'url(#double-arrow-start)' : ''"
marker-end="url(#single-arrow)"
@click="handleChooseRoute(item, index)"
@ -51,7 +67,7 @@
:d="getLineMidArrowPath(item)"
stroke="none"
fill="black"
stroke-width="4"
:stroke-width="4 * radio"
:marker-start="item.direction === 2 ? 'url(#backward-arrow)' : ''"
:marker-end="
item.direction === 2 ? 'url(#forward-arrow)' : 'url(#forward-arrow)'
@ -62,7 +78,7 @@
<path
:d="getCurvePath(item)"
:stroke="item.isSelect ? '#f48924' : '#00329F'"
:stroke-width="5 * radio"
:stroke-width="4 * radio"
fill="none"
:marker-start="item.direction === 2 ? 'url(#backward-arrow)' : ''"
:marker-end="
@ -97,7 +113,6 @@
>
<img
src="@/assets/imgs/indexPage/chache-4备份 7@2x.png"
alt=""
style="width: 100%; height: 100%"
/>
</div>
@ -107,209 +122,93 @@
:key="index"
:style="{
left:
(item.locationX - item.locationWide / 2 / nowObject.showYamlJson.resolution / 100) *
radio +
'px',
(Number(item.locationX) - Number(item.locationWidePx) / 2) * Number(radio) + 'px',
top:
(item.locationY - item.locationDeep / 2 / nowObject.showYamlJson.resolution / 100) *
radio +
'px'
(Number(item.locationY) - Number(item.locationDeepPx) / 2) * Number(radio) + 'px',
width: Number(item.locationWidePx) * Number(radio) + 'px',
height: Number(item.locationDeepPx) * Number(radio) + 'px'
}"
>
<!-- 库位点 -->
<div
class="indexpage-container-box-point-item-inner"
v-if="item.showData"
:style="{
width:
(item.showData.locationWide / nowObject.showYamlJson.resolution / 100) * radio +
'px',
height:
(item.showData.locationDeep / nowObject.showYamlJson.resolution / 100) * radio +
'px'
}"
>
<!-- 库位 2-->
<div v-if="item.type == 2" style="width: 100%; height: 100%; vertical-align: top">
<el-popover placement="top-start" trigger="hover" width="auto">
<template #reference>
<img
:src="item.imgUrl"
alt=""
:style="{
width:
(item.showData.locationWide / nowObject.showYamlJson.resolution / 100) *
radio +
'px',
height:
(item.showData.locationDeep / nowObject.showYamlJson.resolution / 100) *
radio +
'px',
verticalAlign: 'top'
}"
@dblclick="storeClick(item)"
/>
</template>
<div class="indexpage-container-box-point-item-inner-popover">
<div
class="indexpage-container-box-point-item-inner-popover-item"
style="margin-bottom: 8px"
>
<div class="indexpage-container-box-point-item-inner-popover-name">
库位名：
</div>
<div class="indexpage-container-box-point-item-inner-popover-value">
{{ item.showData.locationNo || '' }}
</div>
</div>
<div
class="indexpage-container-box-point-item-inner-popover-item"
style="margin-bottom: 8px"
>
<div class="indexpage-container-box-point-item-inner-popover-name">
所属线库：
</div>
<div class="indexpage-container-box-point-item-inner-popover-value">
{{ item.showData.laneName || '' }}
</div>
</div>
<div
class="indexpage-container-box-point-item-inner-popover-item"
style="margin-bottom: 8px"
>
<div class="indexpage-container-box-point-item-inner-popover-name">
所属区域：
</div>
<div class="indexpage-container-box-point-item-inner-popover-value">
{{ item.showData.areaName || '' }}
</div>
</div>
</div>
</el-popover>
</div>
<!-- 设备点 -->
<div v-if="item.type == 3">
<img
:src="item.formattedData.mapImageUrl"
alt=""
style="width: 100%; height: 100%"
/>
</div>
</div>
<!-- 设备点 -->
<div
class="indexpage-container-box-point-item-inner"
v-if="item.type == 3"
:style="{
width:
(item.formattedData.locationWide / nowObject.showYamlJson.resolution / 100) *
radio +
'px',
height:
(item.formattedData.locationDeep / nowObject.showYamlJson.resolution / 100) *
radio +
'px'
}"
>
<div>
<img
:src="
item.formattedData.mapImageUrl
? item.formattedData.mapImageUrl
: 'https://api.znkjfw.com/admin-api/infra/file/4/get/设备点_png_179_1739327151877.png'
"
alt=""
style="width: 100%; height: 100%"
/>
</div>
</div>
<!-- 停车点 -->
<div
class="indexpage-container-box-point-item-inner"
v-if="item.type == 4"
:style="{
width:
(item.formattedData.locationWide / nowObject.showYamlJson.resolution / 100) *
radio +
'px',
height:
(item.formattedData.locationDeep / nowObject.showYamlJson.resolution / 100) *
radio +
'px'
}"
>
<div>
<img
:src="
item.formattedData.mapImageUrl
? item.formattedData.mapImageUrl
: 'https://api.znkjfw.com/admin-api/infra/file/4/get/停车场-01_png_179_1739326933020.png'
"
alt=""
style="width: 100%; height: 100%"
/>
</div>
</div>
<!-- 路径点 -->
<div
class="indexpage-container-box-point-item-inner"
v-if="item.type == 5"
:style="{
width: 150 * radio + 'px',
height: 150 * radio + 'px'
}"
>
<div>
<img
:src="
item.formattedData.mapImageUrl
? item.formattedData.mapImageUrl
: 'https://api.znkjfw.com/admin-api/infra/file/4/get/区域_png_179_1739327151876.png'
"
alt=""
style="width: 100%; height: 100%"
/>
</div>
</div>
<!-- 等待点 -->
<div
class="indexpage-container-box-point-item-inner"
v-if="item.type == 6"
:style="{
width: 150 * radio + 'px',
height: 150 * radio + 'px'
}"
>
<div>
<img
:src="
item.formattedData.mapImageUrl
? item.formattedData.mapImageUrl
: 'https://api.znkjfw.com/admin-api/infra/file/4/get/等待点_png_179_1739326991439.png'
"
alt=""
style="width: 100%; height: 100%"
/>
</div>
</div>
<!-- 普通点 -->
<el-tooltip
class="box-item"
effect="dark"
:content="item.sortNum + ''"
placement="top"
v-if="item.type == 1"
>
<!-- 1 路径点 -->
<el-tooltip class="box-item" effect="dark" :content="item.sortNum + ''" placement="top">
<div
v-if="item.type === 1"
:style="{
width: 10 * radio + 'px',
height: 10 * radio + 'px',
background: '#000',
width: Number(item.locationWidePx) * Number(radio) + 'px',
height: Number(item.locationDeepPx) * Number(radio) + 'px',
backgroundColor: '#000',
borderRadius: '50%'
}"
>
</div>
</el-tooltip>
<!-- 库位点 -->
<el-popover placement="top-start" trigger="hover" width="auto">
<template #reference>
<img
v-if="item.showData && item.type == 2"
:src="item.imgUrl"
:style="nodeStyle(item, index)"
@dblclick="storeClick(item)"
/>
</template>
<div>
<div class="indexpage-popover-item">
<div> 库位名： </div>
<div>
{{ item.showData?.locationNo || '' }}
</div>
</div>
<div class="indexpage-popover-item">
<div> 所属线库： </div>
<div>
{{ item.showData?.laneName || '' }}
</div>
</div>
<div class="indexpage-popover-item">
<div> 所属区域： </div>
<div>
{{ item.showData?.areaName || '' }}
</div>
</div>
</div>
</el-popover>
<!-- 设备点 -->
<img
v-if="item.type == 3"
:src="
item.formattedData.mapImageUrl ||
'https://api.znkjfw.com/admin-api/infra/file/4/get/设备点_png_179_1739327151877.png'
"
:style="nodeStyle(item, index)"
/>
<!-- 停车点 -->
<img
v-if="item.type == 4"
:src="
item.formattedData.mapImageUrl ||
'https://api.znkjfw.com/admin-api/infra/file/4/get/停车场-01_png_179_1739326933020.png'
"
:style="nodeStyle(item, index)"
/>
<!-- 路径点 -->
<img
v-if="item.type == 5"
:src="
item.formattedData.mapImageUrl ||
'https://api.znkjfw.com/admin-api/infra/file/4/get/区域_png_179_1739327151876.png'
"
:style="nodeStyle(item, index)"
/>
<!-- 等待点 -->
<img
v-if="item.type == 6"
:src="
item.formattedData.mapImageUrl ||
'https://api.znkjfw.com/admin-api/infra/file/4/get/等待点_png_179_1739326991439.png'
"
:style="nodeStyle(item, index)"
/>
</div>
</div>
</div>
@ -321,7 +220,7 @@
<div
class="affix-container-left-box-item-box"
:style="{
height: legendObj.legendShow ? '84px' : '0',
height: legendObj.legendShow ? '5.25rem' : '0',
overflow: 'hidden',
transition: 'all 0.3s ease-in-out'
}"
@ -330,14 +229,12 @@
<div class="affix-container-left-box-item-left"> 行驶路线 </div>
<img
src="@/assets/imgs/indexPage/yanjing_xianshi_o.png"
alt=""
class="affix-container-left-box-item-img"
v-if="legendObj.driveLineShow"
@click="changDriveLineShow"
/>
<img
src="@/assets/imgs/indexPage/yanjing_yincang_o.png"
alt=""
class="affix-container-left-box-item-img"
v-if="!legendObj.driveLineShow"
@click="changDriveLineShow"
@ -347,14 +244,12 @@
<div class="affix-container-left-box-item-left"> 车辆 </div>
<img
src="@/assets/imgs/indexPage/yanjing_xianshi_o.png"
alt=""
class="affix-container-left-box-item-img"
v-if="legendObj.carShow"
@click="changCarShow"
/>
<img
src="@/assets/imgs/indexPage/yanjing_yincang_o.png"
alt=""
class="affix-container-left-box-item-img"
v-if="!legendObj.carShow"
@click="changCarShow"
@ -368,7 +263,6 @@
<div class="affix-container-left-box-item-bottom-left"> 图例 </div>
<img
src="@/assets/imgs/indexPage/zhankai@2x.png"
alt=""
class="affix-container-left-box-item-bottom-img"
:style="{
transform: legendObj.legendShow ? 'rotate(180deg)' : 'rotate(0deg)',
@ -383,13 +277,12 @@
<div class="affix-container-right" v-if="!isAllBoard">
<!-- 拖拽 -->
<div class="affix-container-right-item" @click="changeIsDrag">
<img src="@/assets/imgs/indexPage/编组 12.png" alt="" style="width: 100%; height: 100%" />
<img src="@/assets/imgs/indexPage/编组 12.png" style="width: 100%; height: 100%" />
</div>
<!-- 放大 -->
<div class="affix-container-right-item">
<img
src="@/assets/imgs/indexPage/编组 14.png"
alt=""
style="width: 100%; height: 100%"
@click="changeSizeRaio(0.2)"
/>
@ -398,7 +291,6 @@
<div class="affix-container-right-item">
<img
src="@/assets/imgs/indexPage/编组 15.png"
alt=""
style="width: 100%; height: 100%"
@click="changeSizeRaio(-0.2)"
/>
@ -407,7 +299,6 @@
<div class="affix-container-right-item">
<img
src="@/assets/imgs/indexPage/编组 22.png"
alt=""
style="width: 100%; height: 100%"
@click="toggleFullScreen"
/>
@ -447,25 +338,32 @@ const nowObject = ref(null) // 地图当前对象 父组件传过来的
const testCarList = ref([]) //小车数组
const carWidth = ref(60)
const carHeight = ref(32)
const nodeStyle = (item, index) => {
return {
verticalAlign: 'top',
objectFit: 'cover',
width: Number(item.locationWidePx) * Number(radio.value) + 'px',
height: Number(item.locationDeepPx) * Number(radio.value) + 'px'
}
}
// 定义属性
const props = defineProps({
// 当前选中的链接
isAllBoard: propTypes.bool.def(false)
})
const convertActualToBrowser = (pointX, pointY) => {
const y1 =
Number(nowObject.value.showYamlJson.origin[1]) +
Number(nowObject.value.showYamlJson.height) * Number(nowObject.value.showYamlJson.resolution)
let x = Math.max(Number(pointX) - Number(nowObject.value.showYamlJson.origin[0]), 0)
let resolution = Number(nowObject.value.showYamlJson.resolution)
let origin = nowObject.value.showYamlJson.origin
const y1 = Number(origin[1]) + Number(nowObject.value.showYamlJson.height) * resolution
let x = Math.max(Number(pointX) - Number(origin[0]), 0)
let y = Math.max(y1 - Number(pointY), 0)
return {
x:
x / nowObject.value.showYamlJson.resolution -
carWidth.value / nowObject.value.showYamlJson.resolution / 100 / 2,
y:
y / nowObject.value.showYamlJson.resolution -
carHeight.value / nowObject.value.showYamlJson.resolution / 100 / 2
x: x / resolution - carWidth.value / resolution / 100 / 2,
y: y / resolution - carHeight.value / resolution / 100 / 2
}
}
//是否可以拖拽
@ -515,12 +413,12 @@ const getCurvePath = (curve) => {
return `M ${startPointX} ${startPointY} C ${curve.beginControlX * radio.value} ${curve.beginControlY * radio.value}, ${curve.endControlX * radio.value} ${curve.endControlY * radio.value}, ${endPointX} ${endPointY}`
}
//放大缩小
const isSizeRaio = ref(1)
const isSizeRadio = ref(1)
const changeSizeRaio = (type) => {
if (type < 0 && isSizeRaio.value + type <= 0) {
if (type < 0 && isSizeRadio.value + type <= 0) {
return
}
isSizeRaio.value += type
isSizeRadio.value += type
}
//图层状态
const legendObj = reactive({
@ -626,33 +524,22 @@ const toggleFullScreen = () => {
//库位双击
const storeClick = async (item) => {
// console.log(item)
let storeData = await MapApi.houseLocationGetByMapItemId({
mapId: item.positionMapId,
mapItemId: item.id
})
// console.log(storeData)
storeDialogRef.value.open(JSON.parse(JSON.stringify(storeData)))
}
const lineList = ref([])
const pointList = ref([])
const getPositionMapListFun = async (positionMapId) => {
// console.log(positionMapId)
let data = await MapApi.getPositionMapItemList({ positionMapId: positionMapId })
// console.log(data)
if (data && data.length > 0) {
data.forEach((item) => {
// console.log(JSON.parse(item.dataJson))
item.formattedData = item.dataJson ? JSON.parse(item.dataJson) : ''
item.showData = item.dataJson ? JSON.parse(item.dataJson)[0] : null
item.imgUrl = formatteTypeImg(item.type)
})
}
// console.log(data)
pointList.value = data
pointList.value = await MapApi.getPositionMapItemList({ positionMapId: positionMapId })
pointList.value?.forEach((item) => {
item.formattedData = item.dataJson ? JSON.parse(item.dataJson) : ''
item.showData = item.dataJson ? JSON.parse(item.dataJson)[0] : null
item.imgUrl = formatTypeImg(item.type)
// console.log('=======================', pointList.value)
pointList.value.forEach((item) => {
if (item.type === 1) {
item.locationDeep = 40
item.locationWide = 40
@ -672,10 +559,25 @@ const getPositionMapListFun = async (positionMapId) => {
item.dataObj = JSONBigInt({ storeAsString: true }).parse(item.dataJson)
item.locationDeep = item.dataObj.locationDeep
item.locationWide = item.dataObj.locationWide
} else if (item.type === 7) {
}
//要将实际的cm改成px
if (item.locationWide && item.locationDeep) {
let pxObj = cmConversionPx(item.locationWide, item.locationDeep)
item.locationWidePx = pxObj.pWidth
item.locationDeepPx = pxObj.pHeight
}
})
}
//将节点实际宽高cm转换成px
const cmConversionPx = (cWidth, cHeight) => {
let pWidth = Number(cWidth) / Number(nowObject.value.showYamlJson.resolution) / 100
let pHeight = Number(cHeight) / Number(nowObject.value.showYamlJson.resolution) / 100
return {
pWidth,
pHeight
}
}
const draggableElement = ref(null)
const resetPosition = () => {
if (draggableElement.value) {
@ -728,7 +630,7 @@ const calculateDistanceAndAngle = (point1, point2) => {
}
}
const formatteTypeImg = (type) => {
const formatTypeImg = (type) => {
switch (type) {
case 1:
return ''
@ -786,7 +688,7 @@ const linkWebSocket = (url) => {
[
h(
'span',
{ style: 'color: rgba(255,255,255,0.88);font-size: 14px;' },
{ style: 'color: rgba(255,255,255,0.88);font-size: .875rem;' },
`${JSON.parse(jsonMsg.content)}`
),
h(
@ -794,7 +696,7 @@ const linkWebSocket = (url) => {
{
onClick: () => lookError(),
style:
'color: rgba(255,255,255,0.88);font-size: 14px;cursor: pointer;text-decoration-line: underline;margin-left: 32px;'
'color: rgba(255,255,255,0.88);font-size: .875rem;cursor: pointer;text-decoration-line: underline;margin-left: 2rem;'
},
'详情'
)
@ -833,9 +735,8 @@ const getMapData = async (item) => {
testCarList.value = []
nowObject.value = JSON.parse(JSON.stringify(item))
nowObject.value.showYamlJson = JSON.parse(item.yamlJson)
let websoketUrl = `${replaceHttpWithWs(import.meta.env.VITE_BASE_URL)}/infra/ws?type=map&floor=${nowObject.value.floor}&area=${nowObject.value.area}`
// console.log(websoketUrl)
linkWebSocket(websoketUrl)
let websocketUrl = `${replaceHttpWithWs(import.meta.env.VITE_BASE_URL)}/infra/ws?type=map&floor=${nowObject.value.floor}&area=${nowObject.value.area}`
linkWebSocket(websocketUrl)
getPositionMapListFun(nowObject.value.id)
emit('transmitMapInfo', {
id: item.id,
@ -866,17 +767,14 @@ const computedRatio = () => {
//这段代码之后会删掉 yaml会给原始宽高
getImageSize(imgUrl.value)
.then(({ width, height }) => {
// console.log("原始地图的宽高",JSON.parse(nowObject.value.yamlJson))
if (testCarList.value.length) {
testCarList.value.forEach((item) => {
console.log('dayin', item)
item.originWidth = width
item.originHeight = height
item.origin = JSON.parse(nowObject.value.yamlJson).origin
item.realX = convertActualToBrowser(item.data.pose2d.x, item.data.pose2d.y).x
item.realY = convertActualToBrowser(item.data.pose2d.x, item.data.pose2d.y).y
})
// console.log('当前数据', testCarList.value)
}
})
.catch((error) => {
@ -901,10 +799,8 @@ const computedRatio = () => {
}
})
getImageWidth(imgUrl.value, 'height').then((res) => {
// console.log('高', res)
heightVal.value = res * radio.value
})
// console.log(width)
}
})
}
@ -912,7 +808,6 @@ const computedRatio = () => {
// 获取地图连线列表
const getMapLineList = () => {
MapApi.mapLineListGet({ positionMapId: nowObject.value.id }).then((res) => {
// console.log(res)
lineList.value = res
})
}
@ -1057,9 +952,9 @@ onUnmounted(() => {
}
.indexpage-container .affix-container-top {
width: 100%;
height: 80px;
height: 5rem;
background-color: #fff;
border-bottom: 1px solid #f5f5f5;
border-bottom: 0.0625rem solid #f5f5f5;
}
.indexpage-container-box-point {
width: 100%;
@ -1070,11 +965,12 @@ onUnmounted(() => {
right: 0;
}
.indexpage-container-box-point-item {
box-sizing: border-box;
position: absolute;
cursor: pointer;
}
.scrollbar-flex-content {
padding: 2px 6px;
padding: 0.125rem 0.375rem;
display: flex;
align-items: center;
flex-wrap: wrap;
@ -1084,11 +980,11 @@ onUnmounted(() => {
display: flex;
align-items: center;
justify-content: center;
width: 90px;
height: 30px;
margin: 10px 6px;
width: 5.625rem;
height: 1.875rem;
margin: 0.625rem 0.375rem;
text-align: center;
border-radius: 4px;
border-radius: 0.25rem;
background: var(--el-color-primary-light-9);
color: var(--el-color-primary);
position: relative;
@ -1109,14 +1005,15 @@ onUnmounted(() => {
width: 100%;
height: auto;
}
.indexpage-container-box-point-item-inner-popover-item {
.indexpage-popover-item {
display: flex;
font-family:
PingFangSC,
PingFang SC;
font-weight: 400;
font-size: 14px;
font-size: 0.875rem;
color: #0d162a;
margin-bottom: 0.5rem;
}
.line-box {
position: absolute;
@ -1127,21 +1024,21 @@ onUnmounted(() => {
}
.affix-container-left {
position: fixed;
bottom: 26px;
bottom: 1.625rem;
z-index: 999;
}
.affix-container-left-box {
width: 144px;
width: 9rem;
}
.affix-container-left-box-item-box {
width: 100%;
border-bottom: 1px solid #eeeeee;
border-bottom: 0.0625rem solid #eeeeee;
background: #ffffff;
}
.affix-container-left-box-item {
width: 100%;
padding: 0 18px;
height: 42px;
padding: 0 1.125rem;
height: 2.625rem;
display: flex;
align-items: center;
justify-content: space-between;
@ -1151,18 +1048,18 @@ onUnmounted(() => {
PingFangSC,
PingFang SC;
font-weight: 400;
font-size: 14px;
font-size: 0.875rem;
color: rgba(0, 0, 0, 0.88);
}
.affix-container-left-box-item-img {
cursor: pointer;
flex-shrink: 0;
width: 20px;
height: 12px;
width: 1.25rem;
height: 0.75rem;
}
.affix-container-left-box-item-bottom {
width: 100%;
height: 36px;
height: 2.25rem;
display: flex;
align-items: center;
justify-content: center;
@ -1172,8 +1069,8 @@ onUnmounted(() => {
.affix-container-left-box-item-bottom-img {
cursor: pointer;
flex-shrink: 0;
width: 12px;
height: 7px;
width: 0.75rem;
height: 0.4375rem;
}
.affix-container-left-box-item-bottom-left {
cursor: pointer;
@ -1182,24 +1079,24 @@ onUnmounted(() => {
PingFangSC,
PingFang SC;
font-weight: 400;
font-size: 16px;
font-size: 1rem;
color: #98a4bf;
margin-right: 2px;
margin-right: 0.125rem;
}
.affix-container-right {
position: fixed;
z-index: 999;
right: 40px;
bottom: 20px;
right: 2.5rem;
bottom: 1.25rem;
display: flex;
align-items: center;
justify-content: flex-end;
}
.affix-container-right-item {
width: 28px;
height: 28px;
width: 1.75rem;
height: 1.75rem;
cursor: pointer;
flex-shrink: 0;
margin-left: 8px;
margin-left: 0.5rem;
}
</style>

1
src/views/mapPage/realTimeMap/editMap.vue
View File

@ -333,7 +333,6 @@
>
<!-- 1 路径点 -->
<el-tooltip
class="box-item"
effect="dark"
:content="item.sortNum || '节点未保存'"
placement="top"