From 664638b53d5841727f415befe9fae7b187baa5e1 Mon Sep 17 00:00:00 2001
From: David Mendez <dmendez@ebi.ac.uk>
Date: Thu, 16 Sep 2021 12:35:43 +0100
Subject: [PATCH] Report Cards: load structure before rendering asynchronously
---
.../ChemicalProbeReportCard.vue | 44 ++++++++++++++++---
.../CompoundReportCardGenerator.js | 5 +--
web-components-submodule | 2 +-
3 files changed, 40 insertions(+), 11 deletions(-)
diff --git a/components/report_cards/chemical_probe/ChemicalProbeReportCard.vue b/components/report_cards/chemical_probe/ChemicalProbeReportCard.vue
index 8c5363c..df67680 100644
--- a/components/report_cards/chemical_probe/ChemicalProbeReportCard.vue
+++ b/components/report_cards/chemical_probe/ChemicalProbeReportCard.vue
@@ -8,8 +8,13 @@
<script>
import { mapState } from 'vuex'
+import RequestNotifications from '@/web-components-submodule/utils/RequestNotifications.js'
import EntityReportCard from '~/web-components-submodule/components/common/ReportCards/EntityReportCard.vue'
import CompoundReportCardGenerator from '~/report_cards_structure/CompoundReportCardGenerator.js'
+import EntityNames from '~/web-components-submodule/standardisation/EntityNames.js'
+import ESProxyService from '~/web-components-submodule/services/ESProxyService.js'
+import IndexNames from '~/web-components-submodule/standardisation/IndexNames.js'
+import ObjectPropertyAccess from '~/web-components-submodule/utils/ObjectPropertyAccess.js'
export default {
components: {
@@ -30,13 +35,38 @@ export default {
reportCardStructure: (state) => state.probeReportCard.reportCardStructure,
}),
mounted() {
- const reportCardStructure = CompoundReportCardGenerator.generateReportCardStructure(
- this.itemID
- )
- this.$store.dispatch(
- 'probeReportCard/setReportCardStructure',
- reportCardStructure
- )
+ const docSource = ['pref_name']
+ const entityID = EntityNames.EubopenCompound.entityID
+ const indexName = IndexNames.getIndexNameFromEntityID(entityID)
+
+ ESProxyService.getESDocument(indexName, this.itemID, docSource)
+ .then((response) => {
+ const sourceObtained = response.data._source
+ const prefName = ObjectPropertyAccess.getPropertyPalue(
+ sourceObtained,
+ 'pref_name',
+ '',
+ false
+ )
+
+ const reportCardStructure = CompoundReportCardGenerator.generateReportCardStructure(
+ this.itemID,
+ prefName
+ )
+ this.$store.dispatch(
+ 'probeReportCard/setReportCardStructure',
+ reportCardStructure
+ )
+
+ this.$store.dispatch('probeReportCard/setStructureReady', true)
+ })
+ .catch((error) => {
+ RequestNotifications.dispatchRequestErrorNotification(
+ error,
+ this.$store.dispatch,
+ `There was an error while loading the page structure`
+ )
+ })
},
}
</script>
diff --git a/report_cards_structure/CompoundReportCardGenerator.js b/report_cards_structure/CompoundReportCardGenerator.js
index f4d7fab..75fd44a 100644
--- a/report_cards_structure/CompoundReportCardGenerator.js
+++ b/report_cards_structure/CompoundReportCardGenerator.js
@@ -5,12 +5,11 @@ import ProbeProfile from '~/components/report_cards/chemical_probe/ProbeProfile.
import ProbeMechanism from '~/components/report_cards/chemical_probe/ProbeMechanism.vue'
import CompoundCrystalStructures from '~/components/report_cards/chemical_probe/CompoundCrystalStructures.vue'
import CalculatedProperties from '~/components/report_cards/chemical_probe/CalculatedProperties.vue'
-import EntityNames from '~/web-components-submodule/standardisation/EntityNames.js'
const methods = {
- generateReportCardStructure(itemID) {
+ generateReportCardStructure(itemID, title) {
return {
- title: `${EntityNames.EubopenCompound.singularEntityName} ${itemID}`,
+ title,
sections: [
{
id: 'Summary',
diff --git a/web-components-submodule b/web-components-submodule
index cc3ba10..04914c6 160000
--- a/web-components-submodule
+++ b/web-components-submodule
@@ -1 +1 @@
-Subproject commit cc3ba1073b550930e96d018d610b23b82947fc65
+Subproject commit 04914c60725d9fbb0934065001e1dc07bf7e59d5
--
GitLab