diff options
Diffstat (limited to 'client/components/LoggedInView.jsx')
| -rw-r--r-- | client/components/LoggedInView.jsx | 110 |
1 files changed, 110 insertions, 0 deletions
diff --git a/client/components/LoggedInView.jsx b/client/components/LoggedInView.jsx new file mode 100644 index 0000000..5c7a690 --- /dev/null +++ b/client/components/LoggedInView.jsx @@ -0,0 +1,110 @@ +import React from 'react' +import ModalDialog from './ModalDialog.jsx' +import UserList from './UserList.jsx' +import MealList from './MealList.jsx' + +import client from '../client' + +export default class LoggedInView extends React.Component { + constructor(props) { + super() + this.state = { + user: Object.assign({}, props.user), + mode: 'meals', + } + this.updateUser = this.updateUser.bind(this) + this.toggleMode = this.toggleMode.bind(this) + } + toggleMode(){ + this.state.mode = this.state.mode == 'meals' ? 'users' : 'meals' + } + updateUser(user) { + this.setState({ + user: user + }) + } + render() { + let activity = null + if (this.state.mode == 'meals') { + activity = (<MealList user={this.state.user} currentUser={this.props.user} />) + } + else { + activity = (<UserList user={this.state.user} currentUser={this.props.user} updateUser={this.updateUser} />) + } + return ( + <div> + <Menu mode={this.state.mode} + user={this.state.user} + toggleMode={this.toggleMode} + currentUser={this.props.user} + updateUser={this.updateUser} /> + {activity} + </div> + ) + } +} + + +class Menu extends React.Component { + constructor() { + super() + this.setGoal = this.setGoal.bind(this) + this.logout = this.logout.bind(this) + } + setGoal() { + const goal = Math.abs(parseInt(prompt('Please enter your calorie goal', this.props.user.goal))) + if (goal) { + client.service('users').patch(this.props.user.id, { + goal: goal, + token: client.get('token'), + }).then((user) => { + this.props.updateUser(user) + }) + } + } + logout() { + client.logout().then(() => { + window.location.reload() + }) + } + render() { + const user = this.props.user + const items = [] + items.push( <li key='hello'>Hello {user.email}</li> ) + items.push( <li key='goal'><a href='#' onClick={this.setGoal}>Goal</a>: {user.goal}</li> ) + switch (user.role) { + case 'admin': + if (this.props.user.id !== this.props.currentUser.id) { + items.push( <li key='resetUser'><a href='#' onClick={this.resetUser}>Reset User</a></li> ) + } + items.push( <li key='userlist'><a href='#' onClick={this.props.toggleMode}>Users</a></li> ) + items.push( <li key='userlist'><a href='#' onClick={this.props.toggleMode}>Meals</a></li> ) + break + case 'manager': + items.push( <li key='userlist'><a href='#' onClick={this.props.toggleMode}>Users</a></li> ) + items.push( <li key='userlist'><a href='#' onClick={this.props.toggleMode}>Meals</a></li> ) + case 'user': + break + } + items.push( <li key='logout'><a href='#' onClick={this.logout}>Logout</a></li> ) + + return ( + <div> + <ul className='menu'> + {items} + </ul> + </div> + ) + // <ProfileModal user={user} visible={false} onClose={() => {}} /> + } +} + + +// class ProfileModal extends React.Component { +// render() { +// return ( +// <ModalDialog visible={this.props.visible} onClose={this.props.onClose}> +// </ModalDialog> +// ) +// } +// } |
