Persons now rendered in Bootstrap columns rather than a list.

This commit is contained in:
neviyn 2018-10-22 10:44:45 +01:00
parent 537d89a61b
commit 95b40bac3d

View File

@ -53,39 +53,40 @@
<b-tab v-for="(observation, index) in observationData" v-bind:key="index">
<p slot="title">{{ observation.date }}<br/>{{ observation.whom }} {{ observation.type }}<br/>{{ observation.observed }}</p>
<h2>{{ observation.date }}, {{ observation.whom }}<br/>{{ observation.type }}, {{ observation.observed }}</h2>
<ul>
<li v-for="person in observation.persons">{{ person.name }}</li>
</ul>
<b-row align-h="center">
<b-col cols="2" v-for="person in observation.persons">{{ person.name }}</b-col>
</b-row>
<br />
<b-row>
<b-col class="centered-image">
<b-col class="centered-image" v-if="observation.monitoring">
<img src="../assets/Monitoring.svg" class="image-opacity"/>
<div class="image-centered-text">{{ observation.monitoring }}</div>
</b-col>
<b-col class="centered-image">
<b-col class="centered-image" v-if="observation.controlProcedural">
<img src="../assets/Control.svg" class="image-opacity"/>
<div class="image-centered-text">{{ observation.controlProcedural }}</div>
</b-col>
<b-col class="centered-image">
<b-col class="centered-image" v-if="observation.control">
<img src="../assets/Control.svg" class="image-opacity"/>
<div class="image-centered-text">{{ observation.control }}</div>
</b-col>
<b-col class="centered-image">
<b-col class="centered-image" v-if="observation.conservatism">
<img src="../assets/Conservatism.svg" class="image-opacity"/>
<div class="image-centered-text">{{ observation.conservatism }}</div>
</b-col>
<b-col class="centered-image">
<b-col class="centered-image" v-if="observation.teamworkCommunications">
<img src="../assets/Teamwork.svg" class="image-opacity"/>
<div class="image-centered-text">{{ observation.teamworkCommunications }}</div>
</b-col>
<b-col class="centered-image">
<b-col class="centered-image" v-if="observation.teamworkLeadership">
<img src="../assets/Teamwork.svg" class="image-opacity"/>
<div class="image-centered-text">{{ observation.teamworkLeadership }}</div>
</b-col>
<b-col class="centered-image">
<b-col class="centered-image" v-if="observation.teamworkWorkload">
<img src="../assets/Teamwork.svg" class="image-opacity"/>
<div class="image-centered-text">{{ observation.teamworkWorkload }}</div>
</b-col>
<b-col class="centered-image">
<b-col class="centered-image" v-if="observation.knowledge">
<img src="../assets/Knowledge.svg" class="image-opacity"/>
<div class="image-centered-text">{{ observation.knowledge }}</div>
</b-col>