From ddfd392858d9b9e5031253160c5df3b5fd8ec34b Mon Sep 17 00:00:00 2001 From: fit2cloud-chenyw Date: Thu, 27 Jan 2022 11:06:29 +0800 Subject: [PATCH] =?UTF-8?q?fix:=20=E4=BB=AA=E8=A1=A8=E6=9D=BF=E8=BF=87?= =?UTF-8?q?=E6=BB=A4=E7=BB=84=E4=BB=B6=E9=A6=96=E6=AC=A1=E5=8A=A0=E8=BD=BD?= =?UTF-8?q?=E5=A4=B1=E6=95=88?= MIME-Version: 1.0 Content-Type: text/plain; charset=UTF-8 Content-Transfer-Encoding: 8bit --- .../components/Editor/ComponentWrapper.vue | 5 ++ .../canvas/components/Editor/Preview.vue | 9 ++- .../canvas/components/Editor/index.vue | 9 ++- .../canvas/custom-component/UserView.vue | 27 +++++--- .../serviceImpl/NumberRangeServiceImpl.js | 33 ++++++++++ .../NumberSelectGridServiceImpl.js | 9 +++ .../serviceImpl/NumberSelectServiceImpl.js | 9 +++ .../serviceImpl/TextInputServiceImpl.js | 9 +++ .../serviceImpl/TextSelectGridServiceImpl.js | 9 +++ .../serviceImpl/TextSelectServiceImpl.js | 11 +++- .../serviceImpl/TimeDateRangeServiceImpl.js | 62 ++++++++++++++++++- .../widget/serviceImpl/TimeDateServiceImpl.js | 62 ++++++++++++++++++- .../serviceImpl/TimeMonthServiceImpl.js | 62 ++++++++++++++++++- .../widget/serviceImpl/TimeYearServiceImpl.js | 62 ++++++++++++++++++- frontend/src/utils/conditionUtil.js | 35 +++++++++++ 15 files changed, 395 insertions(+), 18 deletions(-) diff --git a/frontend/src/components/canvas/components/Editor/ComponentWrapper.vue b/frontend/src/components/canvas/components/Editor/ComponentWrapper.vue index bfb04d56e0..f2725e8ae7 100644 --- a/frontend/src/components/canvas/components/Editor/ComponentWrapper.vue +++ b/frontend/src/components/canvas/components/Editor/ComponentWrapper.vue @@ -32,6 +32,7 @@ :search-count="searchCount" :h="config.style.height" :edit-mode="'preview'" + :filters="filters" :terminal="terminal" /> @@ -74,6 +75,10 @@ export default { terminal: { type: String, default: 'pc' + }, + filters: { + type: Array, + default: () => [] } }, data() { diff --git a/frontend/src/components/canvas/components/Editor/Preview.vue b/frontend/src/components/canvas/components/Editor/Preview.vue index 17690278c3..727f0b3204 100644 --- a/frontend/src/components/canvas/components/Editor/Preview.vue +++ b/frontend/src/components/canvas/components/Editor/Preview.vue @@ -20,6 +20,7 @@ :search-count="searchCount" :in-screen="inScreen" :terminal="terminal" + :filters="filterMap[item.propValue && item.propValue.viewId]" /> [] } }, data() { return { - filterInit: false, // 标记是否已经通过watch.filters 进行初始化，如果filterInit=true 则create放弃数据初始化防止数据覆盖 + isFirstLoad: true, // 是否是第一次加载 refId: null, chart: BASE_CHART_STRING, requestStatus: 'success', @@ -179,7 +183,7 @@ export default { }, filter() { const filter = {} - filter.filter = this.element.filters + filter.filter = this.isFirstLoad ? this.filters : this.cfilters filter.linkageFilters = this.element.linkageFilters filter.drill = this.drillClickDimensionList filter.resultCount = this.resultCount @@ -187,7 +191,7 @@ export default { filter.queryFrom = 'panel' return filter }, - filters() { + cfilters() { // 必要 勿删勿该 watch数组，哪怕发生变化 oldValue等于newValue ，深拷贝解决 if (!this.element.filters) return [] return JSON.parse(JSON.stringify(this.element.filters)) @@ -242,11 +246,13 @@ export default { }, watch: { - 'filters': function(val1, val2) { - if (isChange(val1, val2)) { - this.filterInit = true - this.getData(this.element.propValue.viewId) - } + 'cfilters': { + handler: function(val1, val2) { + if (isChange(val1, val2) && !this.isFirstLoad) { + this.getData(this.element.propValue.viewId) + } + }, + deep: true }, linkageFilters: { handler(newVal, oldVal) { @@ -318,7 +324,8 @@ export default { this.refId = uuid.v1 if (this.element && this.element.propValue && this.element.propValue.viewId) { // 如果watch.filters 已经进行数据初始化时候，此处放弃数据初始化 - !this.filterInit && this.getData(this.element.propValue.viewId, false) + + this.getData(this.element.propValue.viewId, false) } }, methods: { @@ -399,6 +406,7 @@ export default { this.requestStatus = 'error' this.message = response.message } + this.isFirstLoad = false return true }).catch(err => { this.requestStatus = 'error' @@ -413,6 +421,7 @@ export default { this.message = err } } + this.isFirstLoad = false return true }) } diff --git a/frontend/src/components/widget/serviceImpl/NumberRangeServiceImpl.js b/frontend/src/components/widget/serviceImpl/NumberRangeServiceImpl.js index c00ec6df99..ab190766eb 100644 --- a/frontend/src/components/widget/serviceImpl/NumberRangeServiceImpl.js +++ b/frontend/src/components/widget/serviceImpl/NumberRangeServiceImpl.js @@ -67,6 +67,39 @@ class NumberRangeServiceImpl extends WidgetService { return field['deType'] === 2 || field['deType'] === 3 }) } + + getParam(element) { + if (element.options.value && element.options.value.length > 0) { + const values = this.element.options.value + const min = values[0] + let max = null + if (values.length > 1) { + max = values[1] + } + const param = { + component: element, + value: [min, max], + operator: 'between' + } + if (min && max) { + return param + } + if (!min && !max) { + param.value = [] + return param + } + if (min) { + param.value = [min] + param.operator = 'ge' + return param + } + if (max) { + param.value = [max] + param.operator = 'le' + return param + } + } + } } const numberRangeServiceImpl = new NumberRangeServiceImpl() export default numberRangeServiceImpl diff --git a/frontend/src/components/widget/serviceImpl/NumberSelectGridServiceImpl.js b/frontend/src/components/widget/serviceImpl/NumberSelectGridServiceImpl.js index 96742074c7..1ed6c1714f 100644 --- a/frontend/src/components/widget/serviceImpl/NumberSelectGridServiceImpl.js +++ b/frontend/src/components/widget/serviceImpl/NumberSelectGridServiceImpl.js @@ -81,6 +81,15 @@ class NumberSelectGridServiceImpl extends WidgetService { } }) } + getParam(element) { + const value = element.options.value + const param = { + component: element, + value: !value ? [] : Array.isArray(value) ? value : value.toString().split(','), + operator: element.options.attrs.multiple ? 'in' : 'eq' + } + return param + } } const numberSelectGridServiceImpl = new NumberSelectGridServiceImpl() export default numberSelectGridServiceImpl diff --git a/frontend/src/components/widget/serviceImpl/NumberSelectServiceImpl.js b/frontend/src/components/widget/serviceImpl/NumberSelectServiceImpl.js index c21b235663..813cd5099e 100644 --- a/frontend/src/components/widget/serviceImpl/NumberSelectServiceImpl.js +++ b/frontend/src/components/widget/serviceImpl/NumberSelectServiceImpl.js @@ -82,6 +82,15 @@ class NumberSelectServiceImpl extends WidgetService { } }) } + getParam(element) { + const value = element.options.value + const param = { + component: element, + value: !value ? [] : Array.isArray(value) ? value : value.toString().split(','), + operator: element.options.attrs.multiple ? 'in' : 'eq' + } + return param + } } const numberSelectServiceImpl = new NumberSelectServiceImpl() export default numberSelectServiceImpl diff --git a/frontend/src/components/widget/serviceImpl/TextInputServiceImpl.js b/frontend/src/components/widget/serviceImpl/TextInputServiceImpl.js index 99b1de205d..764c354bae 100644 --- a/frontend/src/components/widget/serviceImpl/TextInputServiceImpl.js +++ b/frontend/src/components/widget/serviceImpl/TextInputServiceImpl.js @@ -67,6 +67,15 @@ class TextInputServiceImpl extends WidgetService { return field['deType'] === 0 }) } + getParam(element) { + const value = element.options.value + const param = { + component: element, + value: !value ? [] : Array.isArray(value) ? value : [value], + operator: 'like' + } + return param + } } const textInputServiceImpl = new TextInputServiceImpl() export default textInputServiceImpl diff --git a/frontend/src/components/widget/serviceImpl/TextSelectGridServiceImpl.js b/frontend/src/components/widget/serviceImpl/TextSelectGridServiceImpl.js index 7b1a90cc3f..8775f4e42a 100644 --- a/frontend/src/components/widget/serviceImpl/TextSelectGridServiceImpl.js +++ b/frontend/src/components/widget/serviceImpl/TextSelectGridServiceImpl.js @@ -81,6 +81,15 @@ class TextSelectGridServiceImpl extends WidgetService { } }) } + getParam(element) { + const value = element.options.value + const param = { + component: element, + value: !value ? [] : Array.isArray(value) ? value : value.toString().split(','), + operator: element.options.attrs.multiple ? 'in' : 'eq' + } + return param + } } const textSelectGridServiceImpl = new TextSelectGridServiceImpl() export default textSelectGridServiceImpl diff --git a/frontend/src/components/widget/serviceImpl/TextSelectServiceImpl.js b/frontend/src/components/widget/serviceImpl/TextSelectServiceImpl.js index ad2a8132cb..d5ed13d1ed 100644 --- a/frontend/src/components/widget/serviceImpl/TextSelectServiceImpl.js +++ b/frontend/src/components/widget/serviceImpl/TextSelectServiceImpl.js @@ -1,6 +1,5 @@ import { WidgetService } from '../service/WidgetService' - const leftPanel = { icon: 'iconfont icon-xialakuang', label: 'detextselect.label', @@ -81,6 +80,16 @@ class TextSelectServiceImpl extends WidgetService { } }) } + + getParam(element) { + const value = element.options.value + const param = { + component: element, + value: !value ? [] : Array.isArray(value) ? value : value.toString().split(','), + operator: element.options.attrs.multiple ? 'in' : 'eq' + } + return param + } } const textSelectServiceImpl = new TextSelectServiceImpl() export default textSelectServiceImpl diff --git a/frontend/src/components/widget/serviceImpl/TimeDateRangeServiceImpl.js b/frontend/src/components/widget/serviceImpl/TimeDateRangeServiceImpl.js index 7817769a66..f69e9d36db 100644 --- a/frontend/src/components/widget/serviceImpl/TimeDateRangeServiceImpl.js +++ b/frontend/src/components/widget/serviceImpl/TimeDateRangeServiceImpl.js @@ -1,7 +1,9 @@ import { WidgetService } from '../service/WidgetService' - +import { + timeSection +} from '@/utils' const leftPanel = { icon: 'iconfont icon-riqi', label: 'dedaterange.label', @@ -222,6 +224,64 @@ class TimeDateRangeServiceImpl extends WidgetService { return false } } + getParam(element) { + let timeArr = [] + if (element.options.attrs.default.isDynamic) { + let value = this.dynamicDateFormNow(element) + value = this.formatFilterValue(value) + timeArr = this.formatValues(value, element) + } else { + let value = this.fillValueDerfault(element) + value = this.formatFilterValue(value) + timeArr = this.formatValues(value, element) + } + const param = { + component: element, + value: timeArr, + operator: 'between' + } + return param + } + fillValueDerfault(element) { + const defaultV = element.options.value === null ? '' : element.options.value.toString() + if (element.options.attrs.type === 'daterange') { + if (defaultV === null || typeof defaultV === 'undefined' || defaultV === '' || defaultV === + '[object Object]') { + return [] + } + return defaultV.split(',').map(item => parseFloat(item)) + } else { + if (defaultV === null || typeof defaultV === 'undefined' || defaultV === '' || defaultV === + '[object Object]') { + return null + } + return parseFloat(defaultV.split(',')[0]) + } + } + formatFilterValue(values) { + if (values === null) return [] + if (Array.isArray(values)) return values + return [values] + } + formatValues(values, element) { + if (!values || values.length === 0) { + return [] + } + if (element.options.attrs.type === 'daterange') { + if (values.length !== 2) { + return null + } + let start = values[0] + let end = values[1] + start = timeSection(start, 'date')[0] + end = timeSection(end, 'date')[1] + const results = [start, end] + return results + } else { + const value = values[0] + return timeSection(parseFloat(value), element.options.attrs.type) + } + } } const timeDateRangeServiceImpl = new TimeDateRangeServiceImpl() export default timeDateRangeServiceImpl diff --git a/frontend/src/components/widget/serviceImpl/TimeDateServiceImpl.js b/frontend/src/components/widget/serviceImpl/TimeDateServiceImpl.js index 8c79246e64..8e5024cc45 100644 --- a/frontend/src/components/widget/serviceImpl/TimeDateServiceImpl.js +++ b/frontend/src/components/widget/serviceImpl/TimeDateServiceImpl.js @@ -1,7 +1,9 @@ import { WidgetService } from '../service/WidgetService' - +import { + timeSection +} from '@/utils' const leftPanel = { icon: 'iconfont icon-ri', label: 'dedate.label', @@ -153,6 +155,64 @@ class TimeDateServiceImpl extends WidgetService { } } } + getParam(element) { + let timeArr = [] + if (element.options.attrs.default.isDynamic) { + let value = this.dynamicDateFormNow(element) + value = this.formatFilterValue(value) + timeArr = this.formatValues(value, element) + } else { + let value = this.fillValueDerfault(element) + value = this.formatFilterValue(value) + timeArr = this.formatValues(value, element) + } + const param = { + component: element, + value: timeArr, + operator: 'between' + } + return param + } + fillValueDerfault(element) { + const defaultV = element.options.value === null ? '' : element.options.value.toString() + if (element.options.attrs.type === 'daterange') { + if (defaultV === null || typeof defaultV === 'undefined' || defaultV === '' || defaultV === + '[object Object]') { + return [] + } + return defaultV.split(',').map(item => parseFloat(item)) + } else { + if (defaultV === null || typeof defaultV === 'undefined' || defaultV === '' || defaultV === + '[object Object]') { + return null + } + return parseFloat(defaultV.split(',')[0]) + } + } + formatFilterValue(values) { + if (values === null) return [] + if (Array.isArray(values)) return values + return [values] + } + formatValues(values, element) { + if (!values || values.length === 0) { + return [] + } + if (element.options.attrs.type === 'daterange') { + if (values.length !== 2) { + return null + } + let start = values[0] + let end = values[1] + start = timeSection(start, 'date')[0] + end = timeSection(end, 'date')[1] + const results = [start, end] + return results + } else { + const value = values[0] + return timeSection(parseFloat(value), element.options.attrs.type) + } + } } const timeDateServiceImpl = new TimeDateServiceImpl({ name: 'timeDateWidget' diff --git a/frontend/src/components/widget/serviceImpl/TimeMonthServiceImpl.js b/frontend/src/components/widget/serviceImpl/TimeMonthServiceImpl.js index 41ee83ad9e..7471c381c4 100644 --- a/frontend/src/components/widget/serviceImpl/TimeMonthServiceImpl.js +++ b/frontend/src/components/widget/serviceImpl/TimeMonthServiceImpl.js @@ -1,5 +1,7 @@ import { WidgetService } from '../service/WidgetService' - +import { + timeSection +} from '@/utils' const leftPanel = { icon: 'iconfont icon-yue', label: 'deyearmonth.label', @@ -119,6 +121,64 @@ class TimeMonthServiceImpl extends WidgetService { } } } + getParam(element) { + let timeArr = [] + if (element.options.attrs.default.isDynamic) { + let value = this.dynamicDateFormNow(element) + value = this.formatFilterValue(value) + timeArr = this.formatValues(value, element) + } else { + let value = this.fillValueDerfault(element) + value = this.formatFilterValue(value) + timeArr = this.formatValues(value, element) + } + const param = { + component: element, + value: timeArr, + operator: 'between' + } + return param + } + fillValueDerfault(element) { + const defaultV = element.options.value === null ? '' : element.options.value.toString() + if (element.options.attrs.type === 'daterange') { + if (defaultV === null || typeof defaultV === 'undefined' || defaultV === '' || defaultV === + '[object Object]') { + return [] + } + return defaultV.split(',').map(item => parseFloat(item)) + } else { + if (defaultV === null || typeof defaultV === 'undefined' || defaultV === '' || defaultV === + '[object Object]') { + return null + } + return parseFloat(defaultV.split(',')[0]) + } + } + formatFilterValue(values) { + if (values === null) return [] + if (Array.isArray(values)) return values + return [values] + } + formatValues(values, element) { + if (!values || values.length === 0) { + return [] + } + if (element.options.attrs.type === 'daterange') { + if (values.length !== 2) { + return null + } + let start = values[0] + let end = values[1] + start = timeSection(start, 'date')[0] + end = timeSection(end, 'date')[1] + const results = [start, end] + return results + } else { + const value = values[0] + return timeSection(parseFloat(value), element.options.attrs.type) + } + } } const timeMonthServiceImpl = new TimeMonthServiceImpl() export default timeMonthServiceImpl diff --git a/frontend/src/components/widget/serviceImpl/TimeYearServiceImpl.js b/frontend/src/components/widget/serviceImpl/TimeYearServiceImpl.js index b8a7f817f9..2ae0a78234 100644 --- a/frontend/src/components/widget/serviceImpl/TimeYearServiceImpl.js +++ b/frontend/src/components/widget/serviceImpl/TimeYearServiceImpl.js @@ -1,5 +1,7 @@ import { WidgetService } from '../service/WidgetService' - +import { + timeSection +} from '@/utils' const leftPanel = { icon: 'iconfont icon-nian', label: 'deyear.label', @@ -110,6 +112,64 @@ class TimeYearServiceImpl extends WidgetService { return new Date(dynamicSuffix === 'before' ? (nowYear - dynamicPrefix) : (nowYear + dynamicPrefix), 0, 1).getTime() } } + getParam(element) { + let timeArr = [] + if (element.options.attrs.default.isDynamic) { + let value = this.dynamicDateFormNow(element) + value = this.formatFilterValue(value) + timeArr = this.formatValues(value, element) + } else { + let value = this.fillValueDerfault(element) + value = this.formatFilterValue(value) + timeArr = this.formatValues(value, element) + } + const param = { + component: element, + value: timeArr, + operator: 'between' + } + return param + } + fillValueDerfault(element) { + const defaultV = element.options.value === null ? '' : element.options.value.toString() + if (element.options.attrs.type === 'daterange') { + if (defaultV === null || typeof defaultV === 'undefined' || defaultV === '' || defaultV === + '[object Object]') { + return [] + } + return defaultV.split(',').map(item => parseFloat(item)) + } else { + if (defaultV === null || typeof defaultV === 'undefined' || defaultV === '' || defaultV === + '[object Object]') { + return null + } + return parseFloat(defaultV.split(',')[0]) + } + } + formatFilterValue(values) { + if (values === null) return [] + if (Array.isArray(values)) return values + return [values] + } + formatValues(values, element) { + if (!values || values.length === 0) { + return [] + } + if (element.options.attrs.type === 'daterange') { + if (values.length !== 2) { + return null + } + let start = values[0] + let end = values[1] + start = timeSection(start, 'date')[0] + end = timeSection(end, 'date')[1] + const results = [start, end] + return results + } else { + const value = values[0] + return timeSection(parseFloat(value), element.options.attrs.type) + } + } } const timeYearServiceImpl = new TimeYearServiceImpl() export default timeYearServiceImpl diff --git a/frontend/src/utils/conditionUtil.js b/frontend/src/utils/conditionUtil.js index 7cfee37f9f..a0cbea5ccf 100644 --- a/frontend/src/utils/conditionUtil.js +++ b/frontend/src/utils/conditionUtil.js @@ -1,5 +1,7 @@ import { Condition } from '@/components/widget/bean/Condition' +import { ApplicationContext } from '@/utils/ApplicationContext' + /** * 判断两个conditions数组是否相同 * @param {*} conditions1 @@ -36,3 +38,36 @@ export const formatLinkageCondition = obj => { const condition = new Condition(null, fieldId, operator, value, viewIds) return condition } + +export const buildFilterMap = panelItems => { + const viewIdMatch = (viewIds, viewId) => !viewIds || viewIds.length === 0 || viewIds.includes(viewId) + const result = {} + panelItems.forEach(element => { + if (element.type === 'view') { + result[element.propValue.viewId] = [] + } + }) + panelItems.forEach(element => { + if (element.type !== 'custom') { + return true + } + const widget = ApplicationContext.getService(element.serviceName) + const param = widget.getParam(element) + const condition = formatCondition(param) + const vValid = valueValid(condition) + const filterComponentId = condition.componentId + Object.keys(result).forEach(viewId => { + const vidMatch = viewIdMatch(condition.viewIds, viewId) + const viewFilters = result[viewId] + let j = viewFilters.length + while (j--) { + const filter = viewFilters[j] + if (filter.componentId === filterComponentId) { + viewFilters.splice(j, 1) + } + } + vidMatch && vValid && viewFilters.push(condition) + }) + }) + return result +}