center/dataease-dm
center/dataease-dm
13
0
Fork 0
forked from github/dataease
Code Pull Requests Activity

Merge branch 'dev-v2' into pr@dev-v2_dzz

Browse Source
This commit is contained in:
dataeaseShu 2023-12-18 16:16:58 +08:00
commit c50ef171f3
17 changed files with 172 additions and 40 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

8
core/core-frontend/src/components/data-visualization/RealTimeGroup.vue
View File

@ -67,6 +67,12 @@ const shiftDataPush = curClickIndex => {
}
const onClick = (e, index) => {
setCurComponent(index)
//其他情况点击清理选择区域
areaData.value.components.splice(0, areaData.value.components.length)
}
const onClickBack = (e, index) => {
// 初始化点击是 laterIndex=0
if (!curComponent.value) {
composeStore.setLaterIndex(null)
@ -365,7 +371,7 @@ const handleContextMenu = e => {
font-size: 12px;
margin-left: 10px;
position: relative;
min-width: 65px;
min-width: 43px;
white-space: nowrap;
overflow: hidden;
text-overflow: ellipsis;

12
core/core-frontend/src/components/data-visualization/canvas/CanvasCore.vue
View File

@ -1185,7 +1185,9 @@ const userViewEnlargeOpen = (opt, item) => {
}
const initSnapshotTimer = () => {
console.log('check1==')
snapshotTimer.value = setInterval(() => {
console.log('check2==')
snapshotStore.snapshotCatchToStore()
}, 1000)
}
@ -1203,6 +1205,14 @@ const linkageSetOpen = item => {
})
}
const contextMenuShow = computed(() => {
if (curComponent.value) {
return curComponent.value.canvasId === canvasId.value
} else {
return isMainCanvas(canvasId.value)
}
})
const markLineShow = computed(() => isMainCanvas(canvasId.value))
onMounted(() => {
@ -1333,7 +1343,7 @@ defineExpose({
/>
</Shape>
<!-- 右击菜单 -->
<ContextMenu show-position="canvasCore" />
<ContextMenu v-if="contextMenuShow" show-position="canvasCore" />
<!-- 标线 -->
<MarkLine v-if="markLineShow" />
<!-- 选中区域 -->

7
core/core-frontend/src/components/data-visualization/canvas/ContextMenuDetails.vue
View File

@ -9,6 +9,7 @@ import { storeToRefs } from 'pinia'
import { computed, toRefs } from 'vue'
import { ElDivider } from 'element-plus-secondary'
import eventBus from '@/utils/eventBus'
import { getCurInfo } from '@/store/modules/data-visualization/common'
const dvMainStore = dvMainStoreWithOut()
const copyStore = copyStoreWithOut()
const lockStore = lockStoreWithOut()
@ -52,7 +53,8 @@ const menuOpt = optName => {
}
const cut = () => {
copyStore.cut()
const curInfo = getCurInfo()
copyStore.cut(curInfo.componentData)
menuOpt('cut')
}
@ -85,7 +87,8 @@ const paste = () => {
const deleteComponent = () => {
if (curComponent.value) {
dvMainStore.deleteComponentById(curComponent.value?.id)
const curInfo = getCurInfo()
dvMainStore.deleteComponentById(curComponent.value?.id, curInfo.componentData)
} else if (areaData.value.components.length) {
areaData.value.components.forEach(component => {
dvMainStore.deleteComponentById(component.id)

11
core/core-frontend/src/components/data-visualization/canvas/Shape.vue
View File

@ -454,6 +454,17 @@ const handleMouseDownOnShape = e => {
) {
emit('onDragging', e)
}
//如果当前组件是Group分组 则要进行内部组件深度计算
element.value.component === 'Group' && groupSizeStyleAdaptor(element.value)
//如果当前画布是Group内部画布 则对应组件定位在resize时要还原到groupStyle中
if (isGroupCanvas(canvasId.value)) {
groupStyleRevert(element.value, {
width: parentNode.value.offsetWidth,
height: parentNode.value.offsetHeight
})
}
// 防止首次组件在tab旁边无法触发矩阵移动
if (isFirst) {
isFirst = false

29
core/core-frontend/src/store/modules/data-visualization/common.ts Normal file
View File

@ -0,0 +1,29 @@
import { storeToRefs } from 'pinia'
import { dvMainStoreWithOut } from './dvMain'
const dvMainStore = dvMainStoreWithOut()
const { curComponent, componentData } = storeToRefs(dvMainStore)
export const getCurInfo = () => {
if (curComponent.value) {
const curComponentId = curComponent.value.id
let curIndex = 0
let curComponentData = componentData.value
componentData.value.forEach((component, index) => {
if (curComponentId === component.id) {
curIndex = index
}
if (component.component === 'Group') {
component.propValue.forEach((subComponent, subIndex) => {
if (curComponentId === subComponent.id) {
curIndex = subIndex
curComponentData = component.propValue
}
})
}
})
return {
index: curIndex,
componentData: curComponentData
}
}
}

6
core/core-frontend/src/store/modules/data-visualization/compose.ts
View File

@ -84,8 +84,12 @@ export const composeStore = defineStore('compose', {
}
})
const newId = generateID()
components.forEach(component => {
component.canvasId = 'Group-' + newId
})
const groupComponent = {
id: generateID(),
id: newId,
component: 'Group',
name: '组合',
label: '组合',

7
core/core-frontend/src/store/modules/data-visualization/copy.ts
View File

@ -18,7 +18,8 @@ const {
curMultiplexingComponents,
dvInfo,
pcMatrixCount,
canvasStyleData
canvasStyleData,
componentData
} = storeToRefs(dvMainStore)
const { menuTop, menuLeft } = storeToRefs(contextmenuStore)
@ -119,10 +120,10 @@ export const copyStore = defineStore('copy', {
}, moveTime)
snapshotStore.recordSnapshotCache()
},
cut() {
cut(curComponentData = componentData.value) {
if (curComponent.value) {
this.copyDataInfo([curComponent.value])
dvMainStore.deleteComponentById(curComponent.value.id)
dvMainStore.deleteComponentById(curComponent.value.id, curComponentData)
} else if (composeStore.areaData.components.length) {
this.copyDataInfo(composeStore.areaData.components)
composeStore.areaData.components.forEach(component => {

45
core/core-frontend/src/store/modules/data-visualization/layer.ts
View File

@ -3,44 +3,61 @@ import { store } from '../../index'
import { dvMainStoreWithOut } from './dvMain'
import { swap } from '@/utils/utils'
import { useEmitt } from '@/hooks/web/useEmitt'
import { getCurInfo } from '@/store/modules/data-visualization/common'
const dvMainStore = dvMainStoreWithOut()
const { componentData, curComponentIndex, curComponent } = storeToRefs(dvMainStore)
const { curComponentIndex, curComponent } = storeToRefs(dvMainStore)
export const layerStore = defineStore('layer', {
actions: {
upComponent() {
const curInfo = getCurInfo()
if (curInfo) {
const { index, componentData } = curInfo
// 上移图层 index，表示元素在数组中越往后
if (curComponentIndex.value < componentData.value.length - 1) {
swap(componentData.value, curComponentIndex.value, curComponentIndex.value + 1)
curComponentIndex.value = curComponentIndex.value + 1
if (index < componentData.length - 1) {
swap(componentData, index, index + 1)
curComponentIndex.value = index + 1
}
}
},
downComponent() {
const curInfo = getCurInfo()
if (curInfo) {
const { index, componentData } = curInfo
// 下移图层 index，表示元素在数组中越往前
if (curComponentIndex.value > 0) {
swap(componentData.value, curComponentIndex.value, curComponentIndex.value - 1)
curComponentIndex.value = curComponentIndex.value - 1
if (index > 0) {
swap(componentData, index, index - 1)
curComponentIndex.value = index - 1
}
}
},
topComponent() {
// 置顶
if (curComponentIndex.value < componentData.value.length - 1) {
componentData.value.splice(curComponentIndex.value, 1)
componentData.value.push(curComponent.value)
curComponentIndex.value = componentData.value.length - 1
const curInfo = getCurInfo()
if (curInfo) {
const { index, componentData } = curInfo
if (index < componentData.length - 1) {
componentData.splice(curComponentIndex.value, 1)
componentData.push(curComponent.value)
curComponentIndex.value = componentData.length - 1
}
}
},
bottomComponent() {
// 置底
if (curComponentIndex.value > 0) {
componentData.value.splice(curComponentIndex.value, 1)
componentData.value.unshift(curComponent.value)
const curInfo = getCurInfo()
if (curInfo) {
const { index, componentData } = curInfo
if (index > 0) {
componentData.splice(index, 1)
componentData.unshift(curComponent.value)
curComponentIndex.value = 0
}
}
},
hideComponent() {

3
core/core-frontend/src/store/modules/user.ts
View File

@ -85,6 +85,9 @@ export const userStore = defineStore('user', {
this.oid = oid
},
setLanguage(language: string) {
if (!language || language === 'zh_CN') {
language = 'zh-CN'
}
wsCache.set('user.language', language)
this.language = language
locale.setLang(language)

26
core/core-frontend/src/utils/canvasUtils.ts
View File

@ -286,3 +286,29 @@ export function filterEmptyFolderTree(nodes) {
}
})
}
export function findParentIdByChildIdRecursive(tree, targetChildId) {
function findParentId(node, targetChildId) {
if (node.type === 'folder' && node.children) {
for (const childNode of node.children) {
if (childNode.id === targetChildId) {
return node.id // 找到匹配的子节点，返回其父节点的 ID
}
const parentId = findParentId(childNode, targetChildId)
if (parentId !== null) {
return parentId // 在子节点中找到匹配的父节点
}
}
}
return null // 没有找到匹配的子节点
}
for (const node of tree) {
const parentId = findParentId(node, targetChildId)
if (parentId !== null) {
return parentId // 在整个树中找到匹配的父节点
}
}
return null // 没有找到匹配的子节点
}

10
core/core-frontend/src/utils/changeComponentsSizeWithScale.ts
View File

@ -2,6 +2,7 @@ import { deepCopy } from './utils'
import { divide, multiply } from 'mathjs'
import { dvMainStoreWithOut } from '@/store/modules/data-visualization/dvMain'
import { storeToRefs } from 'pinia'
import { groupSizeStyleAdaptor } from '@/utils/style'
const dvMainStore = dvMainStoreWithOut()
const { componentData, curComponentIndex, canvasStyleData } = storeToRefs(dvMainStore)
@ -28,14 +29,7 @@ export function changeComponentsSizeWithScale(scale) {
// 计算逻辑 Group 中样式 * groupComponent.groupStyle[sonKey].
if (component.component === 'Group') {
try {
component.propValue.forEach(groupComponent => {
Object.keys(groupComponent.style).forEach(sonKey => {
if (groupComponent.groupStyle[sonKey]) {
groupComponent.style[sonKey] =
component.style[sonKey] * groupComponent.groupStyle[sonKey]
}
})
})
groupSizeStyleAdaptor(component)
} catch (e) {
// 旧Group适配
console.error('group adaptor error:' + e)

1
core/core-frontend/src/utils/decomposeComponent.ts
View File

@ -4,4 +4,5 @@ export default function decomposeComponent(component, editorRect, parentStyle) {
component.style.left = component.style.left + parentStyle.left
component.style.top = component.style.top + parentStyle.top
component.groupStyle = {}
component.canvasId = 'canvas-main'
}

2
core/core-frontend/src/utils/style.ts
View File

@ -228,7 +228,7 @@ export function groupSizeStyleAdaptor(groupComponent) {
groupComponent.propValue.forEach(component => {
// 分组还原逻辑
// 当发上分组缩放是，要将内部组件按照比例转换
const styleScale = { ...component.groupStyle }
const styleScale = component.groupStyle
component.style.left = parentStyle.width * styleScale.left
component.style.top = parentStyle.height * styleScale.top
component.style.width = parentStyle.width * styleScale.width

4
core/core-frontend/src/views/common/DeResourceGroupOpt.vue
View File

@ -276,7 +276,9 @@ const saveResource = () => {
ElMessage.success('保存成功')
if (cmd.value === 'copy') {
const baseUrl =
curCanvasType.value === 'dataV' ? '#/dvCanvas?dvId=' : '#/dashboard?resourceId='
curCanvasType.value === 'dataV'
? '#/dvCanvas?opt=copy&dvId='
: '#/dashboard?opt=copy&resourceId='
window.open(baseUrl + data.data, '_blank')
}
})

19
core/core-frontend/src/views/common/DeResourceTree.vue
View File

@ -1,6 +1,6 @@
<script setup lang="ts">
import { onMounted, reactive, ref, toRefs, watch, nextTick, computed } from 'vue'
import { deleteLogic } from '@/api/visualization/dataVisualization'
import { copyResource, deleteLogic, ResourceOrFolder } from '@/api/visualization/dataVisualization'
import { ElIcon, ElMessage, ElMessageBox, ElScrollbar } from 'element-plus-secondary'
import { Icon } from '@/components/icon-custom'
import { HandleMore } from '@/components/handle-more'
@ -17,6 +17,7 @@ import _ from 'lodash'
import DeResourceCreateOpt from '@/views/common/DeResourceCreateOpt.vue'
import DeResourceCreateOptV2 from '@/views/common/DeResourceCreateOptV2.vue'
import { useCache } from '@/hooks/web/useCache'
import { findParentIdByChildIdRecursive } from '@/utils/canvasUtils'
const { wsCache } = useCache()
const dvMainStore = dvMainStoreWithOut()
@ -232,7 +233,21 @@ const operation = (cmd: string, data: BusiTreeNode, nodeType: string) => {
} else if (cmd === 'edit') {
resourceEdit(data.id)
} else {
resourceGroupOpt.value.optInit(nodeType, data, cmd, ['copy'].includes(cmd))
const targetPid = findParentIdByChildIdRecursive(state.resourceTree, data.id)
const params: ResourceOrFolder = {
nodeType: nodeType as 'folder' | 'leaf',
name: data.name + '-copy',
type: curCanvasType.value,
id: data.id,
pid: targetPid || '0'
}
copyResource(params).then(data => {
const baseUrl =
curCanvasType.value === 'dataV'
? '#/dvCanvas?opt=copy&dvId='
: '#/dashboard?opt=copy&resourceId='
window.open(baseUrl + data.data, '_blank')
})
}
}

14
core/core-frontend/src/views/data-visualization/index.vue
View File

@ -41,8 +41,15 @@ const dvMainStore = dvMainStoreWithOut()
const snapshotStore = snapshotStoreWithOut()
const contextmenuStore = contextmenuStoreWithOut()
const composeStore = composeStoreWithOut()
const { componentData, curComponent, isClickComponent, canvasStyleData, canvasViewInfo, editMode } =
storeToRefs(dvMainStore)
const {
componentData,
curComponent,
isClickComponent,
canvasStyleData,
canvasViewInfo,
editMode,
dvInfo
} = storeToRefs(dvMainStore)
const { editorMap } = storeToRefs(composeStore)
const canvasOut = ref(null)
const canvasInner = ref(null)
@ -186,6 +193,9 @@ onMounted(() => {
state.canvasInitStatus = false
initCanvasData(dvId, 'dataV', function () {
state.canvasInitStatus = true
if (dvInfo.value && opt === 'copy') {
dvInfo.value.dataState = 'prepare'
}
// afterInit
nextTick(() => {
dvMainStore.setDataPrepareState(true)

2
de-xpack

@ -1 +1 @@
Subproject commit 79da01c6f46aec7b0d3e5920213fe866a8a07678
Subproject commit dfc290223ffb39bcff839d43f5e828dbe647c730