Added UI for adding a tutor.
This commit is contained in:
parent
7ac7d2b02f
commit
8fbd8c8117
@ -4,6 +4,7 @@ import Home from "./views/Home.vue";
|
||||
import Observation from "./views/Observation.vue";
|
||||
import Stats from "./views/Stats.vue";
|
||||
import NewSite from "./views/NewSite.vue";
|
||||
import NewTutor from "./views/NewTutor.vue";
|
||||
|
||||
Vue.use(Router);
|
||||
|
||||
@ -28,6 +29,11 @@ export default new Router({
|
||||
path: "/newsite",
|
||||
name: "newSite",
|
||||
component: NewSite
|
||||
},
|
||||
{
|
||||
path: "/newtutor",
|
||||
name: "newTutor",
|
||||
component: NewTutor
|
||||
}
|
||||
]
|
||||
});
|
||||
|
@ -1,15 +1,15 @@
|
||||
<template>
|
||||
<b-container>
|
||||
<h2>New Site</h2>
|
||||
<b-form @submit="onSubmit">
|
||||
<b-form-group id="submission-form" label="Site Name">
|
||||
<b-form @submit="onSubmit" id="submission-form">
|
||||
<b-form-group horizontal label="Site Name">
|
||||
<b-form-input v-model="siteName" type="text" />
|
||||
</b-form-group>
|
||||
<b-button type="submit" size="lg" variant="primary">Submit</b-button>
|
||||
</b-form>
|
||||
<br />
|
||||
<b-alert :show="dismissCountDown" dismissible fade :variant="alertVariant" @dismissed="dismissCountDown=0" @dismiss-count-down="countDownChanged">
|
||||
{{ alertText}}
|
||||
{{ alertText }}
|
||||
</b-alert>
|
||||
</b-container>
|
||||
</template>
|
||||
|
78
frontend/src/views/NewTutor.vue
Normal file
78
frontend/src/views/NewTutor.vue
Normal file
@ -0,0 +1,78 @@
|
||||
<template>
|
||||
<b-container>
|
||||
<h2>New Tutor</h2>
|
||||
<b-form @submit="onSubmit" id="submission-form">
|
||||
<b-form-group horizontal label="Site">
|
||||
<b-form-select v-model="siteSelection" :options="siteOptions" style="text-align:center;" />
|
||||
</b-form-group>
|
||||
<b-form-group horizontal label="Tutor Name">
|
||||
<b-form-input v-model="tutorName" type="text" />
|
||||
</b-form-group>
|
||||
<b-button type="submit" size="lg" variant="primary">Submit</b-button>
|
||||
</b-form>
|
||||
<br />
|
||||
<b-alert :show="dismissCountDown" dismissible fade :variant="alertVariant" @dismissed="dismissCountDown=0" @dismiss-count-down="countDownChanged">
|
||||
{{ alertText }}
|
||||
</b-alert>
|
||||
</b-container>
|
||||
</template>
|
||||
|
||||
<script>
|
||||
import Vue from "vue";
|
||||
export default {
|
||||
name: "newTutor",
|
||||
data() {
|
||||
return {
|
||||
siteOptions: [],
|
||||
siteSelection: null,
|
||||
tutorName: null,
|
||||
dismissSecs: 5,
|
||||
dismissCountDown: 0,
|
||||
alertVariant: "info",
|
||||
alertText: ""
|
||||
};
|
||||
},
|
||||
mounted() {
|
||||
Vue.axios
|
||||
.get("/api/site/all")
|
||||
.then(response => {
|
||||
this.siteOptions = response.data;
|
||||
})
|
||||
.catch(error => {
|
||||
this.alertText = error.response.data;
|
||||
this.alertVariant = "danger";
|
||||
});
|
||||
},
|
||||
methods: {
|
||||
countDownChanged: function(dismissCountDown) {
|
||||
this.dismissCountDown = dismissCountDown;
|
||||
},
|
||||
showAlert: function() {
|
||||
this.dismissCountDown = this.dismissSecs;
|
||||
},
|
||||
onSubmit: function(e) {
|
||||
e.preventDefault();
|
||||
e.stopPropagation();
|
||||
var form = document.getElementById("submission-form");
|
||||
if (form.checkValidity()) {
|
||||
Vue.axios
|
||||
.post("/api/tutor", {
|
||||
sideId: this.siteSelection,
|
||||
name: this.tutorName
|
||||
})
|
||||
.then(response => {
|
||||
this.alertVariant = "success";
|
||||
this.alertText = "Successfully added " + response.data.name;
|
||||
this.showAlert();
|
||||
})
|
||||
.catch(error => {
|
||||
this.alertVariant = "danger";
|
||||
this.alertText = "Failed to add Site";
|
||||
this.showAlert();
|
||||
console.log(error);
|
||||
});
|
||||
}
|
||||
}
|
||||
}
|
||||
};
|
||||
</script>
|
Loading…
Reference in New Issue
Block a user