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

Add api route and webclient page for account settings

Browse Source
This commit is contained in:
Tanner Collin 2020-01-12 08:16:09 +00:00
parent 82dfa132e7
commit e256e32341
8 changed files with 200 additions and 89 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

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

@ -11,6 +11,8 @@ class Member(models.Model):
last_name = models.CharField(max_length=32)
set_details = models.BooleanField(default=False)
is_director = models.BooleanField(default=False)
is_instructor = models.BooleanField(default=False)
preferred_name = models.CharField(max_length=32, blank=True)
status = models.CharField(max_length=32, blank=True)
phone = models.CharField(max_length=32, blank=True)

42
apiserver/apiserver/api/serializers.py
View File

@ -12,8 +12,8 @@ from . import models, old_models
STATIC_FOLDER = 'data/static/'
LARGE_SIZE = 1080
MEDIUM_SIZE = 150
SMALL_SIZE = 80
MEDIUM_SIZE = 220
SMALL_SIZE = 110
def process_image(upload):
try:
@ -74,17 +74,49 @@ class OtherMemberSerializer(serializers.ModelSerializer):
# member viewing himself
class MemberSerializer(serializers.ModelSerializer):
photo = serializers.ImageField(write_only=True, required=False)
class Meta:
model = models.Member
fields = '__all__'
read_only_fields = ['user', 'application_date', 'current_start_date', 'vetted_date', 'monthly_fees', 'old_member_id']
read_only_fields = [
'id',
'is_director',
'is_instructor',
'status',
'expire_date',
'current_start_date',
'application_date',
'vetted_date',
'monthly_fees',
'photo_large',
'photo_medium',
'photo_small',
'user',
]
def update(self, instance, validated_data):
photo = validated_data.get('photo', None)
if photo:
small, medium, large = process_image(photo)
instance.photo_small = small
instance.photo_medium = medium
instance.photo_large = large
return super().update(instance, validated_data)
# adming viewing member
class AdminMemberSerializer(serializers.ModelSerializer):
class AdminMemberSerializer(MemberSerializer):
class Meta:
model = models.Member
fields = '__all__'
read_only_fields = ['id', 'user']
read_only_fields = [
'id',
'photo_large',
'photo_medium',
'photo_small',
'user',
]
class TransactionSerializer(serializers.ModelSerializer):

42
apiserver/apiserver/api/views.py
View File

@ -1,6 +1,7 @@
from django.contrib.auth.models import User, Group
from django.db.models import Max
from rest_framework import viewsets, views, permissions, mixins
from rest_framework import viewsets, views, mixins, generics, exceptions
from rest_framework.permissions import BasePermission, IsAuthenticated
from rest_framework.response import Response
from rest_auth.registration.views import RegisterView
from fuzzywuzzy import fuzz, process
@ -8,10 +9,23 @@ from collections import OrderedDict
from . import models, serializers
class AllowMetadata(permissions.BasePermission):
class AllowMetadata(BasePermission):
def has_permission(self, request, view):
return request.method in ['OPTIONS', 'HEAD']
def is_admin_director(user):
return user.is_staff or user.member.is_director
class IsOwnerOrAdmin(BasePermission):
def has_object_permission(self, request, view, obj):
return obj.user == request.user or is_admin_director(request.user)
class RetrieveUpdateViewSet(
viewsets.GenericViewSet,
mixins.RetrieveModelMixin,
mixins.UpdateModelMixin):
def list(self, request):
raise exceptions.PermissionDenied
search_strings = {}
@ -25,11 +39,10 @@ def gen_search_strings():
NUM_SEARCH_RESULTS = 10
class SearchViewSet(viewsets.GenericViewSet, mixins.RetrieveModelMixin):
permission_classes = [AllowMetadata | permissions.IsAuthenticated]
permission_classes = [AllowMetadata | IsAuthenticated]
serializer_class = serializers.OtherMemberSerializer
def get_queryset(self):
queryset = models.Member.objects.all()
search = self.request.data.get('q', '').lower()
@ -71,26 +84,19 @@ class SearchViewSet(viewsets.GenericViewSet, mixins.RetrieveModelMixin):
return Response({'seq': seq, 'results': serializer.data})
class MemberViewSet(viewsets.ModelViewSet):
permission_classes = [AllowMetadata | permissions.IsAuthenticated]
http_method_names = ['options', 'head', 'get', 'put', 'patch']
def get_queryset(self):
objects = models.Member.objects.all()
if self.request.user.is_staff:
return objects.order_by('id')
else:
return objects.filter(user=self.request.user)
class MemberViewSet(RetrieveUpdateViewSet):
permission_classes = [AllowMetadata | IsAuthenticated, IsOwnerOrAdmin]
queryset = models.Member.objects.all()
def get_serializer_class(self):
if self.request.user.is_staff:
if is_admin_director(self.request.user):
return serializers.AdminMemberSerializer
else:
return serializers.MemberSerializer
class CourseViewSet(viewsets.ModelViewSet):
permission_classes = [AllowMetadata | permissions.IsAuthenticated]
permission_classes = [AllowMetadata | IsAuthenticated]
queryset = models.Course.objects.annotate(date=Max('sessions__datetime')).order_by('-date')
def get_serializer_class(self):
@ -101,7 +107,7 @@ class CourseViewSet(viewsets.ModelViewSet):
class SessionViewSet(viewsets.ModelViewSet):
permission_classes = [AllowMetadata | permissions.IsAuthenticated]
permission_classes = [AllowMetadata | IsAuthenticated]
def get_queryset(self):
if self.action == 'list':
@ -117,7 +123,7 @@ class SessionViewSet(viewsets.ModelViewSet):
class MyUserView(views.APIView):
permission_classes = [AllowMetadata | permissions.IsAuthenticated]
permission_classes = [AllowMetadata | IsAuthenticated]
def get(self, request):
serializer = serializers.UserSerializer(request.user)

