From 791d276f9d46ffc16cdb312282d34e590e6aef0f Mon Sep 17 00:00:00 2001 From: 18alantom <2.alan.tom@gmail.com> Date: Tue, 21 Dec 2021 11:38:31 +0530 Subject: [PATCH] fix: add grouped dropdown for export, add reset filter in Report.vue --- src/components/DropdownWithActions.vue | 20 +++++++--- src/pages/Report.vue | 51 +++++++++++++++++++++----- 2 files changed, 56 insertions(+), 15 deletions(-) diff --git a/src/components/DropdownWithActions.vue b/src/components/DropdownWithActions.vue index 299bbbe1..2858370b 100644 --- a/src/components/DropdownWithActions.vue +++ b/src/components/DropdownWithActions.vue @@ -6,8 +6,15 @@ right > @@ -19,10 +26,13 @@ import Button from '@/components/Button'; export default { name: 'DropdownWithActions', - props: ['actions'], + props: { + actions: { default: [] }, + type: { type: String, default: 'secondary' }, + }, components: { Dropdown, - Button - } + Button, + }, }; diff --git a/src/pages/Report.vue b/src/pages/Report.vue index eb08ddb2..895d934c 100644 --- a/src/pages/Report.vue +++ b/src/pages/Report.vue @@ -2,16 +2,18 @@

{{ report.title }}

-
@@ -25,7 +27,7 @@ v-for="df in report.filterFields" :key="df.fieldname" > -
+
{{ df.label }}
@@ -101,6 +102,7 @@ import SearchBar from '@/components/SearchBar'; import Row from '@/components/Row'; import WithScroll from '@/components/WithScroll'; import FormControl from '@/components/Controls/FormControl'; +import DropdownWithActions from '../components/DropdownWithActions.vue'; import reportViewConfig from '@/../reports/view'; export default { @@ -113,6 +115,7 @@ export default { Row, FormControl, WithScroll, + DropdownWithActions, }, provide() { return { @@ -210,6 +213,11 @@ export default { this.fetchReportData(); }, + async resetFilters() { + await this.setDefaultFilters(); + await this.fetchReportData(); + }, + async setDefaultFilters() { for (let df of this.report.filterFields) { let defaultValue = null; @@ -273,6 +281,29 @@ export default { }, }, computed: { + actions() { + return [ + ...(this.report.actions?.filter((action) => !action.group)??[]), + { + label: this._('Reset Filters'), + action: this.resetFilters, + }, + ]; + }, + actionGroups() { + const groups = + this.report.actions + ?.filter((action) => action.group) + .reduce((acc, action) => { + acc[action.group] ??= { type: action.type, actions: [] }; + const actionWithoutGroup = Object.assign({}, action); + delete actionWithoutGroup.group; + acc[action.group].actions.push(actionWithoutGroup); + return acc; + }, {}) ?? {}; + + return Object.keys(groups).map((label) => ({ label, ...groups[label] })); + }, columns() { return this.loading ? this.blankStateData.columns