79 lines
2.4 KiB
JavaScript
79 lines
2.4 KiB
JavaScript
import React from 'react'
|
|
|
|
function uploadImage() {}
|
|
|
|
function Profile(props) {
|
|
const user = props.user
|
|
user['createdAt'] = '2019-06-23T10:59:10'
|
|
user['username'] = user.name || 'Me'
|
|
user['display_name'] = user.name || 'Me'
|
|
user['avatar'] = user.avatar || '/img/default-user-image.png'
|
|
user['projects'] = [1]
|
|
|
|
// file upload
|
|
// https://www.npmjs.com/package/bootstrap-imageupload
|
|
//$('#my-imageupload').imageupload()
|
|
|
|
return (
|
|
<div>
|
|
<form className="form-group" name="profile">
|
|
<ul className="list-group">
|
|
<li className="list-group-item row">
|
|
<span className="col-lg-1 col-md-1 col-sm-1 col-xs-1">Name:</span>
|
|
<span className="col">{user.username}</span>
|
|
</li>
|
|
<li className="list-group-item row">
|
|
<span className="col">Display name</span>
|
|
<input
|
|
className="col-lg-5 col-md-5 col-sm-5 col-xs-5"
|
|
type="text"
|
|
name="username"
|
|
value={user.display_name}
|
|
onChange={props.handleChange}
|
|
/>
|
|
</li>
|
|
<li className="list-group-item row">
|
|
<span className="col">Avatar:</span>
|
|
<img
|
|
className="img-fluid"
|
|
src={user.avatar}
|
|
alt="avatar"
|
|
onClick={uploadImage}
|
|
/>
|
|
<input type="file" name="image-file" />
|
|
</li>
|
|
<li className="list-group-item row">
|
|
<span className="col">created:</span>
|
|
<span className="col">{user.createdAt}</span>
|
|
</li>
|
|
<li className="list-group-item row">
|
|
<span className="col-sm-1">projects:</span>
|
|
{user.projects.length > 0 &&
|
|
user.projects.map(id => {
|
|
const project = props.projects.find(p => p.id === id)
|
|
return (
|
|
<span
|
|
key={project.id}
|
|
onClick={() => props.selectProject(id)}
|
|
>
|
|
{project.name}
|
|
</span>
|
|
)
|
|
})}
|
|
</li>
|
|
<li className="list-group-item row">
|
|
<input
|
|
className="btn btn-outline-success col"
|
|
type="submit"
|
|
onClick={props.updateTask}
|
|
value="Save"
|
|
/>
|
|
</li>
|
|
</ul>
|
|
</form>
|
|
</div>
|
|
)
|
|
}
|
|
|
|
export default Profile
|