2
apiserver/apiserver/urls.py
View File

@ -7,7 +7,7 @@ from .api import views
router = routers.DefaultRouter()
#router.register(r'users', views.UserViewSet)
router.register(r'members', views.MemberViewSet, basename='member')
router.register(r'members', views.MemberViewSet, basename='members')
router.register(r'courses', views.CourseViewSet, basename='course')
router.register(r'sessions', views.SessionViewSet, basename='session')
router.register(r'search', views.SearchViewSet, basename='search')

94
webclient/src/Account.js Normal file
View File

@ -0,0 +1,94 @@
import React, { useState, useEffect } from 'react';
import { BrowserRouter as Router, Switch, Route, Link, useParams, useHistory } 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, staticUrl, requester } from './utils.js';
import { LoginForm, SignupForm } from './LoginSignup.js';
function AccountForm(props) {
const member = props.user.member;
const [input, setInput] = useState({ ...member, set_details: true });
const [error, setError] = useState({});
const [loading, setLoading] = useState(false);
const history = useHistory();
const handleValues = (e, v) => setInput({ ...input, [v.name]: v.value });
const handleUpload = (e, v) => setInput({ ...input, [v.name]: e.target.files[0] });
const handleChange = (e) => handleValues(e, e.currentTarget);
const handleSubmit = (e) => {
setLoading(true);
requester('/members/' + member.id + '/', 'PATCH', props.token, input)
.then(res => {
console.log(res);
setError({});
props.setUserCache({...props.user, member: res});
history.push('/');
})
.catch(err => {
setLoading(false);
console.log(err);
setError(err.data);
});
};
const makeProps = (name) => ({
name: name,
onChange: handleChange,
value: input[name],
error: error[name],
});
return (
<Form onSubmit={handleSubmit}>
<Header size='medium'>Member Details</Header>
<Form.Input
label='First Name'
{...makeProps('first_name')}
/>
<Form.Input
label='Last Name'
{...makeProps('last_name')}
/>
<Form.Input
label='Preferred First Name'
{...makeProps('preferred_name')}
/>
<Form.Input
label='Phone Number (999) 555-1234'
{...makeProps('phone')}
/>
<Form.Input
label='Emergency Contact Name'
{...makeProps('emergency_contact_name')}
/>
<Form.Input
label='Emergency Contact Phone'
{...makeProps('emergency_contact_phone')}
/>
<Form.Input
label='Member Photo'
name='photo'
type='file'
accept='image/*'
onChange={handleUpload}
/>
<Form.Button loading={loading} error={error.non_field_errors}>
Submit
</Form.Button>
</Form>
);
};
export function Account(props) {
return (
<Container>
<Header size='large'>Account Settings</Header>
<AccountForm {...props} />
</Container>
);
};

16
webclient/src/App.js
View File

