diff --git a/client/platform/web-girder/api/divemetadata.service.ts b/client/platform/web-girder/api/divemetadata.service.ts index 45f92ac..ee1f19a 100644 --- a/client/platform/web-girder/api/divemetadata.service.ts +++ b/client/platform/web-girder/api/divemetadata.service.ts @@ -55,7 +55,7 @@ function getMetadataFilterValues(folderId: string, keys?: string[]) { }); } -function filterDiveMetadata(folderId: string, filters: DIVEMetadataFilter, offset = 0, limit = 50, sort = 'filename', sortdir = -1) { +function filterDiveMetadata(folderId: string, filters: DIVEMetadataFilter, offset = 0, limit = 50, sort = 'filename', sortdir = 1) { return girderRest.get(`dive_metadata/${folderId}/filter`, { params: { filters, offset, limit, sort, sortdir, diff --git a/client/platform/web-girder/views/DIVEMetadataClone.vue b/client/platform/web-girder/views/DIVEMetadataClone.vue index 4594f8d..df34290 100644 --- a/client/platform/web-girder/views/DIVEMetadataClone.vue +++ b/client/platform/web-girder/views/DIVEMetadataClone.vue @@ -82,7 +82,6 @@ export default defineComponent({ > { + if (typeof (props.displayConfig) === 'string') { + await prompt({ + title: 'Filter Error', + text: 'The default filter for this folder is not a JSON Object it appears to be a string', + }); + } + }; + watch(() => props.displayConfig, () => checkConfig()); + const search: Ref = ref(props.rootFilter.search || ''); const filters: Ref = ref({}); const splitFilters = computed(() => { @@ -61,6 +74,15 @@ export default defineComponent({ const filtersOn = ref(false); const defaultEnabledKeys: Ref = ref([]); // If items should default to on because they are in the URL parameters const currentFilter: Ref = ref({}); + const sortParams = computed(() => { + if (splitFilters.value) { + return ['filename', ...Object.keys(splitFilters.value.displayed), ...Object.keys(splitFilters.value.advanced)]; + } + return ['filename']; + }); + const sortValue = ref('filename'); + const sortDir = ref(1); + const pageList = computed(() => { const list = []; for (let i = 0; i < props.totalPages; i += 1) { @@ -86,7 +108,7 @@ export default defineComponent({ loadCurrentFilter(); }); - const loadCurrentFilter = () => { + const loadCurrentFilter = async () => { if (props.rootFilter.metadataFilters && Object.keys(props.rootFilter.metadataFilters).length) { currentFilter.value.metadataFilters = props.rootFilter.metadataFilters; } @@ -99,9 +121,21 @@ export default defineComponent({ loadCurrentFilter(); }); + watch(filtersOn, (newVal, oldVal) => { + if (!newVal && oldVal) { + // We remove all of the old filters then + Object.keys(splitFilters.value.advanced).forEach((key) => { + if (currentFilter.value && currentFilter.value.metadataFilters && currentFilter.value.metadataFilters[key]) { + delete currentFilter.value.metadataFilters[key]; + } + }); + emit('updateFilters', { filter: currentFilter.value, sortVal: sortValue.value, sortDir: sortDir.value }); + } + }); + watch(search, () => { currentFilter.value.search = search.value; - emit('updateFilters', currentFilter.value); + emit('updateFilters', { filter: currentFilter.value, sortVal: sortValue.value, sortDir: sortDir.value }); }); const clearFilter = (key: string) => { @@ -111,7 +145,7 @@ export default defineComponent({ if (currentFilter.value.metadataFilters[key]) { delete currentFilter.value.metadataFilters[key]; } - emit('updateFilters', currentFilter.value); + emit('updateFilters', { filter: currentFilter.value, sortVal: sortValue.value, sortDir: sortDir.value }); }; const updateFilter = (key: string, { value, category } : {value: string | string[] | number | boolean | number[], category: MetadataFilterItem['category']}) => { if (!currentFilter.value.metadataFilters) { @@ -132,20 +166,24 @@ export default defineComponent({ value, }; } - emit('updateFilters', currentFilter.value); + emit('updateFilters', { filter: currentFilter.value, sortVal: sortValue.value, sortDir: sortDir.value }); }; const changePage = async (page: number) => { emit('update:currentPage', page - 1); }; + watch([sortValue, sortDir], () => { + emit('updateFilters', { filter: currentFilter.value, sortVal: sortValue.value, sortDir: sortDir.value }); + }); + const getDefaultValue = (key: string) => { - if (props.rootFilter?.metadataFilters) { - if (props.rootFilter.metadataFilters[key] && props.rootFilter.metadataFilters[key].category === 'numerical') { - return props.rootFilter.metadataFilters[key].range; + if (currentFilter.value.metadataFilters) { + if (currentFilter.value.metadataFilters[key] && currentFilter.value.metadataFilters[key].category === 'numerical') { + return currentFilter.value.metadataFilters[key].range; } - if (props.rootFilter.metadataFilters[key]) { - return props.rootFilter.metadataFilters[key].value; + if (currentFilter.value.metadataFilters[key]) { + return currentFilter.value.metadataFilters[key].value; } } return undefined; @@ -164,6 +202,9 @@ export default defineComponent({ updateFilter, clearFilter, getDefaultValue, + sortValue, + sortParams, + sortDir, }; }, }); @@ -172,7 +213,7 @@ export default defineComponent({