diff --git a/frontend/src/components/canvas/components/Editor/ComponentWrapper.vue b/frontend/src/components/canvas/components/Editor/ComponentWrapper.vue index d45db98d6a..61c2bae5bc 100644 --- a/frontend/src/components/canvas/components/Editor/ComponentWrapper.vue +++ b/frontend/src/components/canvas/components/Editor/ComponentWrapper.vue @@ -265,6 +265,11 @@ export default { } else { return null } + }, + clearHandler() { + if (this.$refs.deOutWidget && this.$refs.deOutWidget.clearHandler) { + this.$refs.deOutWidget.clearHandler() + } } } } diff --git a/frontend/src/components/canvas/components/Editor/Preview.vue b/frontend/src/components/canvas/components/Editor/Preview.vue index f3eeea879a..1e9c8c1ef4 100644 --- a/frontend/src/components/canvas/components/Editor/Preview.vue +++ b/frontend/src/components/canvas/components/Editor/Preview.vue @@ -302,22 +302,26 @@ export default { this.initListen() this.$store.commit('clearLinkageSettingInfo', false) this.canvasStyleDataInit() - // 如果当前终端设备是移动端,则进行移动端的布局设计 if (this.terminal === 'mobile') { this.initMobileCanvas() } bus.$on('trigger-search-button', this.triggerSearchButton) + bus.$on('trigger-reset-button', this.triggerResetButton) }, beforeDestroy() { erd.uninstall(this.$refs.canvasInfoTemp) erd.uninstall(this.$refs.canvasInfoMain) clearInterval(this.timer) eventBus.$off('openChartDetailsDialog', this.openChartDetailsDialog) - bus.$on('trigger-search-button', this.triggerSearchButton) + bus.$off('trigger-search-button', this.triggerSearchButton) + bus.$off('trigger-reset-button', this.triggerResetButton) }, methods: { - triggerSearchButton() { - const result = this.buildButtonFilterMap(this.componentData) + triggerResetButton() { + this.triggerSearchButton(true) + }, + triggerSearchButton(isClear = false) { + const result = this.buildButtonFilterMap(this.componentData, isClear) this.searchButtonInfo.autoTrigger = result.autoTrigger this.searchButtonInfo.filterMap = result.filterMap this.buttonFilterMap = this.searchButtonInfo.filterMap @@ -328,7 +332,7 @@ export default { } }) }, - buildButtonFilterMap(panelItems) { + buildButtonFilterMap(panelItems, isClear = false) { const result = { buttonExist: false, relationFilterIds: [], @@ -357,11 +361,11 @@ export default { result.relationFilterIds = matchFilters.map(item => item.id) let viewKeyMap = buildViewKeyMap(panelItems) - viewKeyMap = this.buildViewKeyFilters(matchFilters, viewKeyMap) + viewKeyMap = this.buildViewKeyFilters(matchFilters, viewKeyMap, isClear) result.filterMap = viewKeyMap return result }, - buildViewKeyFilters(panelItems, result) { + buildViewKeyFilters(panelItems, result, isClear = false) { const refs = this.$refs if (!this.$refs['viewWrapperChild'] || !this.$refs['viewWrapperChild'].length) return result panelItems.forEach((element) => { @@ -375,6 +379,9 @@ export default { } let param = null const wrapperChild = refs['viewWrapperChild'][index] + if (isClear) { + wrapperChild.clearHandler && wrapperChild.clearHandler() + } param = wrapperChild.getCondition && wrapperChild.getCondition() const condition = formatCondition(param) const vValid = valueValid(condition) diff --git a/frontend/src/components/canvas/components/Editor/index.vue b/frontend/src/components/canvas/components/Editor/index.vue index 430c5cc8b5..0a4145d0fa 100644 --- a/frontend/src/components/canvas/components/Editor/index.vue +++ b/frontend/src/components/canvas/components/Editor/index.vue @@ -1097,6 +1097,7 @@ export default { eventBus.$on('openChartDetailsDialog', this.openChartDetailsDialog) bus.$on('onRemoveLastItem', this.removeLastItem) bus.$on('trigger-search-button', this.triggerSearchButton) + bus.$on('trigger-reset-button', this.triggerResetButton) bus.$on('refresh-button-info', this.refreshButtonInfo) // 矩阵定位调试模式 @@ -1113,20 +1114,24 @@ export default { bus.$off('onRemoveLastItem', this.removeLastItem) bus.$off('trigger-search-button', this.triggerSearchButton) bus.$off('refresh-button-info', this.refreshButtonInfo) + bus.$off('trigger-reset-button', this.triggerResetButton) }, created() { }, methods: { - refreshButtonInfo() { - const result = this.buildButtonFilterMap(this.componentData) + triggerResetButton() { + this.triggerSearchButton(true) + }, + refreshButtonInfo(isClear = false) { + const result = this.buildButtonFilterMap(this.componentData, isClear) this.searchButtonInfo.buttonExist = result.buttonExist this.searchButtonInfo.relationFilterIds = result.relationFilterIds this.searchButtonInfo.filterMap = result.filterMap this.searchButtonInfo.autoTrigger = result.autoTrigger this.buttonFilterMap = this.searchButtonInfo.filterMap }, - triggerSearchButton() { - this.refreshButtonInfo() + triggerSearchButton(isClear = false) { + this.refreshButtonInfo(isClear) this.buttonFilterMap = this.searchButtonInfo.filterMap this.componentData.forEach(component => { @@ -1134,10 +1139,8 @@ export default { component.filters = this.buttonFilterMap[component.propValue.viewId] } }) - - // this.$store.commit('addViewFilter', param) }, - buildButtonFilterMap(panelItems) { + buildButtonFilterMap(panelItems, isClear = false) { const result = { buttonExist: false, relationFilterIds: [], @@ -1166,11 +1169,11 @@ export default { result.relationFilterIds = matchFilters.map(item => item.id) let viewKeyMap = buildViewKeyMap(panelItems) - viewKeyMap = this.buildViewKeyFilters(matchFilters, viewKeyMap) + viewKeyMap = this.buildViewKeyFilters(matchFilters, viewKeyMap, isClear) result.filterMap = viewKeyMap return result }, - buildViewKeyFilters(panelItems, result) { + buildViewKeyFilters(panelItems, result, isClear = false) { const refs = this.$refs if (!this.$refs['wrapperChild'] || !this.$refs['wrapperChild'].length) return result const len = this.$refs['wrapperChild'].length @@ -1186,6 +1189,9 @@ export default { } const wrapperChild = refs['wrapperChild'][index] if (!wrapperChild || !wrapperChild.getCondition) return true + if (isClear) { + wrapperChild.clearHandler && wrapperChild.clearHandler() + } param = wrapperChild.getCondition && wrapperChild.getCondition() const condition = formatCondition(param) const vValid = valueValid(condition) diff --git a/frontend/src/components/canvas/custom-component/UserView.vue b/frontend/src/components/canvas/custom-component/UserView.vue index e22043f639..2df11c9c07 100644 --- a/frontend/src/components/canvas/custom-component/UserView.vue +++ b/frontend/src/components/canvas/custom-component/UserView.vue @@ -582,6 +582,8 @@ export default { this.requestStatus = 'error' if (err.message && err.message.indexOf('timeout') > -1) { this.message = this.$t('panel.timeout_refresh') + } else if (!err.response) { + this.httpRequest.status = false } else { this.httpRequest.status = err.response.data.success this.httpRequest.msg = err.response.data.message diff --git a/frontend/src/components/dataease/DeOutWidget.vue b/frontend/src/components/dataease/DeOutWidget.vue index ce5e13a7a8..fe349cd352 100644 --- a/frontend/src/components/dataease/DeOutWidget.vue +++ b/frontend/src/components/dataease/DeOutWidget.vue @@ -163,6 +163,11 @@ export default { return this.$refs['deOutWidget'].getCondition() } return null + }, + clearHandler() { + if (this.$refs && this.$refs['deOutWidget'] && this.$refs['deOutWidget'].clearHandler) { + this.$refs['deOutWidget'].clearHandler() + } } } } diff --git a/frontend/src/components/widget/DeWidget/DeDate.vue b/frontend/src/components/widget/DeWidget/DeDate.vue index 3dfc48ce2f..56320c7dae 100644 --- a/frontend/src/components/widget/DeWidget/DeDate.vue +++ b/frontend/src/components/widget/DeWidget/DeDate.vue @@ -160,6 +160,9 @@ export default { bus.$off('reset-default-value', this.resetDefaultValue) }, methods: { + clearHandler() { + this.values = null + }, onScroll() { if (this.onFocus) { this.$refs.dateRef.hidePicker() diff --git a/frontend/src/components/widget/DeWidget/DeInputSearch.vue b/frontend/src/components/widget/DeWidget/DeInputSearch.vue index 36c1ebf647..1011a5fa33 100644 --- a/frontend/src/components/widget/DeWidget/DeInputSearch.vue +++ b/frontend/src/components/widget/DeWidget/DeInputSearch.vue @@ -83,6 +83,9 @@ export default { bus.$off('reset-default-value', this.resetDefaultValue) }, methods: { + clearHandler() { + this.value = null + }, resetDefaultValue(id) { if (this.inDraw && this.manualModify && this.element.id === id) { this.value = this.fillValueDerfault() diff --git a/frontend/src/components/widget/DeWidget/DeNumberRange.vue b/frontend/src/components/widget/DeWidget/DeNumberRange.vue index 00774301b3..5f146afbe1 100644 --- a/frontend/src/components/widget/DeWidget/DeNumberRange.vue +++ b/frontend/src/components/widget/DeWidget/DeNumberRange.vue @@ -116,6 +116,10 @@ export default { bus.$off('reset-default-value', this.resetDefaultValue) }, methods: { + clearHandler() { + this.form.min = null + this.form.max = null + }, resetDefaultValue(id) { if (this.inDraw && this.manualModify && this.element.id === id) { const values = this.element.options.value diff --git a/frontend/src/components/widget/DeWidget/DeResetButton.vue b/frontend/src/components/widget/DeWidget/DeResetButton.vue new file mode 100644 index 0000000000..a6c56e07c0 --- /dev/null +++ b/frontend/src/components/widget/DeWidget/DeResetButton.vue @@ -0,0 +1,52 @@ + + + + + diff --git a/frontend/src/components/widget/DeWidget/DeSelect.vue b/frontend/src/components/widget/DeWidget/DeSelect.vue index 4f1feeacda..9c1ef73a6e 100644 --- a/frontend/src/components/widget/DeWidget/DeSelect.vue +++ b/frontend/src/components/widget/DeWidget/DeSelect.vue @@ -212,6 +212,9 @@ export default { bus.$off('reset-default-value', this.resetDefaultValue) }, methods: { + clearHandler() { + this.value = null + }, filterMethod(key) { this.keyWord = key }, @@ -231,7 +234,7 @@ export default { }, handleElTagStyle() { setTimeout(() => { - textSelectWidget(this.$refs['deSelect'].$el, this.element.style) + this.$refs['deSelect'] && this.$refs['deSelect'].$el && textSelectWidget(this.$refs['deSelect'].$el, this.element.style) }, 50) }, initLoad() { @@ -281,9 +284,10 @@ export default { }, handleShowNumber() { this.showNumber = false - const tags = this.$refs.deSelect.$refs.visualSelect.$refs.tags this.$nextTick(() => { + if (!this.$refs.deSelect || !this.$refs.deSelect.$refs.visualSelect || !this.$refs.deSelect.$refs.visualSelect.$refs.tags) return + const tags = this.$refs.deSelect.$refs.visualSelect.$refs.tags if (!this.element.options.attrs.multiple || !this.$refs.deSelect || !tags) { return } diff --git a/frontend/src/components/widget/DeWidget/DeSelectGrid.vue b/frontend/src/components/widget/DeWidget/DeSelectGrid.vue index 8eff4f5b00..4ea1abdc6a 100644 --- a/frontend/src/components/widget/DeWidget/DeSelectGrid.vue +++ b/frontend/src/components/widget/DeWidget/DeSelectGrid.vue @@ -212,6 +212,9 @@ export default { bus.$off('reset-default-value', this.resetDefaultValue) }, methods: { + clearHandler() { + this.value = null + }, resetDefaultValue(id) { if (this.inDraw && this.manualModify && this.element.id === id) { this.value = this.fillValueDerfault() diff --git a/frontend/src/components/widget/DeWidget/DeSelectTree.vue b/frontend/src/components/widget/DeWidget/DeSelectTree.vue index d27a7acbf4..fd815eb905 100644 --- a/frontend/src/components/widget/DeWidget/DeSelectTree.vue +++ b/frontend/src/components/widget/DeWidget/DeSelectTree.vue @@ -222,6 +222,9 @@ export default { }, methods: { + clearHandler() { + this.value = null + }, resetDefaultValue(id) { if (this.inDraw && this.manualModify && this.element.id === id) { this.value = this.fillValueDerfault() diff --git a/frontend/src/components/widget/DeWidget/SearchButton.vue b/frontend/src/components/widget/DeWidget/SearchButton.vue deleted file mode 100644 index f003d7d679..0000000000 --- a/frontend/src/components/widget/DeWidget/SearchButton.vue +++ /dev/null @@ -1,29 +0,0 @@ - - - - - \ No newline at end of file diff --git a/frontend/src/components/widget/serviceImpl/ButtonResetServiceImpl.js b/frontend/src/components/widget/serviceImpl/ButtonResetServiceImpl.js new file mode 100644 index 0000000000..b95fbca54a --- /dev/null +++ b/frontend/src/components/widget/serviceImpl/ButtonResetServiceImpl.js @@ -0,0 +1,55 @@ +import { WidgetService } from '../service/WidgetService' + +const leftPanel = { + icon: 'iconfont icon-icon_clear_outlined', + label: 'desresetbutton.label', + defaultClass: 'time-filter' +} + +const drawPanel = { + type: 'custom-button', + style: { + width: 150, + height: 60, + fontSize: 14, + fontWeight: 500, + lineHeight: '', + letterSpacing: 0, + textAlign: '', + color: '' + }, + options: { + attrs: { + type: '', + round: false, + plain: true + + }, + value: '清空' + }, + component: 'de-reset-button', + miniSizex: 1, + miniSizey: 1 +} + +class ButtonResetServiceImpl extends WidgetService { + constructor(options = {}) { + Object.assign(options, { name: 'buttonResetWidget' }) + super(options) + this.filterDialog = false + this.buttonDialog = true + this.showSwitch = false + } + + initLeftPanel() { + const value = JSON.parse(JSON.stringify(leftPanel)) + return value + } + + initDrawPanel() { + const value = JSON.parse(JSON.stringify(drawPanel)) + return value + } +} +const buttonResetServiceImpl = new ButtonResetServiceImpl() +export default buttonResetServiceImpl diff --git a/frontend/src/lang/en.js b/frontend/src/lang/en.js index f7f3f79a5c..2156abc7c9 100644 --- a/frontend/src/lang/en.js +++ b/frontend/src/lang/en.js @@ -2084,6 +2084,11 @@ export default { auto_trigger_tip: 'Automatically trigger once when entering the preview page', range_tip: 'Default association all filter components' }, + desresetbutton: { + label: 'Clear', + reset: 'Reset', + text: 'Text' + }, denumberselect: { label: 'Number selector', placeholder: 'Please select' diff --git a/frontend/src/lang/tw.js b/frontend/src/lang/tw.js index ab7cd56da9..c3f0598096 100644 --- a/frontend/src/lang/tw.js +++ b/frontend/src/lang/tw.js @@ -2094,6 +2094,11 @@ export default { auto_trigger_tip: '進入預覽頁面自動觸發一次', range_tip: '默認關聯全部過濾組件' }, + desresetbutton: { + label: '清空按鈕', + reset: '重置按鈕', + text: '名稱' + }, denumberselect: { label: '數字下拉', placeholder: '請選擇' diff --git a/frontend/src/lang/zh.js b/frontend/src/lang/zh.js index 557f002abe..7c7b1377e1 100644 --- a/frontend/src/lang/zh.js +++ b/frontend/src/lang/zh.js @@ -2105,6 +2105,12 @@ export default { auto_trigger_tip: '进入预览页面自动触发一次', range_tip: '默认关联全部过滤组件' }, + + desresetbutton: { + label: '清空按钮', + reset: '重置按钮', + text: '名称' + }, denumberselect: { label: '数字下拉', placeholder: '请选择' diff --git a/frontend/src/utils/conditionUtil.js b/frontend/src/utils/conditionUtil.js index f4299073bd..a9b8dc42ac 100644 --- a/frontend/src/utils/conditionUtil.js +++ b/frontend/src/utils/conditionUtil.js @@ -100,5 +100,21 @@ export const buildFilterMap = panelItems => { let result = buildViewKeyMap(panelItems) result = buildViewKeyFilters(panelItems, result) + fillElementsFilter(panelItems, result) return result } + +export const fillElementsFilter = (panelItems, filterMap) => { + panelItems.forEach(element => { + if (element.type === 'view') { + element.filters = filterMap[element.propValue.viewId] || [] + } + if (element.type === 'de-tabs') { + element.options.tabList && element.options.tabList.forEach(tab => { + if (tab.content && tab.content.propValue && tab.content.propValue.viewId) { + tab.content.filters = filterMap[tab.content.propValue.viewId] || [] + } + }) + } + }) +} diff --git a/frontend/src/views/panel/edit/index.vue b/frontend/src/views/panel/edit/index.vue index 9b2e24c949..723a72f299 100644 --- a/frontend/src/views/panel/edit/index.vue +++ b/frontend/src/views/panel/edit/index.vue @@ -246,7 +246,7 @@ @close="cancelButton" > + + +
+ + + + + + + {{ $t('commons.confirm') }} + {{ $t('commons.cancel') }} + + +
+ + + diff --git a/frontend/src/views/panel/filter/index.vue b/frontend/src/views/panel/filter/index.vue index 394c37dc9c..a99b39cf2a 100644 --- a/frontend/src/views/panel/filter/index.vue +++ b/frontend/src/views/panel/filter/index.vue @@ -9,7 +9,7 @@ v-for="(widget, index) in item" :key="widget.widgetName+index" :data-id="widget.widgetName" - :draggable="widget.widgetName !== 'buttonSureWidget' || !searchButtonExist" + :draggable="(widget.widgetName !== 'buttonSureWidget' && widget.widgetName !== 'buttonResetWidget') || (widget.widgetName === 'buttonSureWidget' && !searchButtonExist) || (widget.widgetName === 'buttonResetWidget' && searchButtonExist)" :data-index="index" :class="'filter-widget '+ (widget.defaultClass || '')" > @@ -56,7 +56,8 @@ export default { 'numberRangeWidget' ], '按钮': [ - 'buttonSureWidget' + 'buttonSureWidget', + 'buttonResetWidget' ] } } @@ -69,17 +70,39 @@ export default { ]), searchButtonExist() { return this.componentData && this.componentData.some(component => component.type === 'custom-button' && component.serviceName === 'buttonSureWidget') + }, + resetButtonExist() { + return this.componentData && this.componentData.some(component => component.type === 'custom-button' && component.serviceName === 'buttonResetWidget') + }, + resetButtonDisable() { + return !this.resetButtonExist && this.searchButtonExist } }, watch: { searchButtonExist(val, old) { if (val === old) return if (val) { - this.widgetSubjects['按钮'][0].widgetName = 'buttonSureWidget' this.widgetSubjects['按钮'][0].defaultClass = 'button-disable-filter' + if (this.resetButtonExist) { + this.widgetSubjects['按钮'][1].defaultClass = 'button-disable-filter' + } else { + this.widgetSubjects['按钮'][1].defaultClass = 'time-filter' + } } else { - this.widgetSubjects['按钮'][0].widgetName = 'buttonSureWidget' this.widgetSubjects['按钮'][0].defaultClass = 'time-filter' + this.widgetSubjects['按钮'][1].defaultClass = 'button-disable-filter' + } + }, + resetButtonExist(val, old) { + if (val === old) return + if (val) { + this.widgetSubjects['按钮'][1].defaultClass = 'button-disable-filter' + } else { + if (this.searchButtonExist) { + this.widgetSubjects['按钮'][1].defaultClass = 'time-filter' + } else { + this.widgetSubjects['按钮'][1].defaultClass = 'button-disable-filter' + } } } }, @@ -98,6 +121,9 @@ export default { if (this.searchButtonExist && widgetName === 'buttonSureWidget') { result.defaultClass = 'button-disable-filter' } + if (!this.searchButtonExist && widgetName === 'buttonResetWidget') { + result.defaultClass = ' button-disable-filter' + } return result }) }