github/go-view
4
0
Fork 0
mirror of https://gitee.com/dromara/go-view.git synced 2026-05-12 00:00:01 +08:00
Code Issues Packages Projects Releases Wiki Activity

Merge branch 'dev' into master-fetch-dev

Browse Source
This commit is contained in:
奔跑的面条
2023-07-08 22:01:54 +08:00
parent 3da84b2fa2 e979149cfb
commit d2af67d6ad
15 changed files with 689 additions and 357 deletions
Download Patch File Download Diff File Expand all files Collapse all files
src/views/chart/ContentConfigurations/components/ChartData/components/ChartDataAjax/index.vue
+5 -1
View File
@@ -131,7 +131,11 @@ const sendHandle = async () => {
loading.value = false
if (res) {
const { data } = res
if (!data && !targetData.value.filter) window['$message'].warning('您的数据不符合默认格式，请配置过滤器！')
if (!data && !targetData.value.filter) {
window['$message'].warning('您的数据不符合默认格式，请配置过滤器！')
showMatching.value = true
return
}
targetData.value.option.dataset = newFunctionHandle(data, res, targetData.value.filter)
showMatching.value = true
return
src/views/chart/ContentConfigurations/components/ChartData/components/ChartDataPond/index.vue
+5 -1
View File
@@ -117,7 +117,11 @@ const sendHandle = async () => {
const res = await customizeHttp(toRaw(targetData.value.request), toRaw(chartEditStore.getRequestGlobalConfig))
loading.value = false
if (res) {
if (!res?.data && !targetData.value.filter) window['$message'].warning('您的数据不符合默认格式，请配置过滤器！')
if (!res?.data && !targetData.value.filter) {
window['$message'].warning('您的数据不符合默认格式，请配置过滤器！')
showMatching.value = true
return
}
targetData.value.option.dataset = newFunctionHandle(res?.data, res, targetData.value.filter)
showMatching.value = true
return
src/views/chart/ContentEdit/components/EditRule/index.vue
+4 -2
View File
@@ -159,9 +159,11 @@ const dragCanvas = (e: any) => {
const canvasBox = () => {
const layoutDom = document.getElementById('go-chart-edit-layout')
if (layoutDom) {
// 此处减去滚动条的宽度和高度
const scrollW = 20
return {
height: layoutDom.clientHeight - 25,
width: layoutDom.clientWidth
height: layoutDom.clientHeight - scrollW,
width: layoutDom.clientWidth - scrollW
}
}
return {
src/views/preview/hooks/useScale.hook.ts
+101 -67
View File
@@ -13,7 +13,33 @@ export const useScale = (localStorageInfo: ChartEditStorageType) => {
const height = ref(localStorageInfo.editCanvasConfig.height)
const scaleRef = ref({ width: 1, height: 1 })
provide(SCALE_KEY, scaleRef);
provide(SCALE_KEY, scaleRef)
// 监听鼠标滚轮 +ctrl 键
const useAddWheelHandle = (removeEvent: Function) => {
addEventListener(
'wheel',
(e: any) => {
if (window?.$KeyboardActive?.ctrl) {
e.preventDefault()
e.stopPropagation()
removeEvent()
const fitDom = document.querySelector(".go-preview.fit") as HTMLElement
if (fitDom) fitDom.style.overflow = 'auto'
const transform = previewRef.value.style.transform
// 使用正则解析 scale(1, 1) 中的两个数值
const regRes = transform.match(/scale\((\d+\.?\d*)*/) as RegExpMatchArray
const width = regRes[1]
if (e.wheelDelta > 0) {
previewRef.value.style.transform = `scale(${parseFloat(Number(width).toFixed(2)) + 0.1})`
} else {
previewRef.value.style.transform = `scale(${parseFloat(Number(width).toFixed(2)) - 0.1})`
}
}
},
{ passive: false }
)
}
const updateScaleRef = (scale: { width: number; height: number }) => {
// 这里需要解构，保证赋值给scaleRef的为一个新对象
@@ -24,74 +50,82 @@ export const useScale = (localStorageInfo: ChartEditStorageType) => {
// 屏幕适配
onMounted(() => {
switch (localStorageInfo.editCanvasConfig.previewScaleType) {
case PreviewScaleEnum.FIT: (() => {
const { calcRate, windowResize, unWindowResize } = usePreviewFitScale(
width.value as number,
height.value as number,
previewRef.value,
updateScaleRef
)
calcRate()
windowResize()
onUnmounted(() => {
unWindowResize()
})
})()
break;
case PreviewScaleEnum.SCROLL_Y: (() => {
const { calcRate, windowResize, unWindowResize } = usePreviewScrollYScale(
width.value as number,
height.value as number,
previewRef.value,
(scale) => {
const dom = entityRef.value
dom.style.width = `${width.value * scale.width}px`
dom.style.height = `${height.value * scale.height}px`
updateScaleRef(scale)
}
)
calcRate()
windowResize()
onUnmounted(() => {
unWindowResize()
})
})()
case PreviewScaleEnum.FIT:
;(() => {
const { calcRate, windowResize, unWindowResize } = usePreviewFitScale(
width.value as number,
height.value as number,
previewRef.value,
updateScaleRef
)
calcRate()
windowResize()
useAddWheelHandle(unWindowResize)
onUnmounted(() => {
unWindowResize()
})
})()
break
case PreviewScaleEnum.SCROLL_Y:
;(() => {
const { calcRate, windowResize, unWindowResize } = usePreviewScrollYScale(
width.value as number,
height.value as number,
previewRef.value,
scale => {
const dom = entityRef.value
dom.style.width = `${width.value * scale.width}px`
dom.style.height = `${height.value * scale.height}px`
updateScaleRef(scale)
}
)
calcRate()
windowResize()
useAddWheelHandle(unWindowResize)
onUnmounted(() => {
unWindowResize()
})
})()
break;
case PreviewScaleEnum.SCROLL_X: (() => {
const { calcRate, windowResize, unWindowResize } = usePreviewScrollXScale(
width.value as number,
height.value as number,
previewRef.value,
(scale) => {
const dom = entityRef.value
dom.style.width = `${width.value * scale.width}px`
dom.style.height = `${height.value * scale.height}px`
updateScaleRef(scale)
}
)
calcRate()
windowResize()
onUnmounted(() => {
unWindowResize()
})
})()
break
case PreviewScaleEnum.SCROLL_X:
;(() => {
const { calcRate, windowResize, unWindowResize } = usePreviewScrollXScale(
width.value as number,
height.value as number,
previewRef.value,
scale => {
const dom = entityRef.value
dom.style.width = `${width.value * scale.width}px`
dom.style.height = `${height.value * scale.height}px`
updateScaleRef(scale)
}
)
calcRate()
windowResize()
useAddWheelHandle(unWindowResize)
onUnmounted(() => {
unWindowResize()
})
})()
break;
case PreviewScaleEnum.FULL: (() => {
const { calcRate, windowResize, unWindowResize } = usePreviewFullScale(
width.value as number,
height.value as number,
previewRef.value,
updateScaleRef
)
calcRate()
windowResize()
onUnmounted(() => {
unWindowResize()
})
})()
break;
break
case PreviewScaleEnum.FULL:
;(() => {
const { calcRate, windowResize, unWindowResize } = usePreviewFullScale(
width.value as number,
height.value as number,
previewRef.value,
updateScaleRef
)
calcRate()
windowResize()
useAddWheelHandle(unWindowResize)
onUnmounted(() => {
unWindowResize()
})
})()
break
}
})
src/views/preview/suspenseIndex.vue
+4 -1
View File
@@ -30,7 +30,7 @@
import { computed } from 'vue'
import { PreviewRenderList } from './components/PreviewRenderList'
import { getFilterStyle, setTitle } from '@/utils'
import { getEditCanvasConfigStyle, getSessionStorageInfo } from './utils'
import { getEditCanvasConfigStyle, getSessionStorageInfo, keyRecordHandle } from './utils'
import { useComInstall } from './hooks/useComInstall.hook'
import { useScale } from './hooks/useScale.hook'
import { useStore } from './hooks/useStore.hook'
@@ -60,6 +60,9 @@ const showEntity = computed(() => {
useStore(chartEditStore)
const { entityRef, previewRef } = useScale(chartEditStore)
const { show } = useComInstall(chartEditStore)
// 开启键盘监听
keyRecordHandle()
</script>
<style lang="scss" scoped>
src/views/preview/utils/index.ts
+3 -2
View File
@@ -1,2 +1,3 @@
export * from './style'
export * from './storage'
export * from './style'
export * from './storage'
export * from './keyboard'
src/views/preview/utils/keyboard.ts
+32
View File
@@ -0,0 +1,32 @@
// 处理键盘记录
export const keyRecordHandle = () => {
// 默认赋值
window.$KeyboardActive = {
ctrl: false,
space: false
}
document.onkeydown = (e: KeyboardEvent) => {
const { keyCode } = e
if (keyCode == 32 && e.target == document.body) e.preventDefault()
if ([17, 32].includes(keyCode) && window.$KeyboardActive) {
switch (keyCode) {
case 17: window.$KeyboardActive.ctrl = true; break
case 32: window.$KeyboardActive.space = true; break
}
}
}
document.onkeyup = (e: KeyboardEvent) => {
const { keyCode } = e
if (keyCode == 32 && e.target == document.body) e.preventDefault()
if ([17, 32].includes(keyCode) && window.$KeyboardActive) {
switch (keyCode) {
case 17: window.$KeyboardActive.ctrl = false; break
case 32: window.$KeyboardActive.space = false; break
}
}
}
}