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.
93 lines
2.7 KiB
93 lines
2.7 KiB
import React, { Component } from "react"; |
|
import { connect } from "react-redux"; |
|
import { Link } from "react-router-dom"; |
|
import { Card, Button, Label } from "semantic-ui-react"; |
|
|
|
import { deleteWorktypeRequest } from "../../../actions/worktype/saga.actions"; |
|
|
|
class ClientProfile extends Component { |
|
deleteWorkType = uuid => { |
|
this.props.dispatch(deleteWorktypeRequest(uuid)); |
|
}; |
|
|
|
render() { |
|
const { selfUser } = this.props; |
|
return ( |
|
<ClientProfileView user={selfUser} deleteWorkType={this.deleteWorkType} /> |
|
); |
|
} |
|
} |
|
|
|
function mapStateToProps(state) { |
|
return { ...state.user }; |
|
} |
|
|
|
const ClientProfileView = ({ user, deleteWorkType }) => ( |
|
<div> |
|
<Card fluid={true}> |
|
<Card.Content> |
|
<Card.Header>Client Information</Card.Header> |
|
<Card.Meta>Business Number: {user.client.business_number}</Card.Meta> |
|
<Card.Description> |
|
<Button |
|
basic |
|
color="green" |
|
size="small" |
|
as={Link} |
|
to="/user/profile/client/create-worktype" |
|
> |
|
Create Worktype |
|
</Button> |
|
</Card.Description> |
|
</Card.Content> |
|
</Card> |
|
{(user.client.work_types || []).filter(worktype => !worktype.deleted) |
|
.length > 0 && |
|
<Card.Group> |
|
{user.client.work_types |
|
.filter(worktype => !worktype.deleted) |
|
.map((worktype, index) => ( |
|
<Card key={index}> |
|
<Card.Content> |
|
<Card.Header as="h4"> |
|
<Label |
|
circular |
|
empty |
|
style={{ |
|
backgroundColor: worktype.color, |
|
borderColor: worktype.color |
|
}} |
|
/>{" " + worktype.label} |
|
</Card.Header> |
|
<Card.Meta> |
|
Worktype |
|
</Card.Meta> |
|
</Card.Content> |
|
<Card.Content extra> |
|
<Button.Group> |
|
<Button |
|
basic |
|
color="yellow" |
|
size="small" |
|
as={Link} |
|
to={`/user/profile/client/update-worktype/${worktype.uuid}`} |
|
> |
|
Edit |
|
</Button> |
|
<Button |
|
basic |
|
color="red" |
|
size="small" |
|
onClick={() => deleteWorkType(worktype.uuid)} |
|
> |
|
Delete |
|
</Button> |
|
</Button.Group> |
|
</Card.Content> |
|
</Card> |
|
))} |
|
</Card.Group>} |
|
</div> |
|
); |
|
|
|
export default connect(mapStateToProps)(ClientProfile);
|
|
|