forked from github/dataease
Merge pull request #11757 from dataease/pr@dev-v2@refactor_outer-params
refactor(数据大屏): 外部参数优化，支持设置Tab和分组内的过滤组件
This commit is contained in:
王嘉豪
GitHub
commit
b681228a49
@ -378,6 +378,20 @@ const initParams = async () => {
|
|||||||
componentData.value.forEach(componentItem => {
|
componentData.value.forEach(componentItem => {
|
||||||
if (componentItem.component === 'VQuery') {
|
if (componentItem.component === 'VQuery') {
|
||||||
state.baseFilterInfo.push(componentItem)
|
state.baseFilterInfo.push(componentItem)
|
||||||
|
} else if (componentItem.component === 'Group') {
|
||||||
|
componentItem.propValue.forEach(groupItem => {
|
||||||
|
if (groupItem.component === 'VQuery') {
|
||||||
|
state.baseFilterInfo.push(groupItem)
|
||||||
|
}
|
||||||
|
})
|
||||||
|
} else if (componentItem.component === 'DeTabs') {
|
||||||
|
componentItem.propValue.forEach(tabItem => {
|
||||||
|
tabItem.componentData.forEach(tabComponent => {
|
||||||
|
if (tabComponent.component === 'VQuery') {
|
||||||
|
state.baseFilterInfo.push(tabComponent)
|
||||||
|
}
|
||||||
|
})
|
||||||
|
})
|
||||||
}
|
}
|
||||||
})
|
})
|
||||||
// 同步基础数据集信息
|
// 同步基础数据集信息
|
||||||
|
|||||||
@ -939,106 +939,136 @@ export const dvMainStore = defineStore('dataVisualization', {
|
|||||||
const trackInfo = this.nowPanelOuterParamsInfo
|
const trackInfo = this.nowPanelOuterParamsInfo
|
||||||
for (let index = 0; index < curComponentData.length; index++) {
|
for (let index = 0; index < curComponentData.length; index++) {
|
||||||
const element = curComponentData[index]
|
const element = curComponentData[index]
|
||||||
if (!['UserView', 'VQuery'].includes(element.component)) continue
|
if (['UserView', 'VQuery'].includes(element.component)) {
|
||||||
const currentFilters = element.outerParamsFilters || [] // 外部参数信息
|
this.trackOuterFilterCursor(element, params, preActiveComponentIds, trackInfo, source)
|
||||||
|
this.componentData[index] = element
|
||||||
// 外部参数 可能会包含多个参数
|
} else if (element.component === 'Group') {
|
||||||
Object.keys(params).forEach(function (sourceInfo) {
|
element.propValue.forEach((groupItem, index) => {
|
||||||
// 获取外部参数的值 sourceInfo 是外部参数名称 支持数组传入
|
this.trackOuterFilterCursor(
|
||||||
let paramValue = params[sourceInfo]
|
groupItem,
|
||||||
let paramValueStr = params[sourceInfo]
|
params,
|
||||||
const parmaValueSource = params[sourceInfo]
|
preActiveComponentIds,
|
||||||
let operator = 'in'
|
trackInfo,
|
||||||
if (paramValue && !Array.isArray(paramValue)) {
|
source
|
||||||
paramValue = [paramValue]
|
)
|
||||||
operator = 'eq'
|
element.propValue[index] = groupItem
|
||||||
} else if (paramValue && Array.isArray(paramValue)) {
|
})
|
||||||
paramValueStr = ''
|
} else if (element.component === 'DeTabs') {
|
||||||
paramValue.forEach((innerValue, index) => {
|
element.propValue.forEach(tabItem => {
|
||||||
if (index === 0) {
|
tabItem.componentData.forEach((tabComponent, index) => {
|
||||||
paramValueStr = innerValue
|
this.trackOuterFilterCursor(
|
||||||
} else {
|
tabComponent,
|
||||||
paramValueStr = paramValueStr + ',' + innerValue
|
params,
|
||||||
}
|
preActiveComponentIds,
|
||||||
|
trackInfo,
|
||||||
|
source
|
||||||
|
)
|
||||||
|
tabItem.componentData[index] = tabComponent
|
||||||
})
|
})
|
||||||
|
})
|
||||||
|
}
|
||||||
|
}
|
||||||
|
}
|
||||||
|
},
|
||||||
|
trackOuterFilterCursor(element, params, preActiveComponentIds, trackInfo, source) {
|
||||||
|
if (!['UserView', 'VQuery'].includes(element.component)) {
|
||||||
|
return
|
||||||
|
}
|
||||||
|
const currentFilters = element.outerParamsFilters || [] // 外部参数信息
|
||||||
|
// 外部参数 可能会包含多个参数
|
||||||
|
Object.keys(params).forEach(function (sourceInfo) {
|
||||||
|
// 获取外部参数的值 sourceInfo 是外部参数名称 支持数组传入
|
||||||
|
let paramValue = params[sourceInfo]
|
||||||
|
let paramValueStr = params[sourceInfo]
|
||||||
|
const parmaValueSource = params[sourceInfo]
|
||||||
|
let operator = 'in'
|
||||||
|
if (paramValue && !Array.isArray(paramValue)) {
|
||||||
|
paramValue = [paramValue]
|
||||||
|
operator = 'eq'
|
||||||
|
} else if (paramValue && Array.isArray(paramValue)) {
|
||||||
|
paramValueStr = ''
|
||||||
|
paramValue.forEach((innerValue, index) => {
|
||||||
|
if (index === 0) {
|
||||||
|
paramValueStr = innerValue
|
||||||
|
} else {
|
||||||
|
paramValueStr = paramValueStr + ',' + innerValue
|
||||||
}
|
}
|
||||||
// 获取所有目标联动信息
|
})
|
||||||
const targetInfoList = trackInfo[sourceInfo] || []
|
}
|
||||||
|
// 获取所有目标联动信息
|
||||||
|
const targetInfoList = trackInfo[sourceInfo] || []
|
||||||
|
|
||||||
targetInfoList.forEach(targetInfo => {
|
targetInfoList.forEach(targetInfo => {
|
||||||
const targetInfoArray = targetInfo.split('#')
|
const targetInfoArray = targetInfo.split('#')
|
||||||
const targetViewId = targetInfoArray[0] // 目标图表
|
const targetViewId = targetInfoArray[0] // 目标图表
|
||||||
if (element.component === 'UserView' && element.id === targetViewId) {
|
if (element.component === 'UserView' && element.id === targetViewId) {
|
||||||
// 如果目标图表 和 当前循环组件id相等 则进行条件增减
|
// 如果目标图表 和 当前循环组件id相等 则进行条件增减
|
||||||
const targetFieldId = targetInfoArray[1] // 目标图表列ID
|
const targetFieldId = targetInfoArray[1] // 目标图表列ID
|
||||||
const condition = {
|
const condition = {
|
||||||
fieldId: targetFieldId,
|
fieldId: targetFieldId,
|
||||||
operator: operator,
|
operator: operator,
|
||||||
value: paramValue,
|
value: paramValue,
|
||||||
viewIds: [targetViewId]
|
viewIds: [targetViewId]
|
||||||
}
|
}
|
||||||
let j = currentFilters.length
|
let j = currentFilters.length
|
||||||
while (j--) {
|
while (j--) {
|
||||||
const filter = currentFilters[j]
|
const filter = currentFilters[j]
|
||||||
// 兼容性准备 viewIds 只会存放一个值
|
// 兼容性准备 viewIds 只会存放一个值
|
||||||
if (targetFieldId === filter.fieldId && filter.viewIds.includes(targetViewId)) {
|
if (targetFieldId === filter.fieldId && filter.viewIds.includes(targetViewId)) {
|
||||||
currentFilters.splice(j, 1)
|
currentFilters.splice(j, 1)
|
||||||
}
|
|
||||||
}
|
|
||||||
// 不存在该条件 且 条件有效 直接保存该条件
|
|
||||||
// !filterExist && vValid && currentFilters.push(condition)
|
|
||||||
currentFilters.push(condition)
|
|
||||||
preActiveComponentIds.push(element.id)
|
|
||||||
}
|
}
|
||||||
if (element.component === 'VQuery') {
|
}
|
||||||
element.propValue.forEach(filterItem => {
|
// 不存在该条件 且 条件有效 直接保存该条件
|
||||||
if (filterItem.id === targetViewId) {
|
// !filterExist && vValid && currentFilters.push(condition)
|
||||||
let queryParams = paramValue
|
currentFilters.push(condition)
|
||||||
if (!['1', '7'].includes(filterItem.displayType)) {
|
preActiveComponentIds.push(element.id)
|
||||||
// 查询组件除了时间组件 其他入参只支持文本 这里全部转为文本
|
}
|
||||||
queryParams = paramValue.map(number => String(number))
|
if (element.component === 'VQuery') {
|
||||||
}
|
element.propValue.forEach(filterItem => {
|
||||||
filterItem.defaultValueCheck = true
|
if (filterItem.id === targetViewId) {
|
||||||
filterItem.timeType = 'fixed'
|
let queryParams = paramValue
|
||||||
if (['0', '2'].includes(filterItem.displayType)) {
|
if (!['1', '7'].includes(filterItem.displayType)) {
|
||||||
// 0 文本类型 1 数字类型
|
// 查询组件除了时间组件 其他入参只支持文本 这里全部转为文本
|
||||||
if (filterItem.multiple) {
|
queryParams = paramValue.map(number => String(number))
|
||||||
// multiple === true 多选
|
}
|
||||||
filterItem.selectValue = queryParams
|
filterItem.defaultValueCheck = true
|
||||||
filterItem.defaultValue = queryParams
|
filterItem.timeType = 'fixed'
|
||||||
} else {
|
if (['0', '2'].includes(filterItem.displayType)) {
|
||||||
// 单选
|
// 0 文本类型 1 数字类型
|
||||||
filterItem.selectValue = queryParams[0]
|
if (filterItem.multiple) {
|
||||||
filterItem.defaultValue = queryParams[0]
|
// multiple === true 多选
|
||||||
}
|
filterItem.selectValue = queryParams
|
||||||
} else if (filterItem.displayType === '1') {
|
filterItem.defaultValue = queryParams
|
||||||
// 1 时间类型
|
} else {
|
||||||
filterItem.selectValue = queryParams[0]
|
// 单选
|
||||||
filterItem.defaultValue = queryParams[0]
|
filterItem.selectValue = queryParams[0]
|
||||||
} else if (filterItem.displayType === '7') {
|
filterItem.defaultValue = queryParams[0]
|
||||||
// 7 时间范围类型
|
|
||||||
filterItem.selectValue = queryParams
|
|
||||||
filterItem.defaultValue = queryParams
|
|
||||||
} else if (filterItem.displayType === '8') {
|
|
||||||
// 8 文本搜索
|
|
||||||
filterItem.conditionValueF = parmaValueSource + ''
|
|
||||||
filterItem.defaultConditionValueF = parmaValueSource + ''
|
|
||||||
}
|
|
||||||
}
|
}
|
||||||
})
|
} 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 = parmaValueSource + ''
|
||||||
|
filterItem.defaultConditionValueF = parmaValueSource + ''
|
||||||
|
}
|
||||||
}
|
}
|
||||||
})
|
})
|
||||||
if (element.component === 'UserView') {
|
}
|
||||||
element['outerParamsFilters'] = currentFilters
|
})
|
||||||
}
|
})
|
||||||
curComponentData[index] = element
|
if (element.component === 'UserView') {
|
||||||
})
|
element['outerParamsFilters'] = currentFilters
|
||||||
}
|
}
|
||||||
if (source === 'outer') {
|
if (source === 'outer') {
|
||||||
preActiveComponentIds.forEach(viewId => {
|
preActiveComponentIds.forEach(viewId => {
|
||||||
useEmitt().emitter.emit('query-data-' + viewId)
|
useEmitt().emitter.emit('query-data-' + viewId)
|
||||||
})
|
})
|
||||||
}
|
|
||||||
}
|
}
|
||||||
},
|
},
|
||||||
trackFilterCursor(element, checkQDList, trackInfo, preActiveComponentIds, viewId) {
|
trackFilterCursor(element, checkQDList, trackInfo, preActiveComponentIds, viewId) {
|
||||||
|
|||||||
Loading…
Reference in New Issue
Block a user