You can not select more than 25 topics
Topics must start with a letter or number, can include dashes ('-') and can be up to 35 characters long.
69 lines
2.0 KiB
69 lines
2.0 KiB
import React, { useState, useEffect } from 'react'; |
|
import { BrowserRouter as Router, Switch, Route, Link, useParams } from 'react-router-dom'; |
|
import './light.css'; |
|
import { Container, Divider, Dropdown, Form, Grid, Header, Icon, Image, Menu, Message, Segment, Table } from 'semantic-ui-react'; |
|
import { BasicTable, requester } from './utils.js'; |
|
import { NotFound, PleaseLogin } from './Misc.js'; |
|
|
|
export function Cards(props) { |
|
const { user } = props; |
|
|
|
const cardStatus = (c) => c.active_status === 'card_active' ? 'Yes' : 'No'; |
|
const card = user.cards[0]; |
|
|
|
return ( |
|
<Container> |
|
<Header size='large'>Member Cards</Header> |
|
|
|
{user.cards.length ? |
|
user.cards.length > 1 ? |
|
<Table basic='very'> |
|
<Table.Header> |
|
<Table.Row> |
|
<Table.HeaderCell>Number</Table.HeaderCell> |
|
<Table.HeaderCell>Notes</Table.HeaderCell> |
|
<Table.HeaderCell>Last Seen</Table.HeaderCell> |
|
<Table.HeaderCell>Active</Table.HeaderCell> |
|
</Table.Row> |
|
</Table.Header> |
|
|
|
<Table.Body> |
|
{user.cards.map((x, i) => |
|
<Table.Row key={i}> |
|
<Table.Cell>{x.card_number}</Table.Cell> |
|
<Table.Cell>{x.notes}</Table.Cell> |
|
<Table.Cell>{x.last_seen_at}</Table.Cell> |
|
<Table.Cell>{cardStatus(x)}</Table.Cell> |
|
</Table.Row> |
|
)} |
|
</Table.Body> |
|
</Table> |
|
: |
|
<BasicTable> |
|
<Table.Body> |
|
<Table.Row> |
|
<Table.Cell>Number:</Table.Cell> |
|
<Table.Cell>{card.card_number}</Table.Cell> |
|
</Table.Row> |
|
<Table.Row> |
|
<Table.Cell>Notes:</Table.Cell> |
|
<Table.Cell>{card.notes}</Table.Cell> |
|
</Table.Row> |
|
<Table.Row> |
|
<Table.Cell>Last Seen:</Table.Cell> |
|
<Table.Cell>{card.last_seen_at}</Table.Cell> |
|
</Table.Row> |
|
<Table.Row> |
|
<Table.Cell>Active:</Table.Cell> |
|
<Table.Cell>{cardStatus(card)}</Table.Cell> |
|
</Table.Row> |
|
</Table.Body> |
|
</BasicTable> |
|
: |
|
<p>No cards yet! Ask a director for one after you are vetted.</p> |
|
} |
|
|
|
</Container> |
|
); |
|
}; |
|
|
|
|