Browse Source

feat: Add option to disable auto filter apply

Added toggle button to toggle autofilter

closes #229

Signed-off-by: Pranav C <61551451+pranavxc@users.noreply.github.com>
pull/306/head
Pranav C 3 years ago
parent
commit
b5227c08ce
  1. 1
      packages/nc-gui/components/project/spreadsheet/components/columnFilter.vue
  2. 38
      packages/nc-gui/components/project/spreadsheet/components/columnFilterMenu.vue
  3. 6
      packages/nc-gui/store/windows.js

1
packages/nc-gui/components/project/spreadsheet/components/columnFilter.vue

@ -101,6 +101,7 @@
<v-icon small color="grey">mdi-plus</v-icon>
Add Filter
</v-btn>
<slot></slot>
</div>
</template>

38
packages/nc-gui/components/project/spreadsheet/components/columnFilterMenu.vue

@ -17,7 +17,25 @@
</v-badge>
</template>
<column-filter v-model="filters" :field-list="fieldList">
<div class="d-flex align-center mx-2" @click.stop>
<v-checkbox
hide-details
dense
id="col-filter-checkbox"
type="checkbox"
color="grey"
v-model="autosave">
<template v-slot:label>
<span class="grey--text caption">Auto apply</span>
</template>
</v-checkbox>
<v-spacer></v-spacer>
<v-btn v-show="!autosave" color="primary" @click="$emit('input', filters)" small class="caption ml-2">Apply
changes
</v-btn>
</div>
</column-filter>
</v-menu>
</template>
@ -32,19 +50,35 @@ export default {
data: () => ({
filters: [],
}),
computed: {
autosave: {
set(v) {
this.$store.commit('windows/MutAutoApplyFilter', v)
}, get() {
return this.$store.state.windows.autoApplyFilter;
}
}
},
methods: {},
created() {
this.filters = this.value || [];
this.filters = this.autosave ? this.value || [] : JSON.parse(JSON.stringify(this.value || []));
},
watch: {
filters: {
handler(v) {
if (this.autosave) {
this.$emit('input', v)
}
},
deep: true
},
autosave(v) {
if (!v) {
this.filters = JSON.parse(JSON.stringify(this.value || []));
}
},
value(v) {
this.filters = v || [];
this.filters = this.autosave ? v || [] : JSON.parse(JSON.stringify(v || []));
}
}
}

6
packages/nc-gui/store/windows.js

@ -44,10 +44,14 @@ export const state = () => ({
metatables: false,
nc: true,
miniSponsorCard: 0,
screensaver: true
screensaver: true,
autoApplyFilter: true
});
export const mutations = {
MutAutoApplyFilter(state, v) {
state.autoApplyFilter = v;
},
MutToggleLogWindow(state, show) {
state.logWindow = !state.logWindow;
}, MutScreensaver(state, show) {

Loading…
Cancel
Save