diff --git a/src/views/admin/js/store/modules/report/actions.js b/src/views/admin/js/store/modules/report/actions.js index 31cc443ee..ec1bcce84 100644 --- a/src/views/admin/js/store/modules/report/actions.js +++ b/src/views/admin/js/store/modules/report/actions.js @@ -28,7 +28,7 @@ export const fetchMetadata = ({ commit }, { collectionId } ) => { if (collectionId && collectionId != 'default') endpoint += '/collection/' + collectionId + '/metadata'; else - endpoint += '/repository/metadata'; + endpoint += '/metadata'; return new Promise((resolve, reject) => { axios.tainacan.get(endpoint) @@ -42,6 +42,27 @@ export const fetchMetadata = ({ commit }, { collectionId } ) => { }); }; +export const fetchMetadataList = ({ commit }, { collectionId, metadatumId } ) => { + + let endpoint = '/reports'; + + if (collectionId && collectionId != 'default') + endpoint += '/collection/' + collectionId + '/metadata/' + metadatumId; + else + endpoint += '/metadata/' + metadatumId; + + return new Promise((resolve, reject) => { + axios.tainacan.get(endpoint) + .then(res => { + let metadataList = res.data.list; + + commit('setMetadataList', metadataList); + resolve(metadataList); + }) + .catch(error => reject(error)); + }); +}; + export const fetchCollectionsList = ({ commit }) => { let endpoint = '/reports/collection' diff --git a/src/views/admin/js/store/modules/report/getters.js b/src/views/admin/js/store/modules/report/getters.js index bd6ebcdf1..f32f284cc 100644 --- a/src/views/admin/js/store/modules/report/getters.js +++ b/src/views/admin/js/store/modules/report/getters.js @@ -6,6 +6,10 @@ export const getMetadata = state => { return state.metadata; }; +export const getMetadataList = state => { + return state.metadataList; +}; + export const getCollectionsList = state => { return state.collectionsList; }; diff --git a/src/views/admin/js/store/modules/report/index.js b/src/views/admin/js/store/modules/report/index.js index 3ba2b2f7b..2db9ce396 100644 --- a/src/views/admin/js/store/modules/report/index.js +++ b/src/views/admin/js/store/modules/report/index.js @@ -8,6 +8,7 @@ const state = { colletionsList: {}, taxonomyTerms: {}, metadata: {}, + metadataList: {}, stackedBarChartOptions: { chart: { type: 'bar', diff --git a/src/views/admin/js/store/modules/report/mutations.js b/src/views/admin/js/store/modules/report/mutations.js index f9f0ff0ac..236be7dfa 100644 --- a/src/views/admin/js/store/modules/report/mutations.js +++ b/src/views/admin/js/store/modules/report/mutations.js @@ -6,6 +6,10 @@ export const setMetadata = (state, metadata) => { state.metadata = metadata; }; +export const setMetadataList = (state, metadataList) => { + state.metadataList = metadataList; +}; + export const setCollectionsList = (state, collectionsList) => { state.collectionsList = collectionsList; }; diff --git a/src/views/reports/pages/reports-list.vue b/src/views/reports/pages/reports-list.vue index 630e14407..f2d2724a1 100644 --- a/src/views/reports/pages/reports-list.vue +++ b/src/views/reports/pages/reports-list.vue @@ -101,7 +101,7 @@ +
+ + +
+
@@ -156,16 +183,20 @@ export default { return { selectedCollection: 'default', selectedTaxonomy: '', + selectedMetadatum: '', isFetchingCollections: false, isFetchingSummary: false, isFetchingCollectionsList: false, isFetchingTaxonomiesList: false, isFetchingTaxonomyTerms: false, isFetchingMetadata: false, + isFetchingMetadataList: false, collectionsListChartSeries: [], collectionsListChartOptions: {}, taxonomiesListChartSeries: [], taxonomiesListChartOptions: {}, + metadataListChartSeries: [], + metadataListChartOptions: {}, taxonomyTermsChartSeries: [], taxonomyTermsChartOptions: {}, metadataTypeChartSeries: [], @@ -182,6 +213,7 @@ export default { ...mapGetters('report', { summary: 'getSummary', metadata: 'getMetadata', + metadataList: 'getMetadataList', taxonomyTerms: 'getTaxonomyTerms', taxonomiesList: 'getTaxonomiesList', collectionsList: 'getCollectionsList', @@ -191,6 +223,9 @@ export default { }), taxonomiesListArray() { return this.taxonomiesList && this.taxonomiesList != undefined ? Object.values(this.taxonomiesList) : []; + }, + metadataListArray() { + return this.metadata && this.metadata != undefined && this.metadata.distribution ? Object.values(this.metadata.distribution) : []; } }, watch: { @@ -198,10 +233,9 @@ export default { handler(to) { this.selectedCollection = to['collection'] ? to['collection'] : 'default'; this.loadSummary(); + this.loadMetadata(); - if (this.selectedCollection && this.selectedCollection != 'default') - this.loadMetadata(); - else { + if (!this.selectedCollection || this.selectedCollection == 'default') { this.loadCollectionsList(); this.loadTaxonomiesList(); } @@ -212,6 +246,10 @@ export default { selectedTaxonomy() { if (this.selectedTaxonomy && this.selectedTaxonomy != '') this.loadTaxonomyTerms(); + }, + selectedMetadatum() { + if (this.selectedMetadatum && this.selectedMetadatum != '') + this.loadMetadataList(); } }, created() { @@ -230,7 +268,8 @@ export default { 'fetchCollectionsList', 'fetchTaxonomiesList', 'fetchTaxonomyTerms', - 'fetchMetadata' + 'fetchMetadata', + 'fetchMetadataList' ]), loadCollections() { this.isFetchingCollections = true; @@ -272,6 +311,7 @@ export default { } if (this.metadata.distribution) { + // Building Metadata Distribution Bar chart const orderedMetadataDistributions = Object.values(this.metadata.distribution).sort((a, b) => b.fill_percentage - a.fill_percentage); let metadataDistributionValues = []; @@ -285,6 +325,10 @@ export default { metadataDistributionLabels.push(metadataDistribution.name); }) + // Sets first metadatum as the selected one + if (orderedMetadataDistributions.length) + this.selectedMetadatum = orderedMetadataDistributions[0].id; + this.metadataDistributionChartSeries = [ { name: this.$i18n.get('label_filled'), @@ -489,6 +533,51 @@ export default { }) .catch(() => this.isFetchingTaxonomyTerms = false); + }, + loadMetadataList() { + this.isFetchingMetadataList = true; + this.fetchMetadataList({ collectionId: this.collectionId, metadatumId: this.selectedMetadatum }) + .then(() => { + + // Building Taxonomy term usage chart + const orderedMetadata = Object.values(this.metadataList).sort((a, b) => a.total_items - b.total_items); + let metadataItemValues = []; + let metadataItemLabels = []; + + orderedMetadata.forEach(metadataItem => { + metadataItemValues.push(metadataItem.total_items); + metadataItemLabels.push(metadataItem.label); + }); + + this.metadataListChartSeries = [ + { + name: this.$i18n.get('label_items_with_this_metadum_value'), + data: metadataItemValues + } + ]; + + this.metadataListChartOptions = { + ...this.stackedBarChartOptions, + ...{ + title: { + text: this.$i18n.get('label_amount_of_items_per_metadatum_value') + }, + xaxis: { + type: 'category', + tickPlacement: 'on', + categories: metadataItemLabels, + }, + yaxis: { + title: { + text: this.$i18n.get('label_number_of_items') + } + } + } + } + + this.isFetchingMetadataList = false; + }) + .catch(() => this.isFetchingMetadataList = false); } } } diff --git a/src/views/tainacan-admin-i18n.php b/src/views/tainacan-admin-i18n.php index 890c37961..1a6daf0b3 100644 --- a/src/views/tainacan-admin-i18n.php +++ b/src/views/tainacan-admin-i18n.php @@ -508,6 +508,8 @@ return apply_filters( 'tainacan-admin-i18n', [ /* translators: To be displayed with the number of Taxonomies used in the colllection */ 'label_used' => __( 'Used', 'tainacan' ), 'label_select_a_taxonomy' => __( 'Select a taxonomy', 'tainacan' ), + 'label_items_with_this_metadum_value' => __( 'Items with this metadatum value', 'tainacan' ), + 'label_amount_of_items_per_metadatum_value' => __( 'Amount of items per metadatum value', 'tainacan' ), // Instructions. More complex sentences to guide user and placeholders 'instruction_delete_selected_collections' => __( 'Delete selected collections', 'tainacan' ),