feat(仪表板): 跳转支持目标侧匹配目标仪表板过滤组件 #8656

This commit is contained in:
wangjiahao 2024-04-18 18:34:07 +08:00
parent 7e6c50ab8d
commit 7913bed6e5
5 changed files with 115 additions and 13 deletions

View File

@ -3,6 +3,7 @@ package io.dataease.visualization.server;
import com.baomidou.mybatisplus.core.conditions.query.QueryWrapper;
import io.dataease.api.permissions.dataset.dto.DataSetRowPermissionsTreeDTO;
import io.dataease.api.visualization.VisualizationLinkJumpApi;
import io.dataease.api.visualization.dto.VisualizationComponentDTO;
import io.dataease.api.visualization.dto.VisualizationLinkJumpDTO;
import io.dataease.api.visualization.dto.VisualizationLinkJumpInfoDTO;
import io.dataease.api.visualization.request.VisualizationLinkJumpBaseRequest;
@ -144,14 +145,18 @@ public class VisualizationLinkJumpService implements VisualizationLinkJumpApi {
}
@Override
public List<VisualizationViewTableVO> viewTableDetailList(Long dvId) {
public VisualizationComponentDTO viewTableDetailList(Long dvId) {
DataVisualizationInfo dvInfo = dataVisualizationInfoMapper.selectById(dvId);
List<VisualizationViewTableVO> result;
String componentData;
if (dvInfo != null) {
List<VisualizationViewTableVO> result = extVisualizationLinkJumpMapper.getViewTableDetails(dvId);
return result.stream().filter(viewTableInfo -> dvInfo.getComponentData().indexOf(viewTableInfo.getId().toString()) > -1).collect(Collectors.toList());
}else {
return new ArrayList<>();
result = extVisualizationLinkJumpMapper.getViewTableDetails(dvId).stream().filter(viewTableInfo -> dvInfo.getComponentData().indexOf(viewTableInfo.getId().toString()) > -1).collect(Collectors.toList());
componentData = dvInfo.getComponentData();
} else {
result = new ArrayList<>();
componentData = "[]";
}
return new VisualizationComponentDTO(componentData,result);
}

View File

@ -231,7 +231,8 @@
>
<span class="custom-option">
<Icon
:icon-class="item.type"
:name="item.type"
class-name="view-type-icon"
style="width: 14px; height: 14px"
/>
<span style="float: left; margin-left: 4px; font-size: 14px">{{
@ -245,7 +246,7 @@
<el-select
v-model="targetViewInfo.targetFieldId"
:placeholder="'请选择字段'"
:disabled="!targetViewInfo.sourceFieldActiveId"
:disabled="fieldIdDisabledCheck(targetViewInfo)"
style="width: 100%"
>
<el-option
@ -405,7 +406,7 @@ import { snapshotStoreWithOut } from '@/store/modules/data-visualization/snapsho
import EmptyBackground from '@/components/empty-background/src/EmptyBackground.vue'
import { filterEmptyFolderTree } from '@/utils/canvasUtils'
const dvMainStore = dvMainStoreWithOut()
const { dvInfo, canvasViewInfo } = storeToRefs(dvMainStore)
const { dvInfo, canvasViewInfo, componentData } = storeToRefs(dvMainStore)
const linkJumpInfoTree = ref(null)
const { t } = useI18n()
const dialogShow = ref(false)
@ -643,12 +644,28 @@ const codeMirrorContentSet = content => {
const getPanelViewList = dvId => {
viewTableDetailList(dvId).then(rsp => {
state.viewIdFieldArrayMap = {}
state.currentLinkPanelViewArray = rsp.data
state.currentLinkPanelViewArray = rsp.data.visualizationViewTables
if (state.currentLinkPanelViewArray) {
state.currentLinkPanelViewArray.forEach(view => {
state.viewIdFieldArrayMap[view.id] = view.tableFields
})
}
//
JSON.parse(rsp.data.bashComponentData).forEach(componentItem => {
if (componentItem.component === 'VQuery') {
componentItem.propValue.forEach(filterItem => {
state.currentLinkPanelViewArray.push({
id: filterItem.id,
type: 'filter',
name: filterItem.name,
title: filterItem.name
})
state.viewIdFieldArrayMap[filterItem.id] = [
{ id: '1000001', name: t('visualization.filter_no_select') }
]
})
}
})
})
}
const dvNodeClick = data => {
@ -667,8 +684,26 @@ const addLinkJumpField = () => {
const deleteLinkJumpField = index => {
state.linkJumpInfo.targetViewInfoList.splice(index, 1)
}
const fieldIdDisabledCheck = targetViewInfo => {
return (
(state.viewIdFieldArrayMap[targetViewInfo.targetViewId] &&
state.viewIdFieldArrayMap[targetViewInfo.targetViewId].length === 1 &&
state.viewIdFieldArrayMap[targetViewInfo.targetViewId][0].id === '1000001') ||
!targetViewInfo.sourceFieldActiveId
)
}
const viewInfoOnChange = targetViewInfo => {
if (
state.viewIdFieldArrayMap[targetViewInfo.targetViewId] &&
state.viewIdFieldArrayMap[targetViewInfo.targetViewId].length === 1 &&
state.viewIdFieldArrayMap[targetViewInfo.targetViewId][0].id === '1000001'
) {
targetViewInfo.targetFieldId = '1000001'
} else {
targetViewInfo.targetFieldId = null
}
}
const sourceFieldCheckedChange = data => {
nextTick(() => {

View File

@ -812,7 +812,7 @@ export const dvMainStore = defineStore('dataVisualization', {
const checkQDList = [...data.dimensionList, ...data.quotaList]
for (let indexOuter = 0; indexOuter < this.componentData.length; indexOuter++) {
const element = this.componentData[indexOuter]
if (element.component === 'UserView' && element.innerType != 'VQuery') {
if (['UserView', 'VQuery'].includes(element.component)) {
this.trackFilterCursor(element, checkQDList, trackInfo, preActiveComponentIds, viewId)
this.componentData[indexOuter] = element
} else if (element.component === 'Group') {
@ -951,10 +951,11 @@ export const dvMainStore = defineStore('dataVisualization', {
const sourceInfo = viewId + '#' + QDItem.id
// 获取所有目标联动信息
const targetInfoList = trackInfo[sourceInfo] || []
const paramValue = [QDItem.value]
targetInfoList.forEach(targetInfo => {
const targetInfoArray = targetInfo.split('#')
const targetViewId = targetInfoArray[0] // 目标图表
if (element.id === targetViewId) {
if (element.component === 'UserView' && element.id === targetViewId) {
// 如果目标图表 当前循环组件id相等 则进行条件增减
const targetFieldId = targetInfoArray[1] // 目标图表列ID
const condition = {
@ -977,6 +978,43 @@ export const dvMainStore = defineStore('dataVisualization', {
currentFilters.push(condition)
preActiveComponentIds.includes(element.id) || preActiveComponentIds.push(element.id)
}
if (element.component === 'VQuery') {
element.propValue.forEach(filterItem => {
if (filterItem.id === targetViewId) {
let queryParams = paramValue
if (!['1', '7'].includes(filterItem.displayType)) {
// 查询组件除了时间组件 其他入参只支持文本 这里全部转为文本
queryParams = paramValue.map(number => String(number))
}
filterItem.defaultValueCheck = true
filterItem.timeType = 'fixed'
if (['0', '2'].includes(filterItem.displayType)) {
// 0 文本类型 1 数字类型
if (filterItem.multiple) {
// multiple === true 多选
filterItem.selectValue = queryParams
filterItem.defaultValue = queryParams
} else {
// 单选
filterItem.selectValue = queryParams[0]
filterItem.defaultValue = queryParams[0]
}
} else if (filterItem.displayType === '1') {
// 1 时间类型
filterItem.selectValue = queryParams[0]
filterItem.defaultValue = queryParams[0]
} else if (filterItem.displayType === '7') {
// 7 时间范围类型
filterItem.selectValue = queryParams
filterItem.defaultValue = queryParams
} else if (filterItem.displayType === '8') {
// 8 文本搜索
filterItem.conditionValueF = queryParams[0]
filterItem.defaultConditionValueF = queryParams[0]
}
}
})
}
})
})
element.linkageFilters = currentFilters

View File

@ -1,6 +1,7 @@
package io.dataease.api.visualization;
import com.github.xiaoymin.knife4j.annotations.ApiSupport;
import io.dataease.api.visualization.dto.VisualizationComponentDTO;
import io.dataease.api.visualization.dto.VisualizationLinkJumpDTO;
import io.dataease.api.visualization.request.VisualizationLinkJumpBaseRequest;
import io.dataease.api.visualization.response.VisualizationLinkJumpBaseResponse;
@ -46,7 +47,7 @@ public interface VisualizationLinkJumpApi {
@GetMapping("/viewTableDetailList/{dvId}")
@Operation(summary = "查询跳转明细")
List<VisualizationViewTableVO> viewTableDetailList(@PathVariable Long dvId);
VisualizationComponentDTO viewTableDetailList(@PathVariable Long dvId);
@PostMapping("/updateJumpSetActive")
@Operation(summary = "更新跳转信息可用状态")

View File

@ -0,0 +1,23 @@
package io.dataease.api.visualization.dto;
import io.dataease.api.visualization.vo.VisualizationViewTableVO;
import lombok.AllArgsConstructor;
import lombok.Data;
import lombok.NoArgsConstructor;
import java.util.List;
/**
* @author : WangJiaHao
* @date : 2024/4/18 17:14
*/
@Data
@NoArgsConstructor
@AllArgsConstructor
public class VisualizationComponentDTO {
private String bashComponentData;
List<VisualizationViewTableVO> visualizationViewTables;
}