better recent orders layout
This commit is contained in:
parent
31bc1e4eae
commit
d86fde9d19
2 changed files with 42 additions and 20 deletions
|
@ -1,24 +1,39 @@
|
||||||
<template>
|
<template>
|
||||||
<h3>Recent Orders - {{ customer.acc_no }} {{ customer.name }}</h3>
|
<h3>{{ doc_types[doc_status] }} Orders - {{ customer.acc_no }} {{ customer.name }}</h3>
|
||||||
<v-progress-linear color="blue" :active="orders_loading" indeterminate>
|
<v-progress-linear color="blue" :active="orders_loading" indeterminate>
|
||||||
</v-progress-linear>
|
</v-progress-linear>
|
||||||
<v-container>
|
<v-container>
|
||||||
<v-row>
|
<v-row>
|
||||||
<v-col cols=4 v-for="item in sortedOrders" :key="item.id">
|
<v-col cols=12 v-for="item in sortedOrders" :key="item.id">
|
||||||
<v-card>
|
<v-card>
|
||||||
|
<v-row>
|
||||||
|
<v-col cols=4>
|
||||||
<v-card-title>
|
<v-card-title>
|
||||||
Order: {{ item.doc_no }}
|
Order: {{ item.doc_no }}
|
||||||
</v-card-title>
|
</v-card-title>
|
||||||
<v-card-subtitle>
|
<v-card-subtitle>
|
||||||
{{ formatDate(item.doc_date,"DD/MM/YYYY") }}
|
{{ formatDate(item.doc_date,"DD/MM/YYYY") }}
|
||||||
|
<v-icon v-if="item.doc_status == 'Completed'" icon="mdi-check"></v-icon>
|
||||||
|
{{ item.doc_status }}
|
||||||
</v-card-subtitle>
|
</v-card-subtitle>
|
||||||
<v-card-text>
|
<v-card-text>
|
||||||
<v-list>
|
<h5>Address :</h5>
|
||||||
<v-list-item v-for="(i, index) in item.products" :key="index" style="border-bottom: 1px dotted #000;">
|
<template v-for="(k,v, index) in item.del_addr" :key="index">
|
||||||
{{ i.code }} - {{ i.name }} x {{ i.quantity }}
|
<v-caption v-if="k != '' || k != 0">
|
||||||
</v-list-item>
|
{{ k }} <br/>
|
||||||
</v-list>
|
</v-caption>
|
||||||
|
</template>
|
||||||
</v-card-text>
|
</v-card-text>
|
||||||
|
</v-col>
|
||||||
|
<v-col cols=8>
|
||||||
|
<v-card-text>
|
||||||
|
<h5>Items :</h5>
|
||||||
|
<v-caption v-for="(i, index) in item.products" :key="index" style="border-bottom: 1px dotted #000;">
|
||||||
|
{{ i.code }} - {{ i.name }} x {{ i.quantity }}<br/>
|
||||||
|
</v-caption>
|
||||||
|
</v-card-text>
|
||||||
|
</v-col>
|
||||||
|
</v-row>
|
||||||
</v-card>
|
</v-card>
|
||||||
</v-col>
|
</v-col>
|
||||||
</v-row>
|
</v-row>
|
||||||
|
@ -30,18 +45,20 @@ import Customer from '@/types/CustomerType.vue'
|
||||||
import methods from '@/CommonMethods.vue'
|
import methods from '@/CommonMethods.vue'
|
||||||
export default {
|
export default {
|
||||||
props:{
|
props:{
|
||||||
customer: new Customer()
|
customer: new Customer(),
|
||||||
|
doc_status: Number
|
||||||
},
|
},
|
||||||
watch: {
|
watch: {
|
||||||
customer() {
|
customer() {
|
||||||
this.getCustomerRecentOrders(this.customer.acc_no)
|
this.getCustomerRecentOrders(this.customer.acc_no)
|
||||||
}
|
},
|
||||||
},
|
},
|
||||||
mixins: [methods],
|
mixins: [methods],
|
||||||
data() {
|
data() {
|
||||||
return {
|
return {
|
||||||
orders_loading: false,
|
orders_loading: false,
|
||||||
orders: []
|
orders: [],
|
||||||
|
doc_types: ["Live","","Completed"]
|
||||||
}
|
}
|
||||||
},
|
},
|
||||||
computed: {
|
computed: {
|
||||||
|
@ -63,7 +80,11 @@ export default {
|
||||||
getCustomerRecentOrders(acc_no){
|
getCustomerRecentOrders(acc_no){
|
||||||
this.orders_loading = true
|
this.orders_loading = true
|
||||||
let url = this.$api_url + "/customers/" + acc_no + "/orders/recent"
|
let url = this.$api_url + "/customers/" + acc_no + "/orders/recent"
|
||||||
axios.get(url)
|
axios.get(url, {
|
||||||
|
params: {
|
||||||
|
doc_status: this.doc_status
|
||||||
|
}
|
||||||
|
})
|
||||||
.then(resp => {
|
.then(resp => {
|
||||||
this.orders = resp.data
|
this.orders = resp.data
|
||||||
})
|
})
|
||||||
|
|
|
@ -46,7 +46,8 @@
|
||||||
<CustomerComments :customer="selected_cust"></CustomerComments>
|
<CustomerComments :customer="selected_cust"></CustomerComments>
|
||||||
</v-col>
|
</v-col>
|
||||||
<v-col cols="12" sm=12 lg=6>
|
<v-col cols="12" sm=12 lg=6>
|
||||||
<RecentOrders :customer="selected_cust"></RecentOrders>
|
<RecentOrders :customer="selected_cust" doc_status="2"></RecentOrders>
|
||||||
|
<RecentOrders :customer="selected_cust" doc_status="0"></RecentOrders>
|
||||||
</v-col>
|
</v-col>
|
||||||
</v-row>
|
</v-row>
|
||||||
</template>
|
</template>
|
||||||
|
|
Loading…
Reference in a new issue