Skip to content
Snippets Groups Projects
Commit 3342ff00 authored by David Mendez's avatar David Mendez
Browse files

start to generate report card structure programatically

parent 6e4dbf53
No related branches found
No related tags found
1 merge request!5Add compounds and target browser mockups
......@@ -2,43 +2,18 @@
<v-container>
<v-row>
<v-col cols="9">
<h1 class="primary--text">PFI-6: A Chemical Probe for human MLLT1/3</h1>
<h1 class="primary--text">{{ reportCardStructure.title }}</h1>
<v-divider />
<br />
<v-row>
<v-col cols="12">
<h2 class="primary--text">Summary</h2>
</v-col>
</v-row>
<v-row>
<v-col cols="12"> <Summary /> </v-col>
</v-row>
<v-row>
<v-col cols="12">
<h2 class="primary--text">
Chemical Probe & Negative Control Structures and Use
</h2>
</v-col>
</v-row>
<v-row>
<v-col cols="12"> <ControlStructuresAndUse /> </v-col>
</v-row>
<v-row>
<v-col cols="12">
<h2 class="primary--text">Chemical Probe Profile</h2>
</v-col>
</v-row>
<v-row>
<v-col cols="12"> <ProbeProfile /> </v-col>
</v-row>
<v-row>
<v-col cols="12">
<h2 class="primary--text">Crystal Structures</h2>
</v-col>
</v-row>
<v-row>
<v-col cols="12"> <CrystalStructures /> </v-col>
</v-row>
<div
v-for="section in reportCardStructure.sections"
:key="section.id"
class="section-container"
>
<ReportCardSection :section-description="section" />
<v-divider />
</div>
</v-col>
<v-col cols="3"> <Navigator /> </v-col>
</v-row>
......@@ -46,21 +21,27 @@
</template>
<script>
import Summary from '~/components/report_cards/chemical_probe/Summary.vue'
import ControlStructuresAndUse from '~/components/report_cards/chemical_probe/ControlStructuresAndUse.vue'
import ProbeProfile from '~/components/report_cards/chemical_probe/ProbeProfile.vue'
import CrystalStructures from '~/components/report_cards/chemical_probe/CrystalStructures.vue'
import Navigator from '~/components/report_cards/Navigator.vue'
import ReportCardSection from '~/components/report_cards/shared/ReportCardSection.vue'
import CompoundReportCardGenerator from '~/report_cards_structure/CompoundReportCardGenerator.js'
export default {
components: {
Summary,
ControlStructuresAndUse,
ProbeProfile,
CrystalStructures,
Navigator,
ReportCardSection,
},
computed: {
reportCardStructure() {
return CompoundReportCardGenerator.generateReportCardStructure()
},
},
}
</script>
<style></style>
<style>
.section-container {
padding: 10px 0;
margin-bottom: 10px;
}
</style>
<template>
<div>
<v-row>
<v-col cols="12">
<h2 class="primary--text">{{ sectionDescription.title }}</h2>
</v-col>
</v-row>
<v-row>
<v-col cols="12">
<component :is="sectionDescription.component"></component>
</v-col>
</v-row>
</div>
</template>
<script>
export default {
props: {
sectionDescription: {
type: Object,
default: () => {},
},
},
}
</script>
<style></style>
<template>
<div>Target report card!</div>
</template>
<script>
export default {}
</script>
<style></style>
File moved
<template>
<v-row justify="center" align="center">
<v-col cols="12" sm="8" md="6">
<v-btn color="primary" outlined to="/chemical_probe/1">
Go to Chemical Probe
</v-btn>
<v-btn color="primary" outlined to="/compound/1"> Go to Compound </v-btn>
<h1>Lorem ipsum</h1>
<p>
Lorem ipsum dolor sit amet, consectetur adipiscing elit. Praesent dictum
......
<template>
<div><TargetReportCard /></div>
</template>
<script>
import TargetReportCard from '~/components/report_cards/target/TargetReportCard.vue'
export default {
components: {
TargetReportCard,
},
}
</script>
<style></style>
import Summary from '~/components/report_cards/chemical_probe/Summary.vue'
import ControlStructuresAndUse from '~/components/report_cards/chemical_probe/ControlStructuresAndUse.vue'
import ProbeProfile from '~/components/report_cards/chemical_probe/ProbeProfile.vue'
import CrystalStructures from '~/components/report_cards/chemical_probe/CrystalStructures.vue'
const methods = {
generateReportCardStructure() {
return {
title: 'PFI-6: A Chemical Probe for human MLLT1/3',
sections: [
{
id: 'Summary',
title: 'Summary',
component: Summary,
},
{
id: 'ControlStructuresAndUse',
title: 'ControlStructuresAndUse',
component: ControlStructuresAndUse,
},
{
id: 'ProbeProfile',
title: 'ProbeProfile',
component: ProbeProfile,
},
{
id: 'CrystalStructures',
title: 'CrystalStructures',
component: CrystalStructures,
},
],
}
},
}
export default methods
0% or .
You are about to add 0 people to the discussion. Proceed with caution.
Finish editing this message first!
Please register or to comment