forked from juan/hedera-web
97 lines
2.3 KiB
Vue
97 lines
2.3 KiB
Vue
<template>
|
|
<div class="vn-pp row justify-center">
|
|
<toolbar>
|
|
<q-select
|
|
v-model="yearFilter"
|
|
:options="years"
|
|
:label="$t('ordersMadeAt')"
|
|
style="min-width: 12em;"
|
|
dark
|
|
dense
|
|
standout/>
|
|
</toolbar>
|
|
<div
|
|
v-if="tickets && !tickets.length"
|
|
class="text-subtitle1 text-center text-grey-7 q-pa-md">
|
|
{{$t('noOrdersFound')}}
|
|
</div>
|
|
<q-card
|
|
v-if="tickets && tickets.length"
|
|
class="vn-w-md">
|
|
<q-list bordered separator>
|
|
<q-item
|
|
v-for="ticket in tickets"
|
|
:key="ticket.id"
|
|
:to="`/ticket/${ticket.id}`"
|
|
clickable
|
|
v-ripple>
|
|
<q-item-section>
|
|
<q-item-label>{{ticket.landed | date('ddd, MMMM Do')}}</q-item-label>
|
|
<q-item-label caption>#{{ticket.id}}</q-item-label>
|
|
<q-item-label caption>{{ticket.address.nickname}}</q-item-label>
|
|
<q-item-label caption>{{ticket.address.city}}</q-item-label>
|
|
</q-item-section>
|
|
<q-item-section side top>
|
|
<q-item-label>
|
|
485.50€
|
|
</q-item-label>
|
|
<q-badge
|
|
v-if="ticket.state"
|
|
color="teal"
|
|
:label="ticket.state.state.name"/>
|
|
<q-item-label v-if="ticket.packages" caption>
|
|
{{$t('packages', {n: ticket.packages})}}
|
|
</q-item-label>
|
|
</q-item-section>
|
|
</q-item>
|
|
</q-list>
|
|
</q-card>
|
|
</div>
|
|
</template>
|
|
|
|
<script>
|
|
import Page from 'components/Page'
|
|
|
|
export default {
|
|
name: 'Orders',
|
|
mixins: [Page],
|
|
data () {
|
|
return {
|
|
yearFilter: null,
|
|
years: [],
|
|
tickets: null
|
|
}
|
|
},
|
|
mounted () {
|
|
let now = new Date()
|
|
let curYear = now.getFullYear()
|
|
|
|
for (let i = 0; i <= 5; i++) {
|
|
this.years.push(curYear - i)
|
|
}
|
|
|
|
this.yearFilter = curYear
|
|
},
|
|
watch: {
|
|
yearFilter (year) {
|
|
let start = new Date(year, 0)
|
|
let end = new Date(year + 1, 0)
|
|
|
|
let params = { filter: {
|
|
where: {
|
|
clientFk: this.$state.userId,
|
|
landed: { between: [start, end] }
|
|
},
|
|
include: [
|
|
'address',
|
|
{ state: 'state' }
|
|
],
|
|
order: 'landed DESC'
|
|
} }
|
|
this.$axios.get('Tickets', { params })
|
|
.then(res => (this.tickets = res.data))
|
|
}
|
|
}
|
|
}
|
|
</script>
|