This commit is contained in:
2021-02-04 15:14:58 +00:00
parent c9ee25bd64
commit 84cb4967ad
2 changed files with 41 additions and 42 deletions

View File

@@ -21,6 +21,8 @@ LISTVIEW REPLACE CURRENT <----HERE not THERE ---v
store last filterid in session if not already so survives a full page refresh?
Implement code to load saved filters, refresh them on edit in filtermanager
"ListView" still referenced throughout data-table, possibly passed to selection dependent code (reports, bulk ops?)
Implement filter buttons for mobile mode
Need filter drop down to select which columns to filter which triggers opening regular filter items
Needs also to show a filter beside "headings" which are filtered so it's known

View File

@@ -16,6 +16,7 @@
<v-card>
<!-- {{ dataTablePagingOptions }}
{{ headers }} -->
{{ activeFilterId }}
<v-card-title>
<v-select
v-model="activeFilterId"
@@ -23,7 +24,7 @@
item-text="name"
item-value="id"
:label="$ay.t('Filter')"
@input="savedFilterSelected"
@input="selectedFilterChanged"
prepend-icon="$ayiEdit"
@click:prepend="editFilter()"
data-cy="selectSavedFilter"
@@ -35,7 +36,7 @@
<v-icon data-cy="refresh">$ayiSync</v-icon>
</v-btn>
<v-btn class="ml-12" @click="editListView">
<v-btn class="ml-12" @click="editColumnView">
<v-icon data-cy="filter">$ayiColumns</v-icon>
</v-btn>
</div>
@@ -486,7 +487,7 @@ export default {
}
//has changed something important so refetch and put a pin in last paging settings for next time
this.getDataFromApi();
await this.getDataFromApi();
this.lastDataTablePagingOptions = this.dataTablePagingOptions;
},
deep: true
@@ -533,7 +534,8 @@ export default {
let res = await this.$refs.dataTableFilterManager.open();
if (res && res.refresh == true) {
//refresh the filter picklist and get data from api
this.getDataFromApi();
await fetchSavedFilterList(this);
await this.getDataFromApi();
}
},
keyArrayFromSortByArray(sortBy) {
@@ -613,7 +615,7 @@ export default {
this.selected.map(z => z.id)
);
},
editListView() {
editColumnView() {
this.$router.push({
name: "ay-data-list-column-view",
params: {
@@ -632,43 +634,32 @@ export default {
//needs to show as temp unsaved filter or overridden or something
},
savedFilterSelected: async function() {
return;
let vm = this;
selectedFilterChanged: async function() {
// let vm = this;
//If listview had changed it can only have changed *away* from the unsaved filter item if it's present so just remove the unsaved filter item if it exists
// //first prevent the following changes from triggering a fetch
// vm.loading = true;
// //always go back to page one on a change of data list view
// vm.dataTablePagingOptions.page = 1;
//DANGER DANGER WARNING: if using lodash to remove item it might mess with vue reactivity
//this example does remove from the array and does update a plain mustache rendition of it on the page but doesn't update the select itself
//whereas using the native javascript array splice function *does* update the select because vue wraps splice and other native methods specifically
//so it can properly update the dom
// window.$gz. _.remove(vm.selectLists.savedFilters, function(n) {
// return n.id == -1;
// });
// for (let i = vm.selectLists.savedFilters.length - 1; i >= 0; i--) {
// if (vm.selectLists.savedFilters[i].id === -1) {
// vm.selectLists.savedFilters.splice(i, 1);
// }
// }
//first prevent the following changes from triggering a fetch
vm.loading = true;
//always go back to page one on a change of data list view
vm.dataTablePagingOptions.page = 1;
// if (vm.activeFilterId == 0) {
// //default view, no saved, no cached
// vm.listView = undefined;
// saveFormSettings(vm);
// } else if (vm.activeFilterId > 0) {
// await fetchListView(vm);
// saveFormSettings(vm);
// }
for (let i = vm.selectLists.savedFilters.length - 1; i >= 0; i--) {
if (vm.selectLists.savedFilters[i].id === -1) {
vm.selectLists.savedFilters.splice(i, 1);
}
}
if (vm.activeFilterId == 0) {
//default view, no saved, no cached
vm.listView = undefined;
saveFormSettings(vm);
} else if (vm.activeFilterId > 0) {
await fetchListView(vm);
saveFormSettings(vm);
}
//fetch data because listview has changed
vm.loading = false;
vm.getDataFromApi();
// //fetch data because listview has changed
// vm.loading = false;
await this.getDataFromApi();
},
gridCellButtonClick(key, i, ot) {
let typeToOpen = null;
@@ -1068,13 +1059,13 @@ async function fetchEnums(columnData) {
//
async function initForm(vm) {
vm.timeZoneName = window.$gz.locale.getResolvedTimeZoneName();
await populateSelectionLists(vm);
await loadFormSettings(vm);
await fetchSavedFilterList(vm);
loadFormSettings(vm);
}
////////////////////
//
async function populateSelectionLists(vm) {
async function fetchSavedFilterList(vm) {
//http://localhost:7575/api/v8/data-list-filter/list?ListKey=TestWidgetDataList
let res = await window.$gz.api.get(
"data-list-filter/list?ListKey=" + vm.dataListKey
@@ -1084,11 +1075,17 @@ async function populateSelectionLists(vm) {
window.$gz.form.setErrorBoxErrors(vm);
} else {
vm.selectLists.savedFilters = res.data;
//confirm we still have the current active filter id (if it's not empty 0)
if (vm.activeFilterId != 0) {
if (!res.data.find(z => z.id == vm.activeFilterId)) {
vm.activeFilterId = 0;
}
}
if (vm.activeFilterId == 0) {
let dflt = res.data.find(z => z.default == true);
if (!dflt) {
throw new Error(
`data-table::populateSelectionLists - No default filter returned for listKey '${vm.dataListKey}'`
`data-table::fetchSavedFilterList - No default filter returned for listKey '${vm.dataListKey}'`
);
} else {
vm.activeFilterId = dflt.id;