Skip to content

Instantly share code, notes, and snippets.

@insign insign/ecv.vue
Created Apr 24, 2018

Embed
What would you like to do?
ecv.vue
<template>
<div>
<q-page padding>
<q-uploader ref="ecvUp" :url="url" extensions=".csv" auto-expand multiple @add="addedFiles" @uploaded="uploadedFile" :headers="{ Authorization: 'Bearer ' + $store.login.sessao.jwt, 'debug-token':'aaa'}"/>
<q-table :loading="table.loading" title="ECV" :data="table.data" :columns="table.columns" @request="request" :pagination.sync="table.pagination" row-key="name"/>
</q-page>
</div>
</template>
<script>
export default {
name: 'ecv',
mounted() {
this.$store.titulo = 'Laudos'
this.request({
pagination: this.table.pagination,
filter: this.table.filter
})
},
data() {
return {
url: process.env.API_PREFIX + 'laudos/ecv',
table: {
filter: '',
loading: false,
columns: [
{
name: 'id',
required: true,
label: '#',
align: 'left',
field: 'id',
sortable: true
},
{
name: 'codigo',
required: true,
label: 'Cód',
align: 'left',
field: 'codigo',
sortable: false
},
{
name: 'patio',
required: true,
label: 'Pátio',
align: 'left',
field: 'patio',
sortable: true
},
{
name: 'data',
required: true,
label: 'Data',
align: 'left',
field: 'data',
sortable: true
},
],
data: [],
pagination: {
sortBy: null, // String, column "name" property value
descending: false,
page: 1,
rowsPerPage: 5 // current rows per page being displayed
}
},
}
},
methods: {
request({pagination, filter}) {
console.info(pagination, filter)
// we set QTable to "loading" state
this.table.loading = true
this.$axios
.get(process.env.API_PREFIX + `laudos/ecv?page=${pagination.page}?sortBy=${pagination.sortBy}&descending=${pagination.descending}&filter=${filter}`)
.then(({data}) => {
// updating pagination to reflect in the UI
this.pagination = pagination
// we also set (or update) rowsNumber
this.pagination.rowsNumber = data.meta.total
this.pagination.rowsPerPage = data.meta.per_page
// then we update the rows with the fetched ones
this.table.data = data.data
// finally we tell QTable to exit the "loading" state
this.table.loading = false
})
.catch(error => {
// there's an error... do SOMETHING
// we tell QTable to exit the "loading" state
this.loading = false
})
},
addedFiles(files) {
this.$refs.ecvUp.upload()
},
uploadedFile(file, xhr) {
let resposta = JSON.parse(xhr.response)
console.info(resposta)
}
}
}
</script>
<style></style>
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment
You can’t perform that action at this time.