修改实时地图
This commit is contained in:
parent
2e229b1743
commit
1047964d8e
@ -2,9 +2,13 @@
|
||||
<div
|
||||
class="affix-container"
|
||||
id="indexpage-container"
|
||||
:style="{ height: heightVal * radio + 'px',cursor:isDrag ? 'pointer' : 'default',scale:isSizeRaio,transformOrigin: 'center center' }"
|
||||
:style="{
|
||||
height: heightVal * radio + 'px',
|
||||
cursor: isDrag ? 'pointer' : 'default',
|
||||
scale: isSizeRaio,
|
||||
transformOrigin: 'center center'
|
||||
}"
|
||||
>
|
||||
|
||||
<div
|
||||
class="indexpage-container"
|
||||
v-if="imgUrl"
|
||||
@ -17,21 +21,35 @@
|
||||
|
||||
<div class="indexpage-container-box-point">
|
||||
<!-- 连线 -->
|
||||
<!-- <div
|
||||
<div
|
||||
class="line-box"
|
||||
v-for="(item, index) in lineList"
|
||||
:key="index"
|
||||
:style="{
|
||||
left: item.left * radio + 'px',
|
||||
top: item.top * radio + 'px',
|
||||
width: item.distance * radio + 'px',
|
||||
height: item.height * radio + 'px',
|
||||
transform: 'rotate(' + item.angle + 'deg)',
|
||||
backgroundColor: item.color,
|
||||
transformOrigin: 'left top'
|
||||
}"
|
||||
|
||||
>
|
||||
</div> -->
|
||||
<svg id="svg" :width="widthVal" :height="heightVal">
|
||||
<template v-if="item.method == 0">
|
||||
<line
|
||||
:x1="(Number(item.startPointX) + Number(item.beginWidth) / 2)* radio"
|
||||
:y1="(Number(item.startPointY) + Number(item.beginHigh) / 2)* radio"
|
||||
:x2="(Number(item.endPointX) + Number(item.endWidth) / 2)* radio"
|
||||
:y2="(Number(item.endPointY) + Number(item.endHigh) / 2)* radio"
|
||||
stroke="#00329F"
|
||||
stroke-width="5"
|
||||
/>
|
||||
</template>
|
||||
<template v-else>
|
||||
<path
|
||||
:d="getCurvePath(item)"
|
||||
:stroke="'#00329F'"
|
||||
stroke-width="5"
|
||||
fill="none"
|
||||
|
||||
/>
|
||||
</template>
|
||||
</svg>
|
||||
</div>
|
||||
|
||||
<!-- 小车 -->
|
||||
<div
|
||||
class="indexpage-car-item"
|
||||
@ -41,8 +59,8 @@
|
||||
:style="{
|
||||
left: item.realX * radio + 'px',
|
||||
top: item.realY * radio + 'px',
|
||||
width: 40 * radio + 'px',
|
||||
height: 22 * radio + 'px'
|
||||
width: legendObj.carShow ? 40 * radio + 'px' : '0',
|
||||
height: legendObj.carShow ? 22 * radio + 'px' : '0'
|
||||
}"
|
||||
>
|
||||
<img
|
||||
@ -57,6 +75,7 @@
|
||||
:key="index"
|
||||
:style="{ left: item.locationX * radio + 'px', top: item.locationY * radio + 'px' }"
|
||||
>
|
||||
<!-- 库位点 -->
|
||||
<div
|
||||
class="indexpage-container-box-point-item-inner"
|
||||
v-if="item.showData"
|
||||
@ -65,6 +84,7 @@
|
||||
height: item.showData.locationDeep * radio + 'px'
|
||||
}"
|
||||
>
|
||||
<!-- 库位 2-->
|
||||
<div v-if="item.type == 2" style="width: 100%; height: 100%">
|
||||
<el-popover placement="top-start" trigger="hover" width="auto">
|
||||
<template #reference>
|
||||
@ -112,72 +132,129 @@
|
||||
</div>
|
||||
</el-popover>
|
||||
</div>
|
||||
<div v-else style="width: 100%; height: 100%">
|
||||
<img :src="item.imgUrl" alt="" style="width: 100%; height: 100%" />
|
||||
</div>
|
||||
<!-- 设备点 -->
|
||||
<div v-if="item.type == 3">
|
||||
<img :src="item.formattedData.mapImageUrl" alt="" style="width: 100%;height: 100%;"/>
|
||||
</div>
|
||||
</div>
|
||||
<div v-else style="width: 10px; height: 10px; border-radius: 50%; background: #1890ff">
|
||||
<!-- 设备点 -->
|
||||
<div
|
||||
class="indexpage-container-box-point-item-inner"
|
||||
v-if="item.type == 3"
|
||||
:style="{
|
||||
width: item.formattedData.locationWide * radio + 'px',
|
||||
height: item.formattedData.locationDeep * radio + 'px'
|
||||
}"
|
||||
>
|
||||
<div >
|
||||
<img :src="item.formattedData.mapImageUrl" alt="" style="width: 100%;height: 100%;"/>
|
||||
</div>
|
||||
</div>
|
||||
<div v-if="item.type == 1" style="width: 10px; height: 10px; border-radius: 50%; background: #1890ff">
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
<!-- 左下角图例 -->
|
||||
<div class="affix-container-left" :style="{ left: boxLeft + 'px' }">
|
||||
<div class="affix-container-left-box">
|
||||
<div class="affix-container-left-box-item-box" :style="{ height: legendObj.legendShow ? '84px' : '0', overflow: 'hidden',transition: 'all 0.3s ease-in-out'}">
|
||||
<div class="affix-container-left-box-item">
|
||||
<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"/>
|
||||
</div>
|
||||
<div class="affix-container-left-box-item">
|
||||
<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"/>
|
||||
</div>
|
||||
<!-- 左下角图例 -->
|
||||
<div class="affix-container-left" :style="{ left: boxLeft + 'px' }">
|
||||
<div class="affix-container-left-box">
|
||||
<div
|
||||
class="affix-container-left-box-item-box"
|
||||
:style="{
|
||||
height: legendObj.legendShow ? '84px' : '0',
|
||||
overflow: 'hidden',
|
||||
transition: 'all 0.3s ease-in-out'
|
||||
}"
|
||||
>
|
||||
<div class="affix-container-left-box-item">
|
||||
<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"
|
||||
/>
|
||||
</div>
|
||||
<div class="affix-container-left-box-item-bottom" @click="legendObj.legendShow = !legendObj.legendShow">
|
||||
<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)',transition: 'all 0.3s ease-in-out'}"/>
|
||||
</div>
|
||||
<div class="affix-container-left-box-item">
|
||||
<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"
|
||||
/>
|
||||
</div>
|
||||
</div>
|
||||
<div
|
||||
class="affix-container-left-box-item-bottom"
|
||||
@click="legendObj.legendShow = !legendObj.legendShow"
|
||||
>
|
||||
<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)',
|
||||
transition: 'all 0.3s ease-in-out'
|
||||
}"
|
||||
/>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<!-- 右下角的功能 -->
|
||||
<div class="affix-container-right">
|
||||
<!-- 拖拽 -->
|
||||
<div class="affix-container-right-item" @click="changeIsDrag">
|
||||
<img src="@/assets/imgs/indexPage/编组 12.png" alt="" 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)"/>
|
||||
</div>
|
||||
<!-- 缩小 -->
|
||||
<div class="affix-container-right-item">
|
||||
<img src="@/assets/imgs/indexPage/编组 15.png" alt="" style="width: 100%;height: 100%;" @click="changeSizeRaio(-0.2)"/>
|
||||
</div>
|
||||
<!-- 全屏 -->
|
||||
<div class="affix-container-right-item">
|
||||
<img src="@/assets/imgs/indexPage/编组 22.png" alt="" style="width: 100%;height: 100%;" @click="toggleFullScreen" />
|
||||
</div>
|
||||
</div>
|
||||
<!-- 右下角的功能 -->
|
||||
<div class="affix-container-right">
|
||||
<!-- 拖拽 -->
|
||||
<div class="affix-container-right-item" @click="changeIsDrag">
|
||||
<img src="@/assets/imgs/indexPage/编组 12.png" alt="" 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)"
|
||||
/>
|
||||
</div>
|
||||
<!-- 缩小 -->
|
||||
<div class="affix-container-right-item">
|
||||
<img
|
||||
src="@/assets/imgs/indexPage/编组 15.png"
|
||||
alt=""
|
||||
style="width: 100%; height: 100%"
|
||||
@click="changeSizeRaio(-0.2)"
|
||||
/>
|
||||
</div>
|
||||
<!-- 全屏 -->
|
||||
<div class="affix-container-right-item">
|
||||
<img
|
||||
src="@/assets/imgs/indexPage/编组 22.png"
|
||||
alt=""
|
||||
style="width: 100%; height: 100%"
|
||||
@click="toggleFullScreen"
|
||||
/>
|
||||
</div>
|
||||
</div>
|
||||
<storeDialog ref="storeDialogRef" @success="getList" />
|
||||
<carDialog ref="carDialogRef" />
|
||||
</template>
|
||||
@ -190,7 +267,7 @@ import {
|
||||
nextTick,
|
||||
onMounted,
|
||||
onBeforeUnmount,
|
||||
onUnmounted,
|
||||
onUnmounted
|
||||
} from 'vue'
|
||||
import * as MapApi from '@/api/map/map'
|
||||
import WebSocketClient from '../webSocket.js'
|
||||
@ -233,29 +310,36 @@ const carPointListFun = () => {
|
||||
const isDrag = ref(false)
|
||||
const changeIsDrag = () => {
|
||||
nextTick(() => {
|
||||
isDrag.value = !isDrag.value
|
||||
console.log(isDrag.value)
|
||||
if(!isDrag.value){
|
||||
//还原位置
|
||||
resetPosition()
|
||||
}
|
||||
isDrag.value = !isDrag.value
|
||||
console.log(isDrag.value)
|
||||
if (!isDrag.value) {
|
||||
//还原位置
|
||||
resetPosition()
|
||||
}
|
||||
})
|
||||
|
||||
}
|
||||
// 获取曲线的路径
|
||||
const getCurvePath = (curve) => {
|
||||
let startPointX = (Number(curve.startPointX) + Number(curve.beginWidth) / 2) * radio.value
|
||||
let startPointY = (Number(curve.startPointY) + Number(curve.beginHigh) / 2) * radio.value
|
||||
let endPointX = (Number(curve.endPointX) + Number(curve.endWidth) / 2) * radio.value
|
||||
let endPointY = (Number(curve.endPointY) + Number(curve.endHigh) / 2) * radio.value
|
||||
|
||||
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 changeSizeRaio = (type) => {
|
||||
if(type<0 && (isSizeRaio.value + type) <= 0){
|
||||
if (type < 0 && isSizeRaio.value + type <= 0) {
|
||||
return
|
||||
}
|
||||
isSizeRaio.value += type
|
||||
}
|
||||
//图例状态
|
||||
const legendObj = reactive({
|
||||
driveLineShow:false,
|
||||
carShow:false,
|
||||
legendShow:true
|
||||
driveLineShow: false,
|
||||
carShow: false,
|
||||
legendShow: true
|
||||
})
|
||||
// 车辆是否显示
|
||||
const changCarShow = () => {
|
||||
@ -266,29 +350,39 @@ const changDriveLineShow = () => {
|
||||
legendObj.driveLineShow = !legendObj.driveLineShow
|
||||
}
|
||||
const toggleFullScreen = () => {
|
||||
var elem = document.getElementById("indexpage-container"); // 获取元素
|
||||
if (!document.fullscreenElement) { // 检查是否已经是全屏模式
|
||||
if (elem.requestFullscreen) { // 支持requestFullscreen API的标准方式
|
||||
elem.requestFullscreen().catch(err => {
|
||||
alert(`无法进入全屏模式: ${err.message}`); // 处理错误情况
|
||||
});
|
||||
} else if (elem.mozRequestFullScreen) { // 旧版Firefox的API名称(已废弃)
|
||||
elem.mozRequestFullScreen();
|
||||
} else if (elem.webkitRequestFullscreen) { // WebKit/Safari/Chrome的API名称(已废弃)
|
||||
elem.webkitRequestFullscreen();
|
||||
} else if (elem.msRequestFullscreen) { // IE/Edge的API名称(已废弃)
|
||||
elem.msRequestFullscreen();
|
||||
var elem = document.getElementById('indexpage-container') // 获取元素
|
||||
if (!document.fullscreenElement) {
|
||||
// 检查是否已经是全屏模式
|
||||
if (elem.requestFullscreen) {
|
||||
// 支持requestFullscreen API的标准方式
|
||||
elem.requestFullscreen().catch((err) => {
|
||||
alert(`无法进入全屏模式: ${err.message}`) // 处理错误情况
|
||||
})
|
||||
} else if (elem.mozRequestFullScreen) {
|
||||
// 旧版Firefox的API名称(已废弃)
|
||||
elem.mozRequestFullScreen()
|
||||
} else if (elem.webkitRequestFullscreen) {
|
||||
// WebKit/Safari/Chrome的API名称(已废弃)
|
||||
elem.webkitRequestFullscreen()
|
||||
} else if (elem.msRequestFullscreen) {
|
||||
// IE/Edge的API名称(已废弃)
|
||||
elem.msRequestFullscreen()
|
||||
}
|
||||
isDrag.value = true
|
||||
} else { // 退出全屏模式
|
||||
if (document.exitFullscreen) { // 标准API退出全屏模式
|
||||
document.exitFullscreen();
|
||||
} else if (document.mozCancelFullScreen) { // 旧版Firefox的API名称(已废弃)
|
||||
document.mozCancelFullScreen();
|
||||
} else if (document.webkitExitFullscreen) { // WebKit/Safari/Chrome的API名称(已废弃)
|
||||
document.webkitExitFullscreen();
|
||||
} else if (document.msExitFullscreen) { // IE/Edge的API名称(已废弃)
|
||||
document.msExitFullscreen();
|
||||
} else {
|
||||
// 退出全屏模式
|
||||
if (document.exitFullscreen) {
|
||||
// 标准API退出全屏模式
|
||||
document.exitFullscreen()
|
||||
} else if (document.mozCancelFullScreen) {
|
||||
// 旧版Firefox的API名称(已废弃)
|
||||
document.mozCancelFullScreen()
|
||||
} else if (document.webkitExitFullscreen) {
|
||||
// WebKit/Safari/Chrome的API名称(已废弃)
|
||||
document.webkitExitFullscreen()
|
||||
} else if (document.msExitFullscreen) {
|
||||
// IE/Edge的API名称(已废弃)
|
||||
document.msExitFullscreen()
|
||||
}
|
||||
console.log('退出全屏')
|
||||
isDrag.value = false
|
||||
@ -296,51 +390,51 @@ const toggleFullScreen = () => {
|
||||
}
|
||||
// 监听全屏状态变化事件
|
||||
document.addEventListener('fullscreenchange', function () {
|
||||
if (!document.fullscreenElement) {
|
||||
console.log('已退出全屏模式');
|
||||
// 在这里可以添加退出全屏后的逻辑
|
||||
isDrag.value = false
|
||||
resetPosition()
|
||||
} else {
|
||||
console.log('已进入全屏模式');
|
||||
// 在这里可以添加进入全屏后的逻辑
|
||||
isDrag.value = true
|
||||
}
|
||||
});
|
||||
if (!document.fullscreenElement) {
|
||||
console.log('已退出全屏模式')
|
||||
// 在这里可以添加退出全屏后的逻辑
|
||||
isDrag.value = false
|
||||
resetPosition()
|
||||
} else {
|
||||
console.log('已进入全屏模式')
|
||||
// 在这里可以添加进入全屏后的逻辑
|
||||
isDrag.value = true
|
||||
}
|
||||
})
|
||||
|
||||
// 监听旧版浏览器的全屏状态变化事件
|
||||
document.addEventListener('mozfullscreenchange', function () {
|
||||
if (!document.mozFullScreenElement) {
|
||||
console.log('已退出全屏模式 (Firefox旧版)');
|
||||
isDrag.value = false
|
||||
resetPosition()
|
||||
} else {
|
||||
console.log('已进入全屏模式 (Firefox旧版)');
|
||||
isDrag.value = true
|
||||
}
|
||||
});
|
||||
// 监听旧版浏览器的全屏状态变化事件
|
||||
document.addEventListener('mozfullscreenchange', function () {
|
||||
if (!document.mozFullScreenElement) {
|
||||
console.log('已退出全屏模式 (Firefox旧版)')
|
||||
isDrag.value = false
|
||||
resetPosition()
|
||||
} else {
|
||||
console.log('已进入全屏模式 (Firefox旧版)')
|
||||
isDrag.value = true
|
||||
}
|
||||
})
|
||||
|
||||
document.addEventListener('webkitfullscreenchange', function () {
|
||||
if (!document.webkitFullscreenElement) {
|
||||
console.log('已退出全屏模式 (WebKit旧版)');
|
||||
isDrag.value = false
|
||||
resetPosition()
|
||||
} else {
|
||||
console.log('已进入全屏模式 (WebKit旧版)');
|
||||
isDrag.value = true
|
||||
}
|
||||
});
|
||||
document.addEventListener('webkitfullscreenchange', function () {
|
||||
if (!document.webkitFullscreenElement) {
|
||||
console.log('已退出全屏模式 (WebKit旧版)')
|
||||
isDrag.value = false
|
||||
resetPosition()
|
||||
} else {
|
||||
console.log('已进入全屏模式 (WebKit旧版)')
|
||||
isDrag.value = true
|
||||
}
|
||||
})
|
||||
|
||||
document.addEventListener('msfullscreenchange', function () {
|
||||
if (!document.msFullscreenElement) {
|
||||
console.log('已退出全屏模式 (IE/Edge旧版)');
|
||||
isDrag.value = false
|
||||
resetPosition()
|
||||
} else {
|
||||
console.log('已进入全屏模式 (IE/Edge旧版)');
|
||||
isDrag.value = true
|
||||
}
|
||||
});
|
||||
document.addEventListener('msfullscreenchange', function () {
|
||||
if (!document.msFullscreenElement) {
|
||||
console.log('已退出全屏模式 (IE/Edge旧版)')
|
||||
isDrag.value = false
|
||||
resetPosition()
|
||||
} else {
|
||||
console.log('已进入全屏模式 (IE/Edge旧版)')
|
||||
isDrag.value = true
|
||||
}
|
||||
})
|
||||
}
|
||||
//获取地图区域
|
||||
const getList = async () => {
|
||||
@ -399,25 +493,25 @@ const getPositionMapListFun = async (positionMapId) => {
|
||||
console.log(data)
|
||||
pointList.value = data
|
||||
|
||||
console.log(pointList.value)
|
||||
let lineStyle = calculateDistanceAndAngle(
|
||||
{
|
||||
left: pointList.value[0].locationX,
|
||||
top: pointList.value[0].locationY
|
||||
},
|
||||
{
|
||||
left: pointList.value[1].locationX,
|
||||
top: pointList.value[1].locationY
|
||||
}
|
||||
)
|
||||
console.log(lineStyle)
|
||||
lineList.value = [
|
||||
{
|
||||
...lineStyle,
|
||||
color: '#1677ff',
|
||||
height: 2
|
||||
}
|
||||
]
|
||||
// console.log(pointList.value)
|
||||
// let lineStyle = calculateDistanceAndAngle(
|
||||
// {
|
||||
// left: pointList.value[0].locationX,
|
||||
// top: pointList.value[0].locationY
|
||||
// },
|
||||
// {
|
||||
// left: pointList.value[1].locationX,
|
||||
// top: pointList.value[1].locationY
|
||||
// }
|
||||
// )
|
||||
// console.log(lineStyle)
|
||||
// lineList.value = [
|
||||
// {
|
||||
// ...lineStyle,
|
||||
// color: '#1677ff',
|
||||
// height: 2
|
||||
// }
|
||||
// ]
|
||||
}
|
||||
const draggableElement = ref(null)
|
||||
const resetPosition = () => {
|
||||
@ -505,6 +599,7 @@ const getMapData = async (item) => {
|
||||
})
|
||||
imgUrl.value = data
|
||||
computedRatio()
|
||||
getMapLineList()
|
||||
}
|
||||
const heightVal = ref(0)
|
||||
const widthVal = ref(0)
|
||||
@ -563,6 +658,13 @@ const computedRatio = () => {
|
||||
})
|
||||
}
|
||||
|
||||
const getMapLineList = () => {
|
||||
MapApi.mapLineListGet({ positionMapId: nowObject.value.id }).then((res) => {
|
||||
console.log(res)
|
||||
lineList.value = res
|
||||
})
|
||||
}
|
||||
|
||||
const getImageSize = (url) => {
|
||||
return new Promise((resolve, reject) => {
|
||||
const img = new Image()
|
||||
@ -827,7 +929,7 @@ onUnmounted(() => {
|
||||
color: #98a4bf;
|
||||
margin-right: 2px;
|
||||
}
|
||||
.affix-container-right{
|
||||
.affix-container-right {
|
||||
position: fixed;
|
||||
z-index: 999;
|
||||
right: 40px;
|
||||
@ -836,7 +938,7 @@ onUnmounted(() => {
|
||||
align-items: center;
|
||||
justify-content: flex-end;
|
||||
}
|
||||
.affix-container-right-item{
|
||||
.affix-container-right-item {
|
||||
width: 28px;
|
||||
height: 28px;
|
||||
cursor: pointer;
|
||||
|
Loading…
Reference in New Issue
Block a user