First usage of summary endpoints #483.

This commit is contained in:
mateuswetah 2021-03-02 18:38:26 -03:00
parent 87174e3f8c
commit 0a52fd416e
7 changed files with 77 additions and 50 deletions

View File

@ -19,3 +19,24 @@ export const fetchReports = ({ commit }, {} ) => {
.catch(error => reject(error));
});
};
export const fetchSummary = ({ commit }, { collectionId } ) => {
let endpoint = '/reports';
if (collectionId && collectionId != 'default')
endpoint += '/collection/' + collectionId + '/summary';
else
endpoint += '/repository/summary';
return new Promise((resolve, reject) => {
axios.tainacan.get(endpoint)
.then(res => {
let summary = res.data;
commit('setSummary', summary);
resolve(summary);
})
.catch(error => reject(error));
});
};

View File

@ -1,3 +1,7 @@
export const getReports = state => {
return state.reports;
};
};
export const getSummary = state => {
return state.summary;
};

View File

@ -644,7 +644,8 @@ const state = {
},
},
}
]
],
summary: {}
};
function generateData (count, yrange) {
var i = 0;

View File

@ -1,3 +1,7 @@
export const setReports = (state, reports) => {
state.reports = reports;
};
export const setSummary = (state, summary) => {
state.summary = summary;
};

View File

@ -33,38 +33,19 @@
export default {
props: {
sourceCollection: String,
entityType: String
entityType: String,
summary: Object
},
data() {
return {
total: 0,
totalByStatus: {}
}
},
mounted() {
// Fake data until we fetch and load this from store
if (this.entityType === 'items') {
this.total = 2344;
this.totalByStatus = {
'publish': 2326,
'private': 8,
'draft': 9,
'trash': 1
}
} else if (this.entityType === 'collections') {
this.total = 23;
this.totalByStatus = {
'publish': 18,
'private': 2,
'trash': 3
}
} else if (this.entityType === 'taxonomies') {
this.total = 8;
this.totalByStatus = {
'publish': 5,
'private': 0,
'draft': 1,
'trash': 1
computed: {
total() {
return this.summary.totals[this.entityType].total;
},
totalByStatus() {
return {
'publish': this.summary.totals[this.entityType].publish,
'private': this.summary.totals[this.entityType].private,
'draft': this.summary.totals[this.entityType].draft,
'trash': this.summary.totals[this.entityType].trash
}
}
}

View File

@ -19,14 +19,6 @@ import NumberBlock from '../components/number-block.vue';
Vue.use(VueApexCharts)
// Apex.theme = {
// monochrome: {
// enabled: true,
// color: '#298596',
// shadeTo: 'light',
// shadeIntensity: 0.65
// }
// }
Apex.colors = [
'#298596', // Tainacan Turquoise
'#01295c', // Tainacan Blue
@ -37,7 +29,6 @@ Apex.colors = [
'#ed4f63' // Tainacan Pink
];
Vue.use(I18NPlugin);
Vue.use(UserCapabilitiesPlugin);
Vue.use(StatusHelperPlugin);

View File

@ -17,22 +17,32 @@
</option>
</select>
<div class="columns is-multiline">
<div class="column is-full is-one-third-tablet has-text-centered">
<div
v-if="!selectedCollection || selectedCollection == 'default'"
class="column is-full is-one-third-tablet has-text-centered">
<number-block
v-if="!isFetchingSummary && summary && summary.totals"
class="postbox"
:source-collection="selectedCollection"
:summary="summary"
entity-type="collections"/>
</div>
<div class="column is-full is-one-third-tablet has-text-centered">
<number-block
v-if="!isFetchingSummary && summary && summary.totals"
class="postbox"
:source-collection="selectedCollection"
:summary="summary"
entity-type="items"/>
</div>
<div class="column is-full is-one-third-tablet has-text-centered">
<div
v-if="!selectedCollection || selectedCollection == 'default'"
class="column is-full is-one-third-tablet has-text-centered">
<number-block
v-if="!isFetchingSummary && summary && summary.totals"
class="postbox"
:source-collection="selectedCollection"
:summary="summary"
entity-type="taxonomies"/>
</div>
<div class="column is-half is-one-quarter-widescreen">
@ -83,7 +93,8 @@ export default {
data() {
return {
selectedCollection: 'default',
isLoadingCollections: false,
isFetchingCollections: false,
isFetchingSummary: false
}
},
computed: {
@ -92,11 +103,13 @@ export default {
}),
...mapGetters('report', {
reports: 'getReports',
}),
summary: 'getSummary'
})
},
watch: {
'$route.query' (to) {
this.selectedCollection = to['collection'] ? to['collection'] : 'default';
this.loadSummary();
}
},
created() {
@ -104,15 +117,27 @@ export default {
this.selectedCollection = this.$route.query['collection'] ? this.$route.query['collection'] : 'default';
// Loads collection for the select input
this.isLoadingCollections = true;
this.isFetchingCollections = true;
this.fetchAllCollectionNames()
.then(() => this.isLoadingCollections = false)
.catch(() => this.isLoadingCollections = false);
.then(() => {
this.loadSummary();
this.isFetchingCollections = false;
})
.catch(() => this.isFetchingCollections = false);
},
methods: {
...mapActions('collection', [
'fetchAllCollectionNames'
])
]),
...mapActions('report', [
'fetchSummary',
]),
loadSummary() {
this.isFetchingSummary = true;
this.fetchSummary({ collectionId: this.selectedCollection })
.then(() => this.isFetchingSummary = false)
.catch(() => this.isFetchingSummary = false);
}
}
}
</script>