Merge pull request #13786 from dataease/pr@dev-v2@fix_track-bar

style(数据大屏): 修改移动端数据大屏联动等悬浮按钮缩放定位问题
This commit is contained in:
王嘉豪
2024-12-03 18:20:26 +08:00
committed by GitHub
2 changed files with 16 additions and 5 deletions

View File

@@ -3,7 +3,7 @@
<el-dropdown :teleported="false" trigger="click">
<input id="input" ref="trackButton" type="button" hidden />
<template #dropdown>
<div>
<div :class="{ 'data-mobile': isDataVMobile }">
<el-dropdown-menu
class="track-menu"
:style="{ 'font-family': fontFamily }"
@@ -34,6 +34,11 @@ const props = defineProps({
type: Array,
required: true
},
isDataVMobile: {
type: Boolean,
required: false,
default: false
},
fontFamily: {
type: String,
required: false,
@@ -82,4 +87,8 @@ defineExpose({
:deep(.ed-popper[x-placement^='bottom']) {
margin-top: -80px !important;
}
.data-mobile {
zoom: 0.3;
}
</style>

View File

@@ -93,6 +93,8 @@ const isError = ref(false)
const errMsg = ref('')
const linkageActiveHistory = ref(false)
const dataVMobile = !isDashboard() && isMobile()
const state = reactive({
trackBarStyle: {
position: 'absolute',
@@ -383,10 +385,9 @@ const action = param => {
trackBarY = barStyleTemp.top
state.trackBarStyle.top = barStyleTemp.top + 'px'
}
if (!isDashboard() && isMobile()) {
state.trackBarStyle.left = trackBarX / props.scale + 'px'
state.trackBarStyle.top = trackBarY / props.scale + 'px'
state.trackBarStyle['zoom'] = props.scale
if (dataVMobile) {
state.trackBarStyle.left = trackBarX + 40 + 'px'
state.trackBarStyle.top = trackBarY + 70 + 'px'
} else {
state.trackBarStyle.left = trackBarX + 'px'
state.trackBarStyle.top = trackBarY + 'px'
@@ -600,6 +601,7 @@ onBeforeUnmount(() => {
ref="viewTrack"
:track-menu="trackMenu"
:font-family="fontFamily"
:is-data-v-mobile="dataVMobile"
class="track-bar"
:style="state.trackBarStyle"
@trackClick="trackClick"