parent
0ae0a92187
commit
0486a7fe64
8 changed files with 184 additions and 109 deletions
@ -0,0 +1,115 @@ |
|||||||
|
import React, { Component } from "react"; |
||||||
|
import { connect } from "react-redux"; |
||||||
|
import { Redirect, Link } from "react-router-dom"; |
||||||
|
import { |
||||||
|
Button, |
||||||
|
Card, |
||||||
|
Container, |
||||||
|
Header, |
||||||
|
Label, |
||||||
|
Popup, |
||||||
|
Segment |
||||||
|
} from "semantic-ui-react"; |
||||||
|
|
||||||
|
import { deleteWorktypeRequest } from "../../actions/worktype/saga.actions"; |
||||||
|
|
||||||
|
class Worktypes extends Component { |
||||||
|
deleteWorkType = uuid => { |
||||||
|
this.props.dispatch(deleteWorktypeRequest(uuid)); |
||||||
|
}; |
||||||
|
|
||||||
|
render() { |
||||||
|
const { selfUser } = this.props; |
||||||
|
if (selfUser.client) { |
||||||
|
return ( |
||||||
|
<WorktypesView |
||||||
|
user={selfUser} |
||||||
|
deleteWorkType={this.deleteWorkType} |
||||||
|
/> |
||||||
|
); |
||||||
|
} else { |
||||||
|
return <Redirect to="/" />; |
||||||
|
} |
||||||
|
} |
||||||
|
} |
||||||
|
|
||||||
|
function mapStateToProps(state) { |
||||||
|
return { selfUser: state.user.selfUser }; |
||||||
|
} |
||||||
|
|
||||||
|
const WorktypesView = ({ user, deleteWorkType, worktypeSuccess }) => ( |
||||||
|
<Container> |
||||||
|
<Header>Worktypes</Header> |
||||||
|
<Segment> |
||||||
|
<Button |
||||||
|
basic |
||||||
|
color="green" |
||||||
|
size="small" |
||||||
|
as={Link} |
||||||
|
to="/user/profile/client/create-worktype" |
||||||
|
> |
||||||
|
Create Worktype |
||||||
|
</Button> |
||||||
|
</Segment> |
||||||
|
{(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> |
||||||
|
<Popup |
||||||
|
content={ |
||||||
|
<div> |
||||||
|
Are you sure you want to delete this work type?<br /> |
||||||
|
<Button |
||||||
|
basic |
||||||
|
color="red" |
||||||
|
size="small" |
||||||
|
onClick={() => deleteWorkType(worktype.uuid)} |
||||||
|
> |
||||||
|
Confirm Deletion |
||||||
|
</Button> |
||||||
|
</div> |
||||||
|
} |
||||||
|
trigger={ |
||||||
|
<Button basic color="red" size="small">Delete</Button> |
||||||
|
} |
||||||
|
on="click" |
||||||
|
position="top right" |
||||||
|
/> |
||||||
|
</Button.Group> |
||||||
|
</Card.Content> |
||||||
|
</Card> |
||||||
|
))} |
||||||
|
</Card.Group>} |
||||||
|
</Container> |
||||||
|
); |
||||||
|
|
||||||
|
export default connect(mapStateToProps)(Worktypes); |
Loading…
Reference in new issue