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" @collapse="collapsedHandle"
@expand="expandHandle" @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-tabs v-if="!selectTarget" class="tabs-box" size="small" type="segment">
<n-tab-pane <n-tab-pane
@ -160,7 +160,7 @@ const chartsTabList = [
</script> </script>
<style lang="scss" scoped> <style lang="scss" scoped>
@include go(content-layers) { @include go(content-configurations) {
overflow: hidden; overflow: hidden;
.tabs-box { .tabs-box {
padding: 10px; padding: 10px;

View File

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