psw/cmc_fe
1
0
Fork 0
Code Issues Pull requests Projects Releases 1 Packages Wiki Activity

better recent orders layout

Browse source
This commit is contained in:
Paul Wilde 2023-03-22 13:13:29 +00:00
parent 31bc1e4eae
commit d86fde9d19
2 changed files with 42 additions and 20 deletions
Show stats Download patch file Download diff file Expand all files Collapse all files

59
src/components/RecentOrders.vue
View file

@ -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-card-title> <v-row>
Order: {{ item.doc_no }} <v-col cols=4>
</v-card-title> <v-card-title>
<v-card-subtitle> Order: {{ item.doc_no }}
{{ formatDate(item.doc_date,"DD/MM/YYYY") }} </v-card-title>
</v-card-subtitle> <v-card-subtitle>
<v-card-text> {{ formatDate(item.doc_date,"DD/MM/YYYY") }}
<v-list> <v-icon v-if="item.doc_status == 'Completed'" icon="mdi-check"></v-icon>
<v-list-item v-for="(i, index) in item.products" :key="index" style="border-bottom: 1px dotted #000;"> {{ item.doc_status }}
{{ i.code }} - {{ i.name }} x {{ i.quantity }} </v-card-subtitle>
</v-list-item> <v-card-text>
</v-list> <h5>Address :</h5>
</v-card-text> <template v-for="(k,v, index) in item.del_addr" :key="index">
<v-caption v-if="k != '' || k != 0">
{{ k }} <br/>
</v-caption>
</template>
</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
}) })

3
src/views/customers/CustomerList.vue
View file

@ -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>