created filter data for date in order page
This commit is contained in:
anjujangid
parent
e987740c1e
commit
f2f7e950c2
|
|
@ -1 +1 @@
|
|||
{"branch_name":"dev","last_commit_date":"2022-02-14T10:30:18.000Z","last_commit_author":"anjujangid","last_commit_hash":"8c3f940308bc510defde9f95c815bd081f6b15b0"}
|
||||
{"branch_name":"dev","last_commit_date":"2022-02-14T11:33:50.000Z","last_commit_author":"rakesh","last_commit_hash":"e987740c1e4d0da4278211e6f4ff1e9eb2bc3d40"}
|
||||
|
|
@ -24,25 +24,26 @@
|
|||
<v-menu
|
||||
v-model="menu1"
|
||||
:close-on-content-click="false"
|
||||
:nudge-right="40"
|
||||
transition="scale-transition"
|
||||
offset-y
|
||||
min-width="auto"
|
||||
>
|
||||
<template v-slot:activator="{ on, attrs }">
|
||||
<v-text-field
|
||||
v-model="createdDate"
|
||||
v-model="dateAtFormatted"
|
||||
label="Created From"
|
||||
persistent-hint
|
||||
readonly
|
||||
v-bind="attrs"
|
||||
v-on="on"
|
||||
outlined
|
||||
hide-details
|
||||
dense
|
||||
readonly
|
||||
v-bind="attrs"
|
||||
v-on="on"
|
||||
></v-text-field>
|
||||
</template>
|
||||
<v-date-picker
|
||||
v-model="date1"
|
||||
no-title
|
||||
v-model="createdFrom"
|
||||
@input="menu1 = false"
|
||||
></v-date-picker>
|
||||
</v-menu>
|
||||
|
|
@ -54,25 +55,26 @@
|
|||
<v-menu
|
||||
v-model="menu2"
|
||||
:close-on-content-click="false"
|
||||
:nudge-right="40"
|
||||
transition="scale-transition"
|
||||
offset-y
|
||||
min-width="auto"
|
||||
>
|
||||
<template v-slot:activator="{ on, attrs }">
|
||||
<v-text-field
|
||||
v-model="toDate"
|
||||
v-model=" dateToFormatted"
|
||||
label="To"
|
||||
persistent-hint
|
||||
readonly
|
||||
v-bind="attrs"
|
||||
v-on="on"
|
||||
outlined
|
||||
hide-details
|
||||
dense
|
||||
readonly
|
||||
v-bind="attrs"
|
||||
v-on="on"
|
||||
></v-text-field>
|
||||
</template>
|
||||
<v-date-picker
|
||||
v-model="date2"
|
||||
no-title
|
||||
v-model="createdTo"
|
||||
@input="menu2 = false"
|
||||
></v-date-picker>
|
||||
</v-menu>
|
||||
|
|
@ -114,7 +116,6 @@
|
|||
<v-col cols="12" sm="12" md="6" lg="3">
|
||||
<v-hover v-slot:default="{ hover }">
|
||||
<router-link
|
||||
|
||||
class="text-decoration-none"
|
||||
:to="{ name: 'CartProducts' }"
|
||||
>
|
||||
|
|
@ -129,59 +130,68 @@
|
|||
</v-hover>
|
||||
</v-col>
|
||||
<v-col cols="12" sm="12" md="12" lg="12">
|
||||
<v-row class="mt-12" justify="center" v-if="inProgress">
|
||||
<v-progress-circular :size="60" color="primary" indeterminate></v-progress-circular>
|
||||
</v-row>
|
||||
<v-row no-gutters v-else>
|
||||
<v-col>
|
||||
<v-row class="mt-12" justify="center" v-if="inProgress">
|
||||
<v-progress-circular
|
||||
:size="60"
|
||||
color="primary"
|
||||
indeterminate
|
||||
></v-progress-circular>
|
||||
</v-row>
|
||||
<v-row no-gutters v-else>
|
||||
<v-col>
|
||||
<v-data-table
|
||||
:headers="headers"
|
||||
:items="OrderHistory"
|
||||
:items-per-page="10"
|
||||
class="elevation-1 pt-5"
|
||||
>
|
||||
<template v-slot:item.date="{ item }">
|
||||
<span>{{ isoStringToNormalDate(item.updatedAt) }}</span>
|
||||
</template>
|
||||
<template v-slot:item.order="{ item }">
|
||||
<span>{{ item.incrementId }}</span>
|
||||
</template>
|
||||
<template v-slot:item.retailername="{ item }">
|
||||
<span>{{ userInfo.firstname + '' + userInfo.lastname }}</span>
|
||||
</template>
|
||||
<template v-slot:item.salesrepname="{ item }">
|
||||
<span>{{ userInfo.firstname + '' + userInfo.lastname }}</span>
|
||||
</template>
|
||||
<template v-slot:item.status="{ item }">
|
||||
<span>{{ item.status }}</span>
|
||||
</template>
|
||||
<template v-slot:item.POnumber="{ item }">
|
||||
<span>{{ item.payment.poNumber }}</span>
|
||||
</template>
|
||||
<template v-slot:item.action="{ item }">
|
||||
<v-hover v-slot:default="{ hover }">
|
||||
<router-link
|
||||
:class="
|
||||
hover ? 'content-link-hover-color' : 'secondary--text'
|
||||
"
|
||||
to
|
||||
@click.native="viewMyOrder(item.items[0].orderId)"
|
||||
class="ls-n009 text-decoration-none body myorders-route-link"
|
||||
>View Order</router-link
|
||||
>
|
||||
</v-hover>
|
||||
</template>
|
||||
</v-data-table>
|
||||
</v-col>
|
||||
</v-row>
|
||||
:headers="headers"
|
||||
:items="OrderHistory"
|
||||
:items-per-page="10"
|
||||
class="elevation-1 pt-5"
|
||||
>
|
||||
<template v-slot:item.date="{ item }">
|
||||
<span>{{ isoStringToNormalDate(item.updatedAt) }}</span>
|
||||
</template>
|
||||
<template v-slot:item.order="{ item }">
|
||||
<span>{{ item.incrementId }}</span>
|
||||
</template>
|
||||
<template v-slot:item.retailername="{ item }">
|
||||
<span>{{ userInfo.firstname + "" + userInfo.lastname }}</span>
|
||||
</template>
|
||||
<template v-slot:item.salesrepname="{ item }">
|
||||
<span>{{ userInfo.firstname + "" + userInfo.lastname }}</span>
|
||||
</template>
|
||||
<template v-slot:item.status="{ item }">
|
||||
<span>{{ item.status }}</span>
|
||||
</template>
|
||||
<template v-slot:item.POnumber="{ item }">
|
||||
<span>{{ item.payment.poNumber }}</span>
|
||||
</template>
|
||||
<template v-slot:item.action="{ item }">
|
||||
<v-hover v-slot:default="{ hover }">
|
||||
<router-link
|
||||
:class="
|
||||
hover ? 'content-link-hover-color' : 'secondary--text'
|
||||
"
|
||||
to
|
||||
@click.native="viewMyOrder(item.items[0].orderId)"
|
||||
class="
|
||||
ls-n009
|
||||
text-decoration-none
|
||||
body
|
||||
myorders-route-link
|
||||
"
|
||||
>View Order</router-link
|
||||
>
|
||||
</v-hover>
|
||||
</template>
|
||||
</v-data-table>
|
||||
</v-col>
|
||||
</v-row>
|
||||
</v-col>
|
||||
</v-row>
|
||||
</v-form>
|
||||
</v-container>
|
||||
</template>
|
||||
<script>
|
||||
/* eslint-disable no-alert, no-console , no-debugger */
|
||||
import { createHelpers } from "vuex-map-fields";
|
||||
/* eslint-disable no-alert, no-console , no-debugger */
|
||||
import { createHelpers } from "vuex-map-fields";
|
||||
|
||||
const { mapFields } = createHelpers({
|
||||
getterType: "orderlist/getField",
|
||||
|
|
@ -192,10 +202,10 @@ export default {
|
|||
name: "BoxedOrderHistoryPage",
|
||||
components: {},
|
||||
data: () => ({
|
||||
date1: "",
|
||||
date2: "",
|
||||
menu1: false,
|
||||
menu2: false,
|
||||
dateAtFormatted:"",
|
||||
dateToFormatted:"",
|
||||
headers: [
|
||||
{ text: "Date", value: "date" },
|
||||
{ text: "Order #", value: "order" },
|
||||
|
|
@ -204,16 +214,9 @@ export default {
|
|||
{ text: "Status", value: "status" },
|
||||
{ text: "PO Number", value: "POnumber" },
|
||||
{ text: "Action", value: "action" },
|
||||
|
||||
],
|
||||
}),
|
||||
computed: {
|
||||
createdDate() {
|
||||
return this.formatDate(this.date1);
|
||||
},
|
||||
toDate() {
|
||||
return this.formatDate(this.date2);
|
||||
},
|
||||
OrderHistory() {
|
||||
return this.$store.state.orderlist.OrderHistory.items;
|
||||
},
|
||||
|
|
@ -221,11 +224,10 @@ export default {
|
|||
return this.$store.state.accountOne.one;
|
||||
},
|
||||
|
||||
inProgress() {
|
||||
inProgress() {
|
||||
return this.$store.state.orderlist.inProgress;
|
||||
},
|
||||
...mapFields(["orderNumber"]),
|
||||
|
||||
...mapFields(["orderNumber","createdFrom","createdTo"]),
|
||||
},
|
||||
|
||||
methods: {
|
||||
|
|
@ -250,33 +252,32 @@ export default {
|
|||
let tmp = new Date(newDateTime).toLocaleDateString().split("/");
|
||||
return (date = tmp[1] + "/" + tmp[0] + "/" + tmp[2]);
|
||||
},
|
||||
searchOrder() {
|
||||
this.$store.dispatch("orderlist/fetchSearchOrder");
|
||||
},
|
||||
reset(){
|
||||
this.$store.dispatch("orderlist/fetchReset",this.userInfo.id);
|
||||
|
||||
// searchOrder() {
|
||||
// this.$store.dispatch("orderlist/fetchSearchOrder");
|
||||
// },
|
||||
reset() {
|
||||
this.$store.dispatch("orderlist/fetchReset", this.userInfo.id);
|
||||
},
|
||||
orderlistApi() {
|
||||
if(this.userInfo && this.userInfo.id)
|
||||
{
|
||||
|
||||
this.$store.dispatch("orderlist/fetchOrderList",this.userInfo.id);
|
||||
if (this.userInfo && this.userInfo.id) {
|
||||
this.$store.dispatch("orderlist/fetchOrderList", this.userInfo.id);
|
||||
}
|
||||
},
|
||||
},
|
||||
watch: {
|
||||
userInfo() {
|
||||
this.orderlistApi();
|
||||
},
|
||||
createdFrom () {
|
||||
this.dateAtFormatted = this.formatDate(this.createdFrom)
|
||||
},
|
||||
createdTo () {
|
||||
this.dateToFormatted = this.formatDate(this.createdTo)
|
||||
},
|
||||
},
|
||||
watch:
|
||||
{
|
||||
userInfo()
|
||||
{
|
||||
this.orderlistApi();
|
||||
}
|
||||
created() {
|
||||
this.orderlistApi();
|
||||
},
|
||||
created()
|
||||
{
|
||||
this.orderlistApi();
|
||||
}
|
||||
|
||||
};
|
||||
</script>
|
||||
<style src="./boxed_order_history.scss" lang="scss" scoped/>
|
||||
|
|
|
|||
|
|
@ -677,10 +677,30 @@ export const doFetchProductTags = wrapRequest((sku) => {
|
|||
|
||||
|
||||
export const doFetchOrderHistory = wrapRequest((obj) => {
|
||||
debugger
|
||||
let query = "";
|
||||
query = `searchCriteria[pageSize]=5000&searchCriteria[currentPage]=1&searchCriteria[sortOrders][0][field]=created_at&searchCriteria[sortOrders][0][direction]=DESC&searchCriteria[filter_groups][0][filters][0][field]=customer_id&searchCriteria[filter_groups][0][filters][0][value]=${obj.customerId}&searchCriteria[filter_groups][0][filters][0][condition_type]=eq`;
|
||||
|
||||
if(obj.incrementId){
|
||||
query = `&searchCriteria[filter_groups][1][filters][0][field]=increment_id&searchCriteria[filter_groups][1][filters][0][value]=${obj.incrementId}&searchCriteria[filter_groups][1][filters][0][condition_type]=eq`
|
||||
query = `searchCriteria[filter_groups][1][filters][0][field]=increment_id&searchCriteria[filter_groups][1][filters][0][value]=${obj.incrementId}&searchCriteria[filter_groups][1][filters][0][condition_type]=eq`
|
||||
}
|
||||
if(obj.createdAt ){
|
||||
query = `searchCriteria[filter_groups][2][filters][0][field]=created_at&
|
||||
searchCriteria[filter_groups][2][filters][0][value]=${obj.createdAt}&searchCriteria[filter_groups][2][filters][0][condition_type]=gteq`
|
||||
}
|
||||
if(obj.createdTo){
|
||||
query = `searchCriteria[filter_groups][3][filters][0][field]=created_at&searchCriteria[filter_groups][3][filters][0][value]=${obj.createdTo}&searchCriteria[filter_groups][3][filters][0][condition_type]=lteq`
|
||||
}
|
||||
if(obj.createdAt && obj.createdTo ){
|
||||
query = `searchCriteria[filter_groups][2][filters][0][value]=${obj.createdAt}&searchCriteria[filter_groups][2][filters][0][condition_type]=gteq&searchCriteria[filter_groups][3][filters][0][field]=created_at&searchCriteria[filter_groups][3][filters][0][value]=${obj.createdTo}&searchCriteria[filter_groups][3][filters][0][condition_type]=lteq&searchCriteria[filter_groups][2][filters][0][field]=created_at`
|
||||
}
|
||||
if(obj.createdAt && obj.createdTo && obj.incrementId ){
|
||||
query = `searchCriteria[filter_groups][1][filters][0][field]=increment_id&searchCriteria[filter_groups][1][filters][0][value]=${obj.incrementId}&searchCriteria[filter_groups][1][filters][0][condition_type]=eq
|
||||
&searchCriteria[filter_groups][2][filters][0][value]=${obj.createdAt}&searchCriteria[filter_groups][2][filters][0][condition_type]=gteq&searchCriteria[filter_groups][3][filters][0][field]=created_at&searchCriteria[filter_groups][3][filters][0][value]=${obj.createdTo}&searchCriteria[filter_groups][3][filters][0][condition_type]=lteq&searchCriteria[filter_groups][2][filters][0][field]=created_at`
|
||||
}
|
||||
if(obj.incrementId && obj.createdAt ){
|
||||
query = `searchCriteria[filter_groups][1][filters][0][field]=increment_id&searchCriteria[filter_groups][1][filters][0][value]=${obj.incrementId}&searchCriteria[filter_groups][1][filters][0][condition_type]=eq&searchCriteria[filter_groups][2][filters][0][field]=created_at&
|
||||
searchCriteria[filter_groups][2][filters][0][value]=${obj.createdAt}&searchCriteria[filter_groups][2][filters][0][condition_type]=gteq`
|
||||
}
|
||||
const requestOptions = {
|
||||
method: 'GET',
|
||||
|
|
|
|||
|
|
@ -11,9 +11,9 @@ export const orderlist = {
|
|||
OrderHistory: {},
|
||||
|
||||
customerId: "",
|
||||
orderNumber: ""
|
||||
// createdDate: "",
|
||||
// toDate: "",
|
||||
orderNumber: "",
|
||||
createdFrom: "",
|
||||
createdTo: "",
|
||||
// purchaseOrderNumber: "",
|
||||
|
||||
},
|
||||
|
|
@ -32,10 +32,43 @@ export const orderlist = {
|
|||
},
|
||||
|
||||
actions: {
|
||||
fetchOrderList: async ({state, commit },customerId) => {
|
||||
fetchOrderList: async ({ state, commit }, customerId) => {
|
||||
debugger
|
||||
|
||||
try {
|
||||
commit('inProgress', true);
|
||||
let OrderHistory = await doFetchOrderHistory({customerId:customerId,incrementId:state.orderNumber});
|
||||
|
||||
let createdTo = state.createdTo
|
||||
if(createdTo){
|
||||
// let date = new Date(Date.now()+(3600 * 1000 *24));
|
||||
// console.log(date)
|
||||
// let To= date.getFullYear()+"-"+date.getDay()+"-"+date.getDate()
|
||||
// console.log(To+"too")
|
||||
|
||||
// console.log(state.createdTo)
|
||||
|
||||
// // console.log( createdTo.setDate(createdTo.getDate() + 1),"full value")
|
||||
// // console.log( state.createdTo,"full value")
|
||||
let createdTo = new Date();
|
||||
|
||||
createdTo.setDate(createdTo.getDate() + 1);
|
||||
|
||||
console.log( createdTo.setDate(createdTo.getDate() + 1),"full value")
|
||||
}
|
||||
else{
|
||||
let createdTo = new Date();
|
||||
console.log(createdTo.setDate(createdTo.getDate() + 1)," null value")
|
||||
|
||||
createdTo.setDate(createdTo.getDate() + 1);
|
||||
|
||||
}
|
||||
|
||||
let OrderHistory = await doFetchOrderHistory({
|
||||
customerId: customerId,
|
||||
incrementId: state.orderNumber,
|
||||
createdAt: state.createdFrom,
|
||||
createdTo: state.createdTo
|
||||
});
|
||||
if (OrderHistory) {
|
||||
commit('inProgress', false);
|
||||
commit('setOrderHistory', humps(OrderHistory));
|
||||
|
|
@ -46,11 +79,13 @@ export const orderlist = {
|
|||
throw error
|
||||
}
|
||||
},
|
||||
fetchReset: async ({state,commit },customerId) => {
|
||||
fetchReset: async ({ state, commit }, customerId) => {
|
||||
try {
|
||||
state.orderNumber="";
|
||||
state.orderNumber = "";
|
||||
state.createdFrom = "";
|
||||
state.createdTo = "";
|
||||
commit('inProgress', true);
|
||||
let orderHistory = await doFetchOrderHistory({customerId:customerId,incrementId:state.orderNumber});
|
||||
let orderHistory = await doFetchOrderHistory({ customerId: customerId, incrementId: state.orderNumber,createdAt: state.createdFrom,createdTo: state.createdTo });
|
||||
|
||||
if (orderHistory) {
|
||||
commit('inProgress', false);
|
||||
|
|
|
|||
Loading…
Reference in New Issue