blob: 1b58e24568907caf66ee7c97d3815a60a29e91b0 (
plain)
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
|
import React from 'react'
import ProductList from './ProductList.jsx'
import OrderList from './OrderList.jsx'
import client from '../client'
export default class App extends React.Component {
constructor() {
super()
this.state = {
ready: false,
products: null,
product: null,
orders: null,
}
this.load = this.load.bind(this)
this.pick = this.pick.bind(this)
client.fetch('/api/products').then(this.load)
}
load(products) {
this.setState({
ready: true,
products: products,
})
}
pick(product) {
this.setState({
product: product,
orders: null
})
client.fetch('/api/orders', {id: product.product_merchant_product_id}).then((orders) => this.setState({ orders: orders }))
}
render() {
if (! this.state.ready) {
return (
<div className='loading'>Loading...</div>
)
}
else {
const products = this.state.products
const product = this.state.product
const orders = this.state.orders
return (
<div>
<ProductList products={products} handleSelect={(product) => this.pick(product)} />
<OrderList product={product} orders={orders} />
</div>
)
}
}
}
|
