|
|
|
<template>
|
|
|
|
<div>
|
|
|
|
<div style="margin-bottom: 20px;">
|
|
|
|
<b-form @reset="onReset">
|
|
|
|
|
|
|
|
<b-form-group
|
|
|
|
id="ip-g-1"
|
|
|
|
label="Bezeichnung:"
|
|
|
|
label-for="bezeichnung"
|
|
|
|
description="Bezeichnung des Kleidungs-Typs:"
|
|
|
|
>
|
|
|
|
<b-form-input
|
|
|
|
id="bezeichnung"
|
|
|
|
v-model="form.bezeichnung"
|
|
|
|
required
|
|
|
|
placeholder="Bezeichnung eingeben"
|
|
|
|
size="50"
|
|
|
|
>
|
|
|
|
</b-form-input>
|
|
|
|
</b-form-group>
|
|
|
|
|
|
|
|
<b-button variant="primary" @click="onSubmit()">Neu eintragen</b-button>
|
|
|
|
<b-button variant="secondary" @click="onUpdate()">Aktualisieren</b-button>
|
|
|
|
<b-button variant="danger" @click="onDelete()">Löschen</b-button>
|
|
|
|
<b-button type="reset" variant="danger">Reset</b-button>
|
|
|
|
</b-form>
|
|
|
|
</div>
|
|
|
|
<div>
|
|
|
|
<b-table striped hover bordered head-variant="dark" selectable :select-mode="selectMode" :items="certs" :fields="fields" @row-selected="onRowSelect"></b-table>
|
|
|
|
</div>
|
|
|
|
</div>
|
|
|
|
</template>
|
|
|
|
|
|
|
|
<script>
|
|
|
|
|
|
|
|
export default {
|
|
|
|
data() {
|
|
|
|
return {
|
|
|
|
selectMode: 'single',
|
|
|
|
componentKey: 0,
|
|
|
|
certs: [],
|
|
|
|
form:{
|
|
|
|
id: "",
|
|
|
|
bezeichnung: "",
|
|
|
|
},
|
|
|
|
fields: [
|
|
|
|
{
|
|
|
|
key: 'id',
|
|
|
|
sortable: true
|
|
|
|
},
|
|
|
|
{
|
|
|
|
key: 'bezeichnung',
|
|
|
|
sortable: true
|
|
|
|
},
|
|
|
|
]
|
|
|
|
}
|
|
|
|
},
|
|
|
|
created() {
|
|
|
|
this.fetch();
|
|
|
|
}
|
|
|
|
,
|
|
|
|
methods: {
|
|
|
|
onRowSelect(items) {
|
|
|
|
this.selected = items;
|
|
|
|
// alert(JSON.stringify(this.selected));
|
|
|
|
this.onFill(this.selected);
|
|
|
|
},
|
|
|
|
async fetch() {
|
|
|
|
console.log("fetching...");
|
|
|
|
this.certs = await fetch(
|
|
|
|
'http://ubodroid-2:8080/api/v1/typ'
|
|
|
|
).then(res => res.json())
|
|
|
|
},
|
|
|
|
async onSubmit() {
|
|
|
|
// event.preventDefault();
|
|
|
|
this.form.id = "";
|
|
|
|
console.log("submitting...");
|
|
|
|
await this.$http.$post('http://ubodroid-2:8080/api/v1/typ', this.form);
|
|
|
|
// return result;
|
|
|
|
// this.subm(this.form);
|
|
|
|
this.fetch();
|
|
|
|
|
|
|
|
},
|
|
|
|
|
|
|
|
async onUpdate() {
|
|
|
|
// event.preventDefault();
|
|
|
|
console.log("updating...");
|
|
|
|
console.log("Laufzeit: ", this.form.laufzeit)
|
|
|
|
console.log(this.form);
|
|
|
|
await this.$http.$put('http://ubodroid-2:8080/api/v1/typ/'+this.form.id, this.form);
|
|
|
|
// return result;
|
|
|
|
// this.subm(this.form);
|
|
|
|
this.fetch();
|
|
|
|
|
|
|
|
},
|
|
|
|
|
|
|
|
async onDelete() {
|
|
|
|
// event.preventDefault();
|
|
|
|
console.log("updating...");
|
|
|
|
await this.$http.$delete('http://ubodroid-2:8080/api/v1/typ/'+this.form.id);
|
|
|
|
// return result;
|
|
|
|
// this.subm(this.form);
|
|
|
|
this.fetch();
|
|
|
|
|
|
|
|
},
|
|
|
|
|
|
|
|
|
|
|
|
onReset(event) {
|
|
|
|
event.preventDefault();
|
|
|
|
this.form.bezeichnung = '';
|
|
|
|
},
|
|
|
|
|
|
|
|
onFill(item) {
|
|
|
|
// alert(JSON.stringify(item));
|
|
|
|
if(item.length !== 0) {
|
|
|
|
this.form.bezeichnung = item[0].bezeichnung;
|
|
|
|
this.form.id = item[0].id;
|
|
|
|
console.log(JSON.stringify(item[0].bezeichnung));
|
|
|
|
}
|
|
|
|
}
|
|
|
|
}
|
|
|
|
}
|
|
|
|
</script>
|