build: 升级2.1.2

This commit is contained in:
奔跑的面条
2022-12-31 20:55:12 +08:00
11 changed files with 193 additions and 24 deletions
@@ -35,8 +35,12 @@ import { ref, reactive, onMounted, toRefs, watch, onUnmounted, computed } from '
import { listen } from 'dom-helpers'
import { useDesignStore } from '@/store/modules/designStore/designStore'
import { useChartEditStore } from '@/store/modules/chartEditStore/chartEditStore'
import { useChartLayoutStore } from '@/store/modules/chartLayoutStore/chartLayoutStore'
import { ChartLayoutStoreEnum } from '@/store/modules/chartLayoutStore/chartLayoutStore.d'
import throttle from 'lodash/throttle'
const chartEditStore = useChartEditStore()
const chartLayoutStore = useChartLayoutStore()
const designStore = useDesignStore()
const thick = 20
@@ -84,6 +88,7 @@ const themeColor = computed(() => {
return designStore.getAppTheme
})
// 处理鼠标拖动
const handleWheel = (e: any) => {
if (e.ctrlKey || e.metaKey) {
e.preventDefault()
@@ -102,6 +107,7 @@ const handleWheel = (e: any) => {
}
}
// 滚动条处理
const handleScroll = () => {
if (!$app.value) return
const screensRect = $app.value.getBoundingClientRect()
@@ -111,6 +117,7 @@ const handleScroll = () => {
startY.value = (screensRect.top + thick - canvasRect.top) / scale.value
}
// 拖拽处理
const dragCanvas = (e: any) => {
e.preventDefault()
e.stopPropagation()
@@ -148,6 +155,7 @@ const dragCanvas = (e: any) => {
})
}
// 计算画布大小
const canvasBox = () => {
const layoutDom = document.getElementById('go-chart-edit-layout')
if (layoutDom) {
@@ -162,7 +170,7 @@ const canvasBox = () => {
}
}
// 在位置不动的情况下重绘标尺
// 重绘标尺
const reDraw = () => {
sketchRuleReDraw.value = false
setTimeout(() => {
@@ -170,13 +178,6 @@ const reDraw = () => {
}, 10)
}
watch(
() => designStore.getDarkTheme,
() => {
reDraw()
}
)
// 滚动居中
const canvasPosCenter = () => {
const { width: containerWidth, height: containerHeight } = $container.value.getBoundingClientRect()
@@ -186,20 +187,32 @@ const canvasPosCenter = () => {
$app.value.scrollTop = containerHeight / 2 - height / 2
}
// 处理标尺重制大小
// 处理主题变化
watch(
() => designStore.getDarkTheme,
() => {
reDraw()
}
)
// // 处理标尺重制大小
watch(
() => scale.value,
(newValue, oldValue) => {
if (oldValue !== newValue) {
if (oldValue !== newValue && chartLayoutStore.getRePositionCanvas) {
chartLayoutStore.setItemUnHandle(ChartLayoutStoreEnum.RE_POSITION_CANVAS, false)
handleScroll()
chartEditStore.setScale(newValue)
setTimeout(() => {
canvasPosCenter()
}, 500)
reDraw()
}, 400)
} else {
throttle(reDraw, 20)
}
}
)
// 处理鼠标样式
watch(
() => isPressSpace.value,
newValue => {
@@ -93,7 +93,7 @@ watch(
position: absolute;
width: 100%;
height: 100%;
border-radius: 10px;
border-radius: 5px;
overflow: hidden;
}
.select-border {
@@ -107,7 +107,7 @@ watch(
.select-background {
top: 2px;
left: 2px;
opacity: 0.03;
opacity: 0.2;
background-color: v-bind('themeColor');
}
}
@@ -152,7 +152,7 @@ export const mousedownBoxSelect = (e: MouseEvent, item?: CreateComponentType | C
}
}
})
}, 20)
}, 30)
// 鼠标抬起
const mouseup = () => {