Files
salt-minv-graph/resources/js/components/SearchMultipleInput.vue
2020-03-31 16:34:58 +02:00

96 lines
2.8 KiB
Vue

<template>
<form>
<div class="row form-group">
<label for="ssel1" class="col-sm-2">Typ</label>
<div class="col-sm-4">
<select v-model="type" name="type" class="form-control" id="ssel1">
<option value="0">Užívateľ</option>
<option value="1">Meno PC</option>
<option value="2">Ip adresa</option>
</select>
</div>
<div class="col-sm-6">
<div class='input-group'>
<vue-suggestion :items="items"
v-model="item"
:setLabel="setLabel"
:itemTemplate="itemTemplate"
@changed="inputChange"
@selected="itemSelected">
</vue-suggestion>
<span class="input-group-append">
<button v-on:click="submit()" type="button" class="btn btn-secondary">Zobraz</button>
</span>
</div>
<input type="hidden" name="_token" :value="csrf">
</div>
</div>
</form>
</template>
<script>
import itemTemplate from './item-multi-template.vue';
export default {
data () {
return {
item: {},
type: null,
errors: {},
success: false,
loaded: true,
items: [
],
itemTemplate,
csrf: document.querySelector('meta[name="csrf-token"]').getAttribute('content'),
}
},
methods: {
itemSelected (item) {
this.item = item;
},
setLabel (item) {
return item.name;
},
inputChange (text) {
axios.get("search/multicomplete", {
params: {
type: this.type,
term: text,
}
})
.then((response) => {
this.items = response.data;
})
.catch(function (error) {
console.log(error);
});
},
submit() {
axios.get('search/multiple', {
params: {
type: this.type,
search: this.item.name
}
})
.then((response) => {
let data = [];
data.push(['IP Adresa','Meno PC','Uzivatel','Od','Do']);
for (var index = 0; index < response.data.length; ++index) {
let row = response.data[index];
data.push([row.ip, row.comp, row.name, moment(row.f).format('DD.MM.YYYY HH:mm'), moment(row.t).format('D.MM.YYYY HH:mm')]);
}
console.log(data);
this.$parent.$refs.table.params.data = data;
})
.catch(function (error) {
console.log(error);
});
}
},
};
</script>