dongjunchuan/de
1
0
Fork 0
Code Issues Pull Requests Actions Packages Projects Releases Wiki Activity

Merge remote-tracking branch 'origin/dev-v2' into dev-v2

Browse Source
This commit is contained in:
jianneng-fit2cloud 2024-11-25 13:54:45 +08:00
commit 1e7a5fd433
14 changed files with 116 additions and 70 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

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

@ -131,7 +131,12 @@ import Icon from '@/components/icon-custom/src/Icon.vue'
import ComponentEditBar from '@/components/visualization/ComponentEditBar.vue'
import { useEmitt } from '@/hooks/web/useEmitt'
import ComposeShow from '@/components/data-visualization/canvas/ComposeShow.vue'
import { groupSizeStyleAdaptor, groupStyleRevert, groupStyleRevertBatch } from '@/utils/style'
import {
groupSizeStyleAdaptor,
groupStyleRevert,
groupStyleRevertBatch,
tabInnerStyleRevert
} from '@/utils/style'
import { isDashboard, isGroupCanvas, isMainCanvas, isTabCanvas } from '@/utils/canvasUtils'
import Board from '@/components/de-board/Board.vue'
import { activeWatermarkCheckUser, removeActiveWatermark } from '@/components/watermark/watermark'
@ -789,6 +794,12 @@ const handleMouseDownOnPoint = (point, e) => {
}
const up = () => {
// 如果内部组件保持尺寸时，这里在鼠标抬起时，重新计算一下内部组件占比
if (['DeTabs'].includes(element.value.component) && element.value.resizeInnerKeep) {
console.log('===test3==')
tabInnerStyleRevert(element.value)
}
dashboardActive.value && emit('onMouseUp')
element.value['resizing'] = false
document.removeEventListener('mousemove', move)
@ -982,6 +993,7 @@ const tabMoveInCheck = async () => {
for (const item of nodes) {
if (
item.className !== undefined &&
typeof item.className === 'string' &&
item.className.split(' ').includes('shape') &&
item.getAttribute('component-id') !== domId.value && // 去掉当前
item.getAttribute('tab-is-check') !== null &&

25
core/core-frontend/src/custom-component/common/CommonAttr.vue
View File

@ -89,6 +89,14 @@ const backgroundCustomShow = computed(() => {
!['CanvasBoard', 'CanvasIcon', 'CircleShape', 'RectShape'].includes(element.value.component))
)
})
const tabTitleShow = computed(() => {
return element.value && element.value.style && element.value.component === 'DeTabs'
})
const styleShow = computed(() => {
return element.value && element.value.style && element.value.component !== 'DeTabs'
})
onMounted(() => {
const erd = elementResizeDetectorMaker()
containerWidth.value = containerRef.value?.offsetWidth
@ -122,8 +130,23 @@ onMounted(() => {
/>
</el-collapse-item>
<slot></slot>
<collapse-switch-item
v-if="tabTitleShow"
v-model="element.style.showTabTitle"
@modelChange="val => onStyleAttrChange({ key: 'showTabTitle', value: val })"
:themes="themes"
title="Tab标签"
name="tabTitle"
class="common-style-area"
>
<common-style-set
@onStyleAttrChange="onStyleAttrChange"
:themes="themes"
:element="element"
></common-style-set>
</collapse-switch-item>
<el-collapse-item
v-if="element && element.style"
v-if="styleShow"
:effect="themes"
title="样式"
name="style"

12
core/core-frontend/src/custom-component/common/CommonStyleSet.vue
View File

@ -407,11 +407,6 @@ const backdropBlurList = [
{ name: '30', value: 'blur(30px)' }
]
const titleHideList = [
{ name: '隐藏', value: true },
{ name: '显示', value: false }
]
const styleForm = computed<any>(() => element.value.style)
const state = reactive({
fontSize: [],
@ -508,13 +503,6 @@ const styleOptionKeyArray = [
width: '90px',
icon: dvStyleOpacity
},
{
value: 'titleHide',
label: '标题样式',
customOption: titleHideList,
width: '90px',
icon: dvStyleTabHead
},
{
value: 'backdropFilter',
label: '背景模糊',

3
core/core-frontend/src/custom-component/component-list.ts
View File

@ -554,7 +554,8 @@ const list = [
headHorizontalPosition: 'left',
headFontColor: '#000000',
headFontActiveColor: '#000000',
titleHide: false
titleHide: false,
showTabTitle: true
}
},
{

19
core/core-frontend/src/custom-component/de-tabs/Component.vue
View File

@ -5,8 +5,8 @@
:class="[
headClass,
`ed-tabs-${curThemes}`,
{ 'title-hidde-tab': hideTitle },
{ 'title-show-tab': !hideTitle }
{ 'title-hidde-tab': !showTabTitleFlag },
{ 'title-show-tab': showTabTitleFlag }
]"
class="custom-tabs-head"
ref="tabComponentRef"
@ -19,7 +19,7 @@
:active-color="activeColor"
:border-color="noBorderColor"
:border-active-color="borderActiveColor"
:hide-title="hideTitle"
:hide-title="!showTabTitleFlag"
>
<template :key="tabItem.name" v-for="tabItem in element.propValue">
<el-tab-pane
@ -225,16 +225,11 @@ const editableTabsValue = ref(null)
const noBorderColor = ref('none')
let currentInstance
const hideTitle = computed(() => {
if (
element.value &&
element.value.style &&
element.value.style.titleHide &&
typeof element.value.style.titleHide === 'boolean'
) {
return element.value.style.titleHide
} else {
const showTabTitleFlag = computed(() => {
if (element.value && element.value.style && element.value.style?.showTabTitle === false) {
return false
} else {
return element.value.style?.showTabTitle
}
})

2
core/core-frontend/src/custom-component/v-query/CustomSortFilter.vue
View File

@ -7,7 +7,7 @@
class="custom-sort_filter"
width="300px"
>
<div>
<div style="max-height: 400px; overflow-y: auto">
<draggable :list="sortList" animation="300" class="drag-list">
<template #item="{ element }">
<span :key="element.name" class="item-dimension" :title="element">

17
core/core-frontend/src/custom-component/v-query/Select.vue
View File

@ -291,9 +291,18 @@ const setOldMapValue = arr => {
const customSort = () => {
if (config.value.sortList?.length && config.value.sort === 'customSort') {
options.value = [
...options.value.sort(
(a, b) => config.value.sortList.indexOf(a.value) - config.value.sortList.indexOf(b.value)
)
...options.value
.sort(a => {
if (config.value.sortList.indexOf(a.value) !== -1) {
return -1
}
})
.sort((a, b) => {
if (config.value.sortList.indexOf(a.value) === -1) {
return 0
}
return config.value.sortList.indexOf(a.value) - config.value.sortList.indexOf(b.value)
})
]
}
}
@ -517,7 +526,7 @@ const setOptions = (num: number) => {
handleFieldIdChange({
queryId: field.id,
displayId: displayId || field.id,
sort: sort === 'customSort' ? '' : sort,
sort: sort === 'customSort' ? 'asc' : sort,
sortId,
resultMode: config.value.resultMode || 0,
searchText: searchText.value,

3
core/core-frontend/src/layout/components/ToolboxCfg.vue
View File

@ -83,9 +83,8 @@ onMounted(() => {
<style lang="less">
.toolbox-top-popover {
height: 82px;
min-width: 208px !important;
padding: 16px !important;
padding: 8px !important;
display: flex;
.doc-card {
margin: auto;

23
core/core-frontend/src/layout/components/TopDoc.vue
View File

@ -29,17 +29,15 @@ const cardInfoList = [
:show-arrow="false"
popper-class="top-popover"
placement="bottom-end"
width="208"
width="210"
trigger="hover"
>
<el-row>
<top-doc-card
:span="12"
v-for="(item, index) in cardInfoList"
:key="index"
:card-info="item"
></top-doc-card>
</el-row>
<top-doc-card
:span="12"
v-for="(item, index) in cardInfoList"
:key="index"
:card-info="item"
></top-doc-card>
<template #reference>
<div
class="sys-setting"
@ -75,6 +73,11 @@ const cardInfoList = [
<style lang="less">
.top-popover {
padding: 0 0 16px 0 !important;
display: flex;
padding: 8px !important;
flex-wrap: wrap;
.doc-card {
margin: auto;
}
}
</style>

31
core/core-frontend/src/layout/components/TopDocCard.vue
View File

@ -27,33 +27,28 @@ const openBlank = () => {
<template>
<div class="doc-card" @click="openBlank">
<el-row class="base-show">
<Icon class-name="item-top-icon"
><component class="svg-icon item-top-icon" :is="cardInfo.icon"></component
></Icon>
</el-row>
<el-row class="base-show show-content"> {{ cardInfo.name }}</el-row>
<div class="base-show">
<Icon><component class="svg-icon item-top-icon" :is="cardInfo.icon"></component></Icon>
</div>
<div class="base-show show-content">{{ cardInfo.name }}</div>
</div>
</template>
<style lang="less" scoped>
.doc-card {
padding-top: 2px;
margin-top: 16px;
margin-left: 16px;
width: 80px;
height: 50px;
padding: 8px 0;
width: 96px;
height: 66px;
cursor: pointer;
&:hover {
background-color: rgba(30, 39, 56, 0.05);
}
display: flex;
flex-direction: column;
align-items: center;
&:hover,
&:active {
background-color: rgba(30, 39, 56, 0.1);
background-color: #1f23291a;
border-radius: 4px;
}
}
.base-show {
justify-content: center;
}
.show-content {
font-size: 14px;

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

@ -150,7 +150,7 @@ export function historyItemAdaptor(
}
if (componentItem.component === 'DeTabs') {
componentItem.style['titleHide'] = componentItem.style['titleHide'] || false
componentItem.style['showTabTitle'] = componentItem.style['showTabTitle'] || true
}
componentItem['expand'] = componentItem['expand'] || false

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

@ -251,16 +251,17 @@ export function createGroupStyle(groupComponent) {
function dataVTabSizeStyleAdaptor(tabComponent) {
const parentStyleAdaptor = { ...tabComponent.style }
const offset = parentStyleAdaptor.showTabTitle ? 46 : 0
const domId =
dvMainStore.editMode === 'edit'
? 'component' + tabComponent.id
: 'enlarge-inner-content' + tabComponent.id
const tabDom = document.getElementById(domId)
if (tabDom) {
parentStyleAdaptor.height = tabDom.clientHeight - 46
parentStyleAdaptor.height = tabDom.clientHeight - offset
parentStyleAdaptor.width = tabDom.clientWidth
} else {
parentStyleAdaptor.height = parentStyleAdaptor.height - 46
parentStyleAdaptor.height = parentStyleAdaptor.height - offset
}
tabComponent.propValue.forEach(tabItem => {
@ -290,6 +291,26 @@ export function groupStyleRevertBatch(groupComponent, parentStyle) {
}
}
export function tabInnerStyleRevert(tabOuterComponent) {
const parentStyle = {
width: tabOuterComponent.style.width,
height: tabOuterComponent.style.height - tabOuterComponent.style.showTabTitle ? 46 : 0
}
tabOuterComponent.propValue.forEach(tabItem => {
tabItem.componentData.forEach(tabComponent => {
console.log(
'====test===inner-width---' +
tabComponent.style.width +
'---height---' +
tabComponent.style.height +
'---' +
JSON.stringify(parentStyle)
)
groupStyleRevert(tabComponent, parentStyle)
})
})
}
export function groupStyleRevert(innerComponent, parentStyle) {
const innerStyle = { ...innerComponent.style }
innerComponent.groupStyle.left = innerStyle.left / parentStyle.width
@ -315,6 +336,6 @@ export function dataVTabComponentAdd(innerComponent, parentComponent) {
innerComponent.style.left = 0
const parentStyleAdaptor = { ...parentComponent.style }
// 去掉tab头部高度
parentStyleAdaptor.height = parentStyleAdaptor.height - 48
parentStyleAdaptor.height = parentStyleAdaptor.height - parentComponent.showTabTitle ? 46 : 0
groupStyleRevert(innerComponent, parentStyleAdaptor)
}

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

@ -190,11 +190,9 @@ const infoId = wsCache.get(curCanvasType.value === 'dashboard' ? 'db-info-id' :
const routerDvId = router.currentRoute.value.query.dvId
const dvId = embeddedStore.dvId || infoId || routerDvId
wsCache.delete(curCanvasType.value === 'dashboard' ? 'db-info-id' : 'dv-info-id')
console.log('==test===0' + selectedNodeKey.value)
if (dvId && showPosition.value === 'preview') {
selectedNodeKey.value = dvId
returnMounted.value = true
console.log('==test==1=' + selectedNodeKey.value)
}
const nodeExpand = data => {
if (data.id) {
@ -274,7 +272,6 @@ const afterTreeInit = () => {
returnMounted.value = false
}
nextTick(() => {
console.log('==test==2=' + selectedNodeKey.value)
resourceListTree.value.setCurrentKey(selectedNodeKey.value)
nextTick(() => {
if (selectedNodeKey.value) {

5
core/core-frontend/src/views/visualized/data/datasource/index.vue
View File

@ -132,6 +132,7 @@ const createDataset = (tableName?: string) => {
useEmitt().emitter.emit('changeCurrentComponent', 'DatasetEditor')
return
}
wsCache.set('ds-info-id', nodeInfo.id)
router.push({
path: '/dataset-form',
query: {
@ -989,7 +990,9 @@ const loadInit = () => {
}
onMounted(() => {
nodeInfo.id = (route.params.id as string) || (route.query.id as string) || ''
const dsId = wsCache.get('ds-info-id') || route.params.id
nodeInfo.id = (dsId as string) || (route.query.id as string) || ''
wsCache.delete('ds-info-id')
loadInit()
listDs()
const { opt } = router.currentRoute.value.query