1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
38
39
40
41
42
43
44
45
46
47
48
49
50
51
52
53
54
55
56
57
58
59
60
61
62
63
64
65
66
67
68
69
70
71
72
73
74
75
76
77
78
79
80
81
82
83
84
85
86
87
88
89
90
91
92
93
94
95
96
97
98
99
100
101
102
103
104
105
106
107
108
109
110
111
112
113
114
115
116
117
118
119
120
121
122
123
124
125
126
|
import React from 'react'
import state_lookup from '../state_lookup'
import saveAs from 'browser-saveas'
import csvStringify from 'csv-stringify'
export default class OrderList extends React.Component {
constructor(props) {
super()
this.downloadCsv = this.downloadCsv.bind(this)
}
downloadCsv() {
const orders = this.parseOrders().map((order) => {
return [
order.order_id,
order.order_date,
order.order_checkout_type,
order.order_ship_name,
order.order_company,
order.order_address1,
order.order_address2,
order.order_city,
state_lookup(order.order_state),
order.order_zip,
order.order_country !== 'United States' ? '' : order.order_country,
order.order_email,
]
})
csvStringify(orders, (err, csv) => {
const blob = new Blob([csv], {type : 'text/plain;charset=utf-8'})
saveAs(blob, this.props.product.product_name.replace(/\s+/g,"") +'.csv')
})
}
parseOrders() {
return this.props.orders.filter( (order) => {
// also filter where order.order_status == 3 (paid in full) ?
// filter weird blank orders if found
return !! order.order_ship_name
}).map( (order, i) => {
const name = order.order_ship_name
.toUpperCase()
.replace(/(Sr|Jr|I|II|III|IV)\.?$/i, "")
.split(" ")
.reverse()[0]
return [ name, order ]
}).sort((a,b) => {
return a[0] < b[0] ? -1 : a[0] === b[0] ? 0 : 1
}).map((pair, i) => {
return pair[1]
})
}
render() {
if (! this.props.product) {
return ( <div></div> )
}
if (! this.props.orders) {
return ( <div className='loading'>Loading...</div> )
}
if (! this.props.orders.length) {
return ( <div className='notfound'>No orders found</div> )
}
const items = this.parseOrders().map((order, i) => {
const order_link = (
<a href={'http://shopping.msana.com/cw4/admin/order-details.php?order_id=' + order.order_id} target='_blank'>
(order)
</a>
)
const customer_link = order.order_checkout_type === 'guest' ? '' : (
<a href={'http://shopping.msana.com/cw4/admin/customer-details.php?customer_id=' + order.order_customer_id} target='_blank'>
(customer)
</a>
)
let order_name, order_address
if (order.order_company && order.order_company !== order.order_ship_name) {
order_name = (
<span>
{order.order_ship_name}<br />
{order.order_company}
</span>
)
}
else {
order_name = order.order_ship_name
}
if (order.order_address2 && order.order_address2 !== order.order_address1) {
order_address = (
<span>
{order.order_address1}<br />
{order.order_address2}
</span>
)
}
else {
order_address = order.order_address1
}
const order_email = ! order.order_email ? '' : (
<a className='email' href={'mailto:'+order.order_email}>{order.order_email}</a>
)
const country = order.order_country !== 'United States' ? order.order_country : ""
return (
<div key={i}>
<div>
{order_link} {customer_link}
</div>
<div>
{order_name}<br />
{order_address}<br />
{order.order_city}, {state_lookup(order.order_state)} {order.order_zip} {country}<br/>
{order_email}
</div>
</div>
)
})
return (
<div className='orderList'>
<a href='#' onClick={() => this.downloadCsv()}>Download CSV</a>
{items}
<br />
<br />
<br />
</div>
)
}
}
|
