You cannot select more than 25 topics Topics must start with a letter or number, can include dashes ('-') and can be up to 35 characters long.

52 lines
1.9 KiB
JavaScript

import router from 'next/router'
import Link from 'next/link'
import {Button} from '@rmwc/button'
import AdminToolbar from '~/components/admin/actionBar'
import Table from '~/components/table'
import {DateTime} from 'luxon'
AdminShipments.getInitialProps = async ({ctx: {axios}}) => {
const {data: shipments} = await axios.get('/api/shipments')
return {shipments}
}
export default function AdminShipments({shipments}){
return (
<>
<AdminToolbar title="Shipments">
<Button outlined onClick={() => router.push('/admin/shipments/new')}>Add Shipment</Button>
</AdminToolbar>
<Table
columns={[
{name: 'Note', extractor: shipment => shipment.description},
{name: 'Date', extractor: shipment => DateTime.fromISO(shipment.date).setZone('local').toFormat('LLLL dd, h:mm a')},
{name: 'Quantity', extractor: ({stockchanges}) => {
const totalAdded = stockchanges
.filter(stockchange => stockchange.direction === 'added')
.map(stockchange => stockchange.change)
.reduce((a,b) => (a+b), 0)
const totalRemoved = stockchanges
.filter(stockchange => stockchange.direction === 'subtracted')
.map(stockchange => stockchange.change)
.reduce((a,b) => (a+b), 0)
const totalQuantity = totalAdded - totalRemoved
const totalItems = stockchanges.length
return (
<span>
{totalQuantity} added across {totalItems} items
</span>
)
}},
{name: '', extractor: shipment => (
<Link href={`/admin/shipments/${shipment.uuid}`}><a>Details</a></Link>
)}
]}
// Map in an id property so the table can use array.map
rows={shipments.map(shipment => ({id: shipment.uuid, ...shipment}))}
/>
</>
)
}