tanner/spaceport
1
0
Fork 0
Code Issues Pull Requests Releases Wiki Activity

Add member info component

Browse Source
This commit is contained in:
Tanner Collin 2020-01-09 01:41:32 +00:00
parent d9d7a1ea59
commit 3b6f15accd
2 changed files with 52 additions and 6 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

6
apiserver/apiserver/api/models.py
View File

@ -12,9 +12,9 @@ class Member(models.Model):
set_details = models.BooleanField(default=False) set_details = models.BooleanField(default=False)
preferred_name = models.CharField(max_length=32, blank=True) preferred_name = models.CharField(max_length=32, blank=True)
phone = models.CharField(max_length=32, blank=True) phone = models.CharField(max_length=32, blank=True)
current_start_date = models.DateField(blank=True, null=True) current_start_date = models.DateField(auto_now_add=True, blank=True, null=True)
application_date = models.DateField(blank=True, null=True) application_date = models.DateField(auto_now_add=True, blank=True, null=True)
vetted_date = models.DateField(blank=True, null=True) vetted_date = models.DateField(blank=True, null=True)
monthly_fees = models.IntegerField(blank=True, null=True) monthly_fees = models.IntegerField(default=55, blank=True, null=True)
emergency_contact_name = models.CharField(max_length=64, blank=True) emergency_contact_name = models.CharField(max_length=64, blank=True)
emergency_contact_phone = models.CharField(max_length=32, blank=True) emergency_contact_phone = models.CharField(max_length=32, blank=True)

52
webclient/src/App.js
View File

@ -1,7 +1,7 @@
import React, { useState, useEffect } from 'react'; import React, { useState, useEffect } from 'react';
import './light.css'; import './light.css';
import Logo from './logo.svg'; import Logo from './logo.svg';
import { Container, Divider, Form, Grid, Header, Icon, Menu, Message, Segment } from 'semantic-ui-react'; import { Container, Divider, Form, Grid, Header, Icon, Image, Menu, Message, Segment, Table } from 'semantic-ui-react';
import { requester } from './utils.js'; import { requester } from './utils.js';
function LoginForm(props) { function LoginForm(props) {
@ -236,11 +236,57 @@ function DetailsForm(props) {
} }
function MemberInfo(props) { function MemberInfo(props) {
const member = props.user.member; const user = props.user;
const member = user.member;
return ( return (
<div> <div>
<Header size='large'>{member.first_name} {member.last_name}</Header> <Header size='large'>
<Icon.Group size='small'>
<Icon name='circle' color='green' />
</Icon.Group>
<Header.Content>{member.first_name} {member.last_name}</Header.Content>
</Header>
<p>Preferred Name: {member.preferred_name || '???'}</p>
<p>Email: {user.email}</p>
<Grid stackable>
<Grid.Column width={6}>
<Image src='https://upload.wikimedia.org/wikipedia/commons/8/89/Portrait_Placeholder.png' size='small' />
</Grid.Column>
<Grid.Column width={10}>
<Table unstackable basic='very'>
<Table.Body>
<Table.Row>
<Table.Cell>Expiry:</Table.Cell>
<Table.Cell>2099-01-01</Table.Cell>
</Table.Row>
<Table.Row>
<Table.Cell>Status:</Table.Cell>
<Table.Cell>Current</Table.Cell>
</Table.Row>
<Table.Row>
<Table.Cell>Application:</Table.Cell>
<Table.Cell>{member.application_date || '???'}</Table.Cell>
</Table.Row>
<Table.Row>
<Table.Cell>Start:</Table.Cell>
<Table.Cell>{member.current_start_date || '???'}</Table.Cell>
</Table.Row>
<Table.Row>
<Table.Cell>Vetted:</Table.Cell>
<Table.Cell>{member.vetted_date || 'Not vetted'}</Table.Cell>
</Table.Row>
<Table.Row>
<Table.Cell>Monthly</Table.Cell>
<Table.Cell>${member.monthly_fees || '???'}</Table.Cell>
</Table.Row>
</Table.Body>
</Table>
</Grid.Column>
</Grid>
</div> </div>
); );
} }