@ -3,6 +3,7 @@ import { BrowserRouter as Router, Switch, Route, Link, useParams } from 'react-r
import './light.css'; import { Container, Divider, Dropdown, Form, Grid, Header, Icon, Image, Menu, Message, Segment, Table } from 'semantic-ui-react';
import { requester } from './utils.js';
import { Home } from './Home.js';
import { Account } from './Account.js';
import { Transactions, TransactionDetail } from './Transactions.js';
import { Cards } from './Cards.js';
import { Training } from './Training.js';
@ -39,9 +40,9 @@ function App() {
}, [token]);
function logout() {
window.location = '/';
setTokenCache('');
setUserCache(false);
window.location = '/';
}
return (
@ -65,9 +66,9 @@ function App() {
<Dropdown item text='Member' id='ps-menu'>
<Dropdown.Menu>
<Dropdown.Item
content='Profile'
content='Account'
as={Link}
to='/transactions'
to='/account'
/>
<Dropdown.Item
content='Transactions'
@ -84,11 +85,6 @@ function App() {
as={Link}
to='/cards'
/>
<Dropdown.Item
content='Account'
as={Link}
to='/cards'
/>
</Dropdown.Menu>
</Dropdown>
@ -130,6 +126,10 @@ function App() {
<div className='topPadding'>
{user ?
<Switch>
<Route path='/account'>
<Account token={token} user={user} setUserCache={setUserCache} />
</Route>
<Route path='/transactions/:id'>
<TransactionDetail user={user} />
</Route>

51
webclient/src/Home.js
View File

@ -7,21 +7,11 @@ import { LoginForm, SignupForm } from './LoginSignup.js';
function SignupDetailsForm(props) {
const member = props.user.member;
const [input, setInput] = useState({
preferred_name: member.preferred_name,
phone: member.phone,
emergency_contact_name: member.emergency_contact_name,
emergency_contact_phone: member.emergency_contact_phone,
set_details: true,
});
const [input, setInput] = useState({ ...member, set_details: true });
const [error, setError] = useState({});
const [loading, setLoading] = useState(false);
const handleValues = (e, v) => setInput({
...input,
[v.name]: v.value
});
const handleValues = (e, v) => setInput({ ...input, [v.name]: v.value });
const handleChange = (e) => handleValues(e, e.currentTarget);
const handleSubmit = (e) => {
@ -39,36 +29,31 @@ function SignupDetailsForm(props) {
});
};
const makeProps = (name) => ({
name: name,
onChange: handleChange,
value: input[name],
error: error[name],
});
return (
<Form onSubmit={handleSubmit}>
<Header size='medium'>Enter Member Details</Header>
<Form.Input
label='Preferred Name'
name='preferred_name'
onChange={handleChange}
value={input.preferred_name}
error={error.preferred_name}
label='Preferred First Name'
{...makeProps('preferred_name')}
/>
<Form.Input
label='Phone Number (999) 555-1234'
name='phone'
onChange={handleChange}
value={input.phone}
error={error.phone}
{...makeProps('phone')}
/>
<Form.Input
label='Emergency Contact Name'
name='emergency_contact_name'
onChange={handleChange}
value={input.emergency_contact_name}
error={error.emergency_contact_name}
{...makeProps('emergency_contact_name')}
/>
<Form.Input
label='Emergency Contact Phone'
name='emergency_contact_phone'
onChange={handleChange}
value={input.emergency_contact_phone}
error={error.emergency_contact_phone}
{...makeProps('emergency_contact_phone')}
/>
<Form.Button loading={loading} error={error.non_field_errors}>
@ -107,7 +92,7 @@ function MemberInfo(props) {
<Table.Body>
<Table.Row>
<Table.Cell>Status:</Table.Cell>
<Table.Cell>{member.status}</Table.Cell>
<Table.Cell>{member.status || 'Unknown'}</Table.Cell>
</Table.Row>
<Table.Row>
<Table.Cell>Expiry:</Table.Cell>
@ -123,11 +108,11 @@ function MemberInfo(props) {
<Table.Body>
<Table.Row>
<Table.Cell>Application:</Table.Cell>
<Table.Cell>{member.application_date || '???'}</Table.Cell>
<Table.Cell>{member.application_date || 'Unknown'}</Table.Cell>
</Table.Row>
<Table.Row>
<Table.Cell>Start:</Table.Cell>
<Table.Cell>{member.current_start_date || '???'}</Table.Cell>
<Table.Cell>{member.current_start_date || 'Unknown'}</Table.Cell>
</Table.Row>
<Table.Row>
<Table.Cell>Vetted:</Table.Cell>
@ -135,7 +120,7 @@ function MemberInfo(props) {
</Table.Row>
<Table.Row>
<Table.Cell>Monthly:</Table.Cell>
<Table.Cell>${member.monthly_fees || '???'}</Table.Cell>
<Table.Cell>${member.monthly_fees || 'Unknown'}</Table.Cell>
</Table.Row>
<Table.Row>
<Table.Cell>Card Number:</Table.Cell>

40
webclient/src/LoginSignup.js
View File

@ -9,11 +9,7 @@ export function LoginForm(props) {
const [error, setError] = useState({});
const [loading, setLoading] = useState(false);
const handleValues = (e, v) => setInput({
...input,
[v.name]: v.value
});
const handleValues = (e, v) => setInput({ ...input, [v.name]: v.value });
const handleChange = (e) => handleValues(e, e.currentTarget);
const handleSubmit = (e) => {
@ -60,11 +56,7 @@ export function SignupForm(props) {
const [error, setError] = useState({});
const [loading, setLoading] = useState(false);
const handleValues = (e, v) => setInput({
...input,
[v.name]: v.value
});
const handleValues = (e, v) => setInput({ ...input, [v.name]: v.value });
const handleChange = (e) => handleValues(e, e.currentTarget);
const genUsername = () => (
@ -93,26 +85,26 @@ export function SignupForm(props) {
return (
<Form onSubmit={handleSubmit}>
<Header size='medium'>Sign Up</Header>
<Form.Group widths='equal'>
<Form.Input
label='First Name'
name='first_name'
onChange={handleChange}
error={error.first_name}
/>
<Form.Input
label='Last Name'
name='last_name'
onChange={handleChange}
error={error.last_name}
/>
</Form.Group>
<Form.Input
label='First Name'
name='first_name'
onChange={handleChange}
error={error.first_name}
/>
<Form.Input
label='Last Name'
name='last_name'
onChange={handleChange}
error={error.last_name}
/>
<Form.Input
label='Username'
name='username'
value={genUsername()}
error={error.username}
readOnly
/>
<Form.Input
label='Email'