fix: 解决锁定时,修改模块隐藏展示,标尺不会自适应的问题

This commit is contained in:
奔跑的面条 2022-11-05 21:16:34 +08:00
parent bd53d80d26
commit 86c206c3c6
2 changed files with 39 additions and 13 deletions

View File

@ -14,7 +14,7 @@
@collapse="collapsedHandle"
@expand="expandHandle"
>
<content-box class="go-content-layers go-boderbox" :show-top="false" :depth="2">
<content-box class="go-content-configurations go-boderbox" :show-top="false" :depth="2">
<!-- 页面配置 -->
<n-tabs v-if="!selectTarget" class="tabs-box" size="small" type="segment">
<n-tab-pane
@ -160,7 +160,7 @@ const chartsTabList = [
</script>
<style lang="scss" scoped>
@include go(content-layers) {
@include go(content-configurations) {
overflow: hidden;
.tabs-box {
padding: 10px;

View File

@ -12,14 +12,18 @@
</template>
<script setup lang="ts">
import { ref, toRefs, computed, watch } from 'vue'
import { ref, toRefs, computed, watch, nextTick, onBeforeUnmount } from 'vue'
import { useChartEditStore } from '@/store/modules/chartEditStore/chartEditStore'
import { useDesignStore } from '@/store/modules/designStore/designStore'
import { useChartLayoutStore } from '@/store/modules/chartLayoutStore/chartLayoutStore'
const chartEditStore = useChartEditStore()
const chartLayoutStore = useChartLayoutStore()
const designStore = useDesignStore()
const { width, height } = toRefs(chartEditStore.getEditCanvasConfig)
const { scale, lockScale } = toRefs(chartEditStore.getEditCanvas)
const { getLayers, getCharts, getDetails } = toRefs(chartLayoutStore)
const configShow = ref(true)
@ -49,25 +53,47 @@ const canvasBox = () => {
}
}
const scale = computed(() => {
return chartEditStore.getEditCanvas.scale
})
//
const themeColor = computed(() => {
return designStore.getAppTheme
})
//
watch(
() => scale.value,
() => {
const ruleChangeHandle = () => {
configShow.value = false
setTimeout(() => {
configShow.value = true
})
}
const ruleChangeHandleTimeOut = () => {
if (lockScale.value) {
setTimeout(() => {
ruleChangeHandle()
}, 500)
}
}
watch(
() => scale.value,
() => ruleChangeHandle()
)
watch(
() => getLayers.value,
() => ruleChangeHandleTimeOut()
)
watch(
() => getCharts.value,
() => ruleChangeHandleTimeOut()
)
watch(
() => getDetails.value,
() => ruleChangeHandleTimeOut()
)
</script>
<style>