Eubopen: Add target compound activity section

components/report_cards/target/ActivityCharts.vue

-<template>
-  <v-card color="yellow lighten-4" outlined>
-    <v-card-text>
-      <EntityRelations />
-    </v-card-text>
-  </v-card>
-</template>
-
-<script>
-import EntityRelations from '~/web-components-submodule/components/common/ReportCards/EntityRelations/EntityRelations.vue'
-export default {
-  components: {
-    EntityRelations,
-  },
-}
-</script>
-
-<style></style>

components/report_cards/target/ActivityCharts/ActivityCharts.vue

+<template>
+  <v-card outlined>
+    <v-card-text>
+      <v-skeleton-loader
+        v-if="loadingInitialParams"
+        type="card"
+      ></v-skeleton-loader>
+      <ActivityTable v-else :chembl-i-d="chemblID" />
+    </v-card-text>
+  </v-card>
+</template>
+
+<script>
+import RequestNotifications from '@/web-components-submodule/utils/RequestNotifications.js'
+import EntityNames from '~/web-components-submodule/standardisation/EntityNames.js'
+import IndexNames from '~/web-components-submodule/standardisation/IndexNames.js'
+import ESProxyService from '~/web-components-submodule/services/ESProxyService.js'
+import ActivityTable from '~/components/report_cards/target/ActivityCharts/ActivityTable.vue'
+
+export default {
+  components: {
+    ActivityTable,
+  },
+  props: {
+    itemID: {
+      type: String,
+      default: () => undefined,
+    },
+  },
+  data() {
+    return {
+      loadingInitialParams: true,
+      chemblID: undefined,
+    }
+  },
+  mounted() {
+    const entityID = EntityNames.EubopenTarget.entityID
+    const docSource = ['target_chembl_id']
+    const indexName = IndexNames.getIndexNameFromEntityID(entityID)
+
+    ESProxyService.getESDocument(indexName, this.itemID, docSource)
+      .then((response) => {
+        this.chemblID = response.data._source.target_chembl_id
+        this.loadingInitialParams = false
+      })
+      .catch((error) => {
+        RequestNotifications.dispatchRequestErrorNotification(
+          error,
+          this.$store.dispatch,
+          `There was an error while loading the activity data initial params for target ${this.itemID}`
+        )
+      })
+  },
+}
+</script>
+
+<style></style>

components/report_cards/target/ActivityCharts/ActivityTable.vue

+<template>
+  <ChEMBLDataTable
+    :dataset-state="datasetState"
+    :store-module-name="storeModuleName"
+    :outlined-card="true"
+  />
+</template>
+
+<script>
+import { datasetMixin } from '~/web-components-submodule/mixins/datasets/datasetMixin.js'
+import ChEMBLDataTable from '~/web-components-submodule/components/common/dataSets/data_table/ChEMBLDataTable.vue'
+import EntityNames from '~/web-components-submodule/standardisation/EntityNames.js'
+import TargetActivities from '~/web-components-submodule/store/datasets/generators/eubopen/activity/TargetActivities.js'
+
+export default {
+  components: {
+    ChEMBLDataTable,
+  },
+  mixins: [datasetMixin],
+  props: {
+    chemblID: {
+      type: String,
+      default: () => undefined,
+    },
+    storeModuleName: {
+      type: String,
+      default: () => `target_activity_table`,
+    },
+  },
+  data() {
+    return {
+      propertiesGroups: {
+        1: {
+          id: 'eubopen_target_activity_charts_table',
+          selected: true,
+          allHeaders: [],
+        },
+      },
+      entityID: EntityNames.EubopenActivity.entityID,
+      customDataRepresentationParams: {
+        possiblePageSizes: [5, 10],
+        itemsPerPage: 5,
+      },
+    }
+  },
+  computed: {
+    starterParams() {
+      const starterParams = TargetActivities.getReportCardStarterParams(
+        EntityNames.EubopenActivity.entityID,
+        this.chemblID,
+        this.propertiesGroups
+      )
+      return starterParams
+    },
+  },
+}
+</script>
+
+<style></style>

components/report_cards/target/ProbesAndChemogenomicCompounds.vue

+<template>
+  <v-card outlined>
+    <v-card-text class="yellow lighten-4">
+      Coming soon, see this issue
+      <a href="https://gitlab.ebi.ac.uk/chembl/eubopen/eubopen-web/-/issues/16">
+        #16 </a
+      >.
+    </v-card-text>
+  </v-card>
+</template>
+
+<script>
+export default {}
+</script>
+
+<style></style>

pages/target/_id.vue

@@ -40,7 +40,6 @@ export default {
         const reportCardURL = LinksToEntities[entityID].getLinkToReportCard(
           itemID
         )
-        console.log('going to redirect: ', reportCardURL)
         redirect(reportCardURL)
         return
       } catch (e) {
@@ -50,7 +49,6 @@ export default {
         })
       }
     } else {
-      console.log('show report card for : ', itemID)
       try {
         const docSource = ['pref_name']
         const result = await MetadataLoader.getMetadataForEntity(

report_cards_structure/TargetReportCardGenerator.js

 import NameAndClassification from '~/components/report_cards/target/NameAndClassification.vue'
-import ActivityCharts from '~/components/report_cards/target/ActivityCharts.vue'
+import ActivityCharts from '~/components/report_cards/target/ActivityCharts/ActivityCharts.vue'
 import EntityNames from '~/web-components-submodule/standardisation/EntityNames.js'
 import TargetCrystalStructures from '~/components/report_cards/target/TargetCrystalStructures.vue'
+import ProbesAndChemogenomicCompounds from '~/components/report_cards/target/ProbesAndChemogenomicCompounds.vue'
 
 const methods = {
   generateReportCardStructure(itemID, prefName) {
@@ -15,17 +16,23 @@ const methods = {
           component: NameAndClassification,
           index: 0,
         },
+        {
+          id: 'ProbesAndChemogenomicCompounds',
+          title: 'Probes and Chemogenomic Compounds',
+          component: ProbesAndChemogenomicCompounds,
+          index: 1,
+        },
         {
           id: 'ActivityCharts',
-          title: 'Activity Charts',
+          title: 'Compound activity',
           component: ActivityCharts,
-          index: 1,
+          index: 2,
         },
         {
           id: 'CrystalStructures',
           title: 'Uniprot Accessions',
           component: TargetCrystalStructures,
-          index: 2,
+          index: 3,
         },
       ],
     }

web-components-submodule @ bb037e18

-Subproject commit 6caa04a10333c2bc750b89d8cafd7d3951acc16a
+Subproject commit bb037e186c9d2858516412f333c820cc01577020