forked from github/dataease
Merge pull request #11175 from dataease/pr@dev-v2@refactor_hidden-pop
refactor(数据大屏): 隐藏区域点击增加选中边框提示
This commit is contained in:
commit
ddba599c62
core/core-frontend/src
@ -19,6 +19,10 @@ const props = defineProps({
|
|||||||
type: Boolean,
|
type: Boolean,
|
||||||
default: false
|
default: false
|
||||||
},
|
},
|
||||||
|
popActive: {
|
||||||
|
type: Boolean,
|
||||||
|
default: false
|
||||||
|
},
|
||||||
canvasStyleData: {
|
canvasStyleData: {
|
||||||
type: Object,
|
type: Object,
|
||||||
required: true
|
required: true
|
||||||
@ -192,10 +196,6 @@ const onPointClick = param => {
|
|||||||
emits('onPointClick', param)
|
emits('onPointClick', param)
|
||||||
}
|
}
|
||||||
|
|
||||||
const innerOutActive = computed(() => {
|
|
||||||
return config.value.category === 'hidden' && showPosition.value === 'popEdit'
|
|
||||||
})
|
|
||||||
|
|
||||||
const deepScale = computed(() => scale.value / 100)
|
const deepScale = computed(() => scale.value / 100)
|
||||||
</script>
|
</script>
|
||||||
|
|
||||||
@ -232,7 +232,7 @@ const deepScale = computed(() => scale.value / 100)
|
|||||||
:style="{ color: config.commonBackground.innerImageColor }"
|
:style="{ color: config.commonBackground.innerImageColor }"
|
||||||
:name="commonBackgroundSvgInner"
|
:name="commonBackgroundSvgInner"
|
||||||
></Board>
|
></Board>
|
||||||
<div class="wrapper-inner-adaptor" :class="{ 'pop-wrapper-inner': innerOutActive }">
|
<div class="wrapper-inner-adaptor" :class="{ 'pop-wrapper-inner': popActive }">
|
||||||
<component
|
<component
|
||||||
:is="findComponent(config['component'])"
|
:is="findComponent(config['component'])"
|
||||||
:view="viewInfo"
|
:view="viewInfo"
|
||||||
|
@ -18,6 +18,7 @@
|
|||||||
:config="item"
|
:config="item"
|
||||||
:index="index"
|
:index="index"
|
||||||
:dv-info="dvInfo"
|
:dv-info="dvInfo"
|
||||||
|
:pop-active="curActive(item)"
|
||||||
:show-position="showPosition"
|
:show-position="showPosition"
|
||||||
:style="customPopStyle"
|
:style="customPopStyle"
|
||||||
:scale="innerScale"
|
:scale="innerScale"
|
||||||
@ -49,6 +50,7 @@ import { snapshotStoreWithOut } from '@/store/modules/data-visualization/snapsho
|
|||||||
import eventBus from '@/utils/eventBus'
|
import eventBus from '@/utils/eventBus'
|
||||||
import ComponentWrapper from '@/components/data-visualization/canvas/ComponentWrapper.vue'
|
import ComponentWrapper from '@/components/data-visualization/canvas/ComponentWrapper.vue'
|
||||||
import { ElMessage } from 'element-plus-secondary'
|
import { ElMessage } from 'element-plus-secondary'
|
||||||
|
import { storeToRefs } from 'pinia'
|
||||||
const dvMainStore = dvMainStoreWithOut()
|
const dvMainStore = dvMainStoreWithOut()
|
||||||
const snapshotStore = snapshotStoreWithOut()
|
const snapshotStore = snapshotStoreWithOut()
|
||||||
const areaActive = ref(false)
|
const areaActive = ref(false)
|
||||||
@ -91,6 +93,7 @@ const props = defineProps({
|
|||||||
})
|
})
|
||||||
|
|
||||||
const { canvasStyleData, popComponentData, canvasViewInfo, scale, canvasState } = toRefs(props)
|
const { canvasStyleData, popComponentData, canvasViewInfo, scale, canvasState } = toRefs(props)
|
||||||
|
const { curComponent } = storeToRefs(dvMainStore)
|
||||||
const baseStyle = computed(() => {
|
const baseStyle = computed(() => {
|
||||||
return {
|
return {
|
||||||
fontSize: 30 * props.scale + 'px',
|
fontSize: 30 * props.scale + 'px',
|
||||||
@ -102,6 +105,10 @@ const innerScale = computed(() =>
|
|||||||
props.showPosition === 'preview' ? props.scale : props.scale * 100
|
props.showPosition === 'preview' ? props.scale : props.scale * 100
|
||||||
)
|
)
|
||||||
|
|
||||||
|
const curActive = item => {
|
||||||
|
return curComponent.value?.id === item.id && props.showPosition === 'popEdit'
|
||||||
|
}
|
||||||
|
|
||||||
const handleDragOver = e => {
|
const handleDragOver = e => {
|
||||||
areaActive.value = true
|
areaActive.value = true
|
||||||
e.preventDefault()
|
e.preventDefault()
|
||||||
|
Loading…
Reference in New Issue
Block a user