Changed formatting of persons list, added data loss warning.
This commit is contained in:
parent
2981d9aa3a
commit
ecd3b6772c
@ -64,13 +64,9 @@
|
|||||||
<b-button variant="outline-secondary" v-on:click="addPerson()">+</b-button>
|
<b-button variant="outline-secondary" v-on:click="addPerson()">+</b-button>
|
||||||
</b-col>
|
</b-col>
|
||||||
</b-row>
|
</b-row>
|
||||||
<b-row>
|
<b-row align-v="center">
|
||||||
<b-col>
|
<b-col class="mt-1" v-if="persons == null || persons.length === 0">Enter your name(s) one at a time!</b-col>
|
||||||
<b-list-group>
|
<b-col class="mt-1" cols="2" v-bind:key="index" v-for="(item, index) in persons">{{ item }} <a v-on:click="deletePerson(index)"><v-icon name="times-circle"/></a></b-col>
|
||||||
<b-list-group-item v-if="persons === [] || persons == null">Enter your name(s)!</b-list-group-item>
|
|
||||||
<b-list-group-item v-bind:key="index" v-for="(item, index) in persons">{{ item }} <a v-on:click="deletePerson(index)"><v-icon name="times-circle"/></a></b-list-group-item>
|
|
||||||
</b-list-group>
|
|
||||||
</b-col>
|
|
||||||
</b-row>
|
</b-row>
|
||||||
<br />
|
<br />
|
||||||
<b-form @submit="onSubmit" id="submission-form" novalidate>
|
<b-form @submit="onSubmit" id="submission-form" novalidate>
|
||||||
@ -135,13 +131,14 @@
|
|||||||
title="Enter password to confirm submission"
|
title="Enter password to confirm submission"
|
||||||
@ok="handleOk"
|
@ok="handleOk"
|
||||||
@shown="clearPassword">
|
@shown="clearPassword">
|
||||||
<b-alert v-if="persons.length === 0" variant="warning" show>No individual names assigned to this observation.</b-alert>
|
<b-alert v-if="persons == null || persons.length === 0" variant="warning" show><v-icon name="exclamation-circle" scale="1.5" /> No individual names assigned to this observation.</b-alert>
|
||||||
<form @submit.stop.prevent="handleSubmit">
|
<form @submit.stop.prevent="handleSubmit">
|
||||||
<b-form-input type="password"
|
<b-form-input type="password"
|
||||||
placeholder="Enter password"
|
placeholder="Enter password"
|
||||||
v-model="submitPassword"></b-form-input>
|
v-model="submitPassword"></b-form-input>
|
||||||
</form>
|
</form>
|
||||||
</b-modal>
|
</b-modal>
|
||||||
|
<p class="mt-3"><v-icon name="exclamation-circle" scale="1.5" color="gold"/> <i>Leaving this page before submitting will delete all entered data.</i></p>
|
||||||
</b-container>
|
</b-container>
|
||||||
<b-container v-else>
|
<b-container v-else>
|
||||||
<b-row>
|
<b-row>
|
||||||
@ -163,6 +160,7 @@ import "bootstrap/dist/css/bootstrap.css";
|
|||||||
import "bootstrap-vue/dist/bootstrap-vue.css";
|
import "bootstrap-vue/dist/bootstrap-vue.css";
|
||||||
import "vue-awesome/icons/tag";
|
import "vue-awesome/icons/tag";
|
||||||
import "vue-awesome/icons/times-circle";
|
import "vue-awesome/icons/times-circle";
|
||||||
|
import "vue-awesome/icons/exclamation-circle";
|
||||||
import { mapState } from "vuex";
|
import { mapState } from "vuex";
|
||||||
import Vue from "vue";
|
import Vue from "vue";
|
||||||
|
|
||||||
|
@ -34,7 +34,7 @@
|
|||||||
<b-row align-h="center">
|
<b-row align-h="center">
|
||||||
<b-col>
|
<b-col>
|
||||||
<b-form-group label="Who">
|
<b-form-group label="Who">
|
||||||
<b-form-input :value="whom" @input="setWhom" type="text"
|
<b-form-input :value="whom" @input="setWhom" type="text" placeholder="i.e. shift name, individual names will be entered later"
|
||||||
style="text-align:center;" required></b-form-input>
|
style="text-align:center;" required></b-form-input>
|
||||||
</b-form-group>
|
</b-form-group>
|
||||||
</b-col>
|
</b-col>
|
||||||
|
Loading…
Reference in New Issue
Block a user