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

feat(查询组件): 数值区间功能设计

Browse Source
This commit is contained in:
dataeaseShu 2024-10-17 11:21:32 +08:00
parent 6b96269aac
commit 0b312b7b64
3 changed files with 115 additions and 35 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

87
core/core-frontend/src/custom-component/v-query/QueryConditionConfiguration.vue
View File

@ -416,7 +416,7 @@ const setParametersArrNum = (val, componentId) => {
curComponent.value.checkedFieldsMap[componentId] = '' curComponent.value.checkedFieldsMap[componentId] = ''
curComponent.value.checkedFieldsMapEndNum[componentId] = '' curComponent.value.checkedFieldsMapEndNum[componentId] = ''
curComponent.value.checkedFieldsMapStartNum[componentId] = '' curComponent.value.checkedFieldsMapStartNum[componentId] = ''
curComponent.value.parametersArrNum[componentId] = [] curComponent.value.parametersArr[componentId] = []
} }
if (curComponent.value.checkedFieldsMapArrNum[componentId].length) { if (curComponent.value.checkedFieldsMapArrNum[componentId].length) {
@ -628,6 +628,7 @@ const setParametersTimeType = componentId => {
.includes(ele.id) && !!ele.variableName .includes(ele.id) && !!ele.variableName
) )
) )
if (!curComponent.value.parametersArr[componentId].length) return
const [v1, v2] = curComponent.value.parametersArr[componentId][0].type const [v1, v2] = curComponent.value.parametersArr[componentId][0].type
curComponent.value.timeGranularityMultiple = typeTimeMap[v2 || v1] curComponent.value.timeGranularityMultiple = typeTimeMap[v2 || v1]
? `${typeTimeMap[v2 || v1]}range` ? `${typeTimeMap[v2 || v1]}range`
@ -757,7 +758,14 @@ const setTypeChange = () => {
} }
const isTimeParameter = computed(() => { const isTimeParameter = computed(() => {
return curComponent.value.parameters?.some(ele => ele.deType === 1 && !!ele.variableName) return curComponent.value.checkedFields.some(ele => {
return curComponent.value.parameters?.some(
itx =>
itx.deType === 1 &&
!!itx.variableName &&
curComponent.value.checkedFieldsMap[ele] === itx.id
)
})
}) })
const isNumParameter = computed(() => { const isNumParameter = computed(() => {
@ -767,25 +775,31 @@ const isNumParameter = computed(() => {
}) })
const notNumRange = computed(() => { const notNumRange = computed(() => {
return Object.values(curComponent.value.checkedFieldsMapArrNum || {}).some( return curComponent.value.checkedFields.some(ele => {
ele => ele?.length !== 0 return curComponent.value.checkedFieldsMapArrNum[ele]?.length > 0
) })
}) })
const canNotNumRange = computed(() => { const canNotNumRange = computed(() => {
if ( if (
curComponent.value.checkedFields.every(id => { curComponent.value.checkedFields.every(id => {
return curComponent.value.checkedFieldsMapArrNum?.[id]?.length return curComponent.value.checkedFieldsMapArrNum?.[id]?.length > 0
}) })
) { ) {
return false return false
} else { } else {
return curComponent.value.parameters?.some(ele => [2, 3].includes(ele.deType)) return curComponent.value.checkedFields.some(ele => {
return curComponent.value.parameters?.some(
itx => [2, 3].includes(itx.deType) && curComponent.value.checkedFieldsMap[ele] === itx.id
)
})
} }
}) })
const notTimeRange = computed(() => { const notTimeRange = computed(() => {
return Object.values(curComponent.value.checkedFieldsMapArr || {}).some(ele => ele?.length !== 0) return curComponent.value.checkedFields.some(ele => {
return curComponent.value.checkedFieldsMapArr[ele]?.length > 0
})
}) })
const notTimeRangeType = computed(() => { const notTimeRangeType = computed(() => {
@ -2172,6 +2186,7 @@ defineExpose({
curComponent.checkedFieldsMapArr[field.componentId].includes(ele.id) && curComponent.checkedFieldsMapArr[field.componentId].includes(ele.id) &&
field.activelist === 'parameterList' field.activelist === 'parameterList'
" "
@click.stop="timeClick(field.componentId, ele)"
class="range-time_setting" class="range-time_setting"
> >
{{ {{
@ -2181,7 +2196,7 @@ defineExpose({
? '结束时间' ? '结束时间'
: '' : ''
}} }}
<el-icon @click.stop="timeClick(field.componentId, ele)"> <el-icon>
<Icon> <Icon>
<icon_edit_outlined class="svg-icon"></icon_edit_outlined> <icon_edit_outlined class="svg-icon"></icon_edit_outlined>
</Icon> </Icon>
@ -2201,7 +2216,7 @@ defineExpose({
class="field-select--input" class="field-select--input"
style="margin-left: 12px" style="margin-left: 12px"
popper-class="field-select--dqp" popper-class="field-select--dqp"
v-if=" v-else-if="
curComponent.checkedFields.includes(field.componentId) && curComponent.checkedFields.includes(field.componentId) &&
curComponent.checkedFieldsMapArrNum && curComponent.checkedFieldsMapArrNum &&
curComponent.checkedFieldsMapArrNum[field.componentId] && curComponent.checkedFieldsMapArrNum[field.componentId] &&
@ -2268,6 +2283,7 @@ defineExpose({
curComponent.checkedFieldsMapArrNum[field.componentId].includes(ele.id) && curComponent.checkedFieldsMapArrNum[field.componentId].includes(ele.id) &&
field.activelist === 'parameterList' field.activelist === 'parameterList'
" "
@click.stop="numClick(field.componentId, ele)"
class="range-time_setting" class="range-time_setting"
> >
{{ {{
@ -2277,7 +2293,7 @@ defineExpose({
? '最大值' ? '最大值'
: '' : ''
}} }}
<el-icon @click.stop="numClick(field.componentId, ele)"> <el-icon>
<Icon> <Icon>
<icon_edit_outlined class="svg-icon"></icon_edit_outlined> <icon_edit_outlined class="svg-icon"></icon_edit_outlined>
</Icon> </Icon>
@ -2287,7 +2303,6 @@ defineExpose({
</el-option> </el-option>
</el-select> </el-select>
<el-select <el-select
key="checkedFieldsMapNum"
@change="setParameters(field)" @change="setParameters(field)"
@focus="handleDialogClick" @focus="handleDialogClick"
style="margin-left: 12px" style="margin-left: 12px"
@ -2366,6 +2381,12 @@ defineExpose({
{{ ele.name || ele.variableName }} {{ ele.name || ele.variableName }}
</span> </span>
<span <span
@click.stop="
() =>
isNumParameter
? numClick(field.componentId, ele)
: timeClick(field.componentId, ele)
"
v-if=" v-if="
curComponent.checkedFieldsMap[field.componentId] === ele.id && curComponent.checkedFieldsMap[field.componentId] === ele.id &&
field.activelist === 'parameterList' && field.activelist === 'parameterList' &&
@ -2374,14 +2395,7 @@ defineExpose({
class="range-time_setting" class="range-time_setting"
> >
{{ isNumParameter ? '数值' : '时间' }} {{ isNumParameter ? '数值' : '时间' }}
<el-icon <el-icon>
@click.stop="
() =>
isNumParameter
? numClick(field.componentId, ele)
: timeClick(field.componentId, ele)
"
>
<Icon> <Icon>
<icon_edit_outlined class="svg-icon"></icon_edit_outlined> <icon_edit_outlined class="svg-icon"></icon_edit_outlined>
</Icon> </Icon>
@ -2616,10 +2630,13 @@ defineExpose({
<template v-if="curComponent.field.id" #prefix> <template v-if="curComponent.field.id" #prefix>
<el-icon> <el-icon>
<Icon <Icon
:className="`field-icon-${
fieldType[getDetype(curComponent.field.id, curComponent.dataset.fields)]
}`"
><component ><component
class="svg-icon"
:class="`field-icon-${
fieldType[
getDetype(curComponent.field.id, curComponent.dataset.fields)
]
}`"
:is=" :is="
iconFieldMap[ iconFieldMap[
fieldType[ fieldType[
@ -2673,12 +2690,13 @@ defineExpose({
<template v-if="curComponent.displayId" #prefix> <template v-if="curComponent.displayId" #prefix>
<el-icon> <el-icon>
<Icon <Icon
:className="`field-icon-${
fieldType[
getDetype(curComponent.displayId, curComponent.dataset.fields)
]
}`"
><component ><component
class="svg-icon"
:class="`field-icon-${
fieldType[
getDetype(curComponent.displayId, curComponent.dataset.fields)
]
}`"
:is=" :is="
iconFieldMap[ iconFieldMap[
fieldType[ fieldType[
@ -2734,10 +2752,11 @@ defineExpose({
<template v-if="curComponent.sortId" #prefix> <template v-if="curComponent.sortId" #prefix>
<el-icon> <el-icon>
<Icon <Icon
:className="`field-icon-${
fieldType[getDetype(curComponent.sortId, curComponent.dataset.fields)]
}`"
><component ><component
class="svg-icon"
:class="`field-icon-${
fieldType[getDetype(curComponent.sortId, curComponent.dataset.fields)]
}`"
:is=" :is="
iconFieldMap[ iconFieldMap[
fieldType[ fieldType[
@ -2761,7 +2780,7 @@ defineExpose({
:title="ele.desensitized ? '脱敏字段，不能被设置为查询条件' : ''" :title="ele.desensitized ? '脱敏字段，不能被设置为查询条件' : ''"
> >
<el-icon> <el-icon>
<Icon :className="`field-icon-${fieldType[ele.deType]}`" <Icon
><component ><component
:class="`field-icon-${fieldType[ele.deType]}`" :class="`field-icon-${fieldType[ele.deType]}`"
class="svg-icon" class="svg-icon"
@ -3144,8 +3163,8 @@ defineExpose({
.ed-select-tags-wrapper.has-prefix { .ed-select-tags-wrapper.has-prefix {
margin-left: 25px; margin-left: 25px;
} }
.ed-tag { .ed-select__tags-text {
max-width: 65px; max-width: 38px !important;
} }
} }

61
core/core-frontend/src/hooks/web/useFilter.ts
View File

@ -176,6 +176,18 @@ const getResult = (
return [valueF || '', valueS || ''].filter(ele => ele !== '') return [valueF || '', valueS || ''].filter(ele => ele !== '')
} }
const getResultNum = (
defaultNumValueEnd,
numValueEnd,
numValueStart,
defaultNumValueStart,
firstLoad
) => {
const valueS = firstLoad ? defaultNumValueStart : numValueStart
const valueE = firstLoad ? defaultNumValueEnd : numValueEnd
return [valueS || '', valueE || ''].filter(ele => ele !== '')
}
const getOperator = ( const getOperator = (
displayType, displayType,
multiple, multiple,
@ -193,6 +205,11 @@ const getOperator = (
if (+displayType === 9) { if (+displayType === 9) {
return multiple ? 'in' : 'eq' return multiple ? 'in' : 'eq'
} }
if (+displayType === 22) {
return 'between'
}
const valueF = firstLoad ? defaultConditionValueF : conditionValueF const valueF = firstLoad ? defaultConditionValueF : conditionValueF
const valueS = firstLoad ? defaultConditionValueS : conditionValueS const valueS = firstLoad ? defaultConditionValueS : conditionValueS
const operatorF = firstLoad ? defaultConditionValueOperatorF : conditionValueOperatorF const operatorF = firstLoad ? defaultConditionValueOperatorF : conditionValueOperatorF
@ -240,6 +257,10 @@ export const searchQuery = (queryComponentList, filter, curComponentId, firstLoa
const { const {
selectValue: value, selectValue: value,
timeGranularityMultiple, timeGranularityMultiple,
defaultNumValueEnd,
numValueEnd,
numValueStart,
defaultNumValueStart,
conditionType = 0, conditionType = 0,
treeFieldList = [], treeFieldList = [],
defaultConditionValueOperatorF = 'eq', defaultConditionValueOperatorF = 'eq',
@ -325,6 +346,14 @@ export const searchQuery = (queryComponentList, filter, curComponentId, firstLoa
conditionValueS, conditionValueS,
firstLoad firstLoad
) )
} else if (displayType === '22') {
selectValue = getResultNum(
defaultNumValueEnd,
numValueEnd,
numValueStart,
defaultNumValueStart,
firstLoad
)
} else { } else {
selectValue = getValueByDefaultValueCheckOrFirstLoad( selectValue = getValueByDefaultValueCheckOrFirstLoad(
defaultValueCheck, defaultValueCheck,
@ -409,6 +438,38 @@ export const searchQuery = (queryComponentList, filter, curComponentId, firstLoa
isTree isTree
}) })
} }
if (item.checkedFieldsMapArrNum?.[curComponentId]?.length) {
const endTimeFieldId = item.checkedFieldsMapArrNum?.[curComponentId].find(
element => element !== fieldId
)
const resultEnd = Array(2).fill(
endTimeFieldId === item.checkedFieldsMapEndNum[curComponentId]
? result[1]
: result[0]
)
result = Array(2).fill(
endTimeFieldId === item.checkedFieldsMapEndNum[curComponentId]
? result[0]
: result[1]
)
parametersFilter = duplicateRemoval(
item.parametersArr[curComponentId].filter(e => e.id === fieldId)
)
const parametersFilterEnd = duplicateRemoval(
item.parametersArr[curComponentId].filter(e => e.id === endTimeFieldId)
)
filter.push({
componentId: ele.id,
fieldId: endTimeFieldId,
operator,
value: resultEnd,
parameters: parametersFilterEnd,
isTree
})
}
filter.push({ filter.push({
componentId: ele.id, componentId: ele.id,
fieldId, fieldId,

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

@ -148,7 +148,7 @@ const datasourceEditor = ref()
const activeTab = ref('') const activeTab = ref('')
const menuList = [ const menuList = [
{ {
label: t('data_set.move_to'), label: t('chart.move_to'),
svgName: icon_intoItem_outlined, svgName: icon_intoItem_outlined,
command: 'move' command: 'move'
}, },