diff --git a/frontend/src/App.vue b/frontend/src/App.vue index ca6dfc2..1e4c61c 100644 --- a/frontend/src/App.vue +++ b/frontend/src/App.vue @@ -1,7 +1,7 @@ + + diff --git a/frontend/src/components/QcView.vue b/frontend/src/components/QcView.vue index 0ab4c6a..ce0a84c 100644 --- a/frontend/src/components/QcView.vue +++ b/frontend/src/components/QcView.vue @@ -3,15 +3,36 @@ * An information view containing run data and metrics useful for QC assessment */ - import { computed } from "vue"; + import { computed, ref, watch } from "vue"; import groupMetrics from "../utils/metrics.js"; import { combineLabelWithPlate } from "../utils/text.js" + import PoolStats from "./PoolStats.vue"; + import LangQc from "../utils/langqc"; + + + const dataClient = new LangQc() const props = defineProps({ // Well object representing one prepared input for the instrument // Expects content in the form of lang_qc/models/pacbio/well.py:PacBioWellFull well: Object, - }); + }) + + const poolStats = ref(null) + watch(() => props.well, () => { + poolStats.value = null // empty in case next well doesn't have a pool + dataClient.getPoolMetrics(props.well.id_product).then( + (response) => { poolStats.value = response } + ).catch((error) => { + if (error.message.match("Conflict")) { + // Nothing to do + } else { + console.log(error) + // make a banner show this error? + } + }) + }, { immediate: true} + ) const slURL = computed(() => { let hostname = props.well.metrics.smrt_link.hostname @@ -97,7 +118,6 @@ } return '' }) -