%PDF-
%PDF-
Mini Shell
Mini Shell
<template>
<div class="container-fluid">
<div class="row justify-content-center">
<div class="col-md-12">
<a v-b-toggle href="#add-file" @click.prevent>Add File</a>
<table class="table table-bordered">
<thead>
<tr>
<th scope="col">#</th>
<th scope="col">Document Name</th>
<th scope="col">Actions</th>
</tr>
</thead>
<tbody>
<tr v-for ="document in documents.data" :key="document.id">
<th scope="row">{{document.id}}</th>
<td>{{document.name}}</td>
<td>
<a :href="'../storage/uploads/'+document.file_name" target="_blank"> <i class="fa fa-file-excel-o" aria-hidden="true"></i><p class="filename">{{document.file_name}}</p></a>
</td>
</tr>
</tbody>
</table>
<pagination :data="documents" @pagination-change-page="getResults"></pagination>
</div>
<b-sidebar id="add-file" class="w-50" title="Add file" right shadow backdrop backdrop-variant="dark">
sdd
<mfileupload />
</b-sidebar>
</div>
</div>
</template>
<script>
import mfileupload from './mfileupload'
export default {
data(){
return {
users:{},
tasks:[],
documents:[],
searchQuery:'',
isTyping: false,
isLoading: false,
}
},
watch: {
searchQuery: _.debounce(function() {
this.isTyping = false;
}, 500),
isTyping: function(value) {
if (!value) {
this.searchUser(this.searchQuery);
}
}
},
methods:{
searchUser: function(searchQuery) {
this.isLoading = true;
axios.get('client/searchquery?q=' + searchQuery)
.then(response => {
this.isLoading = false;
this.users = response.data;
});
},
getResults:function(page = 1) {
axios.get('document?page=' + page)
.then(response => {
this.documents = response.data;
});
},
loadusers:function(){
axios.get('/document/').then(response => {
this.documents = response.data
})
},
},
created: function(){
this.loadusers()
},
}
</script>
Zerion Mini Shell 1.0