Ivan - Add user view [skip ci]
This commit is contained in:
parent
d5cdbd723f
commit
55e6f344c3
|
@ -90,7 +90,7 @@ export default (
|
|||
<Route path="users">
|
||||
<IndexRedirect to="list-users" />
|
||||
<Route path="list-users" component={AdminPanelListUsers} />
|
||||
<Route path="view-user" component={AdminPanelViewUser} />
|
||||
<Route path="view-user/:userId" component={AdminPanelViewUser} />
|
||||
<Route path="ban-users" component={AdminPanelBanUsers} />
|
||||
</Route>
|
||||
|
||||
|
|
|
@ -1,14 +1,119 @@
|
|||
import React from 'react';
|
||||
import {connect} from 'react-redux';
|
||||
import {browserHistory} from 'react-router';
|
||||
|
||||
import i18n from 'lib-app/i18n';
|
||||
import API from 'lib-app/api-call';
|
||||
|
||||
import Header from 'core-components/header';
|
||||
import Button from 'core-components/button';
|
||||
import TicketList from 'app-components/ticket-list';
|
||||
import AreYouSure from 'app-components/are-you-sure';
|
||||
|
||||
class AdminPanelViewUser extends React.Component {
|
||||
|
||||
state = {
|
||||
name: '',
|
||||
email: '',
|
||||
tickets: [],
|
||||
invalid: false,
|
||||
loading: true
|
||||
};
|
||||
|
||||
componentDidMount() {
|
||||
API.call({
|
||||
path: '/user/get-user',
|
||||
data: {
|
||||
userId: this.props.params.userId
|
||||
}
|
||||
}).then(this.onUserRetrieved.bind(this)).catch(() => this.setState({
|
||||
invalid: true
|
||||
}));
|
||||
}
|
||||
|
||||
render() {
|
||||
return (
|
||||
<div>
|
||||
/admin/panel/users/view-user
|
||||
<div className="admin-panel-view-user">
|
||||
<Header title={i18n('USER_VIEW_TITLE', {userId: this.props.params.userId})} description={i18n('USER_VIEW_DESCRIPTION')} />
|
||||
{(this.state.invalid) ? this.renderInvalid() : this.renderUserInfo()}
|
||||
</div>
|
||||
);
|
||||
}
|
||||
|
||||
renderInvalid() {
|
||||
return (
|
||||
<div className="admin-panel-view-user__invalid">
|
||||
{i18n('INVALID_USER')}
|
||||
</div>
|
||||
);
|
||||
}
|
||||
|
||||
renderUserInfo() {
|
||||
return (
|
||||
<div className="admin-panel-view-user__content">
|
||||
<div className="admin-panel-view-user__info">
|
||||
<div className="admin-panel-view-user__info-item">
|
||||
{i18n('NAME')}
|
||||
<div className="admin-panel-view-user__info-box">
|
||||
{this.state.name}
|
||||
</div>
|
||||
</div>
|
||||
<div className="admin-panel-view-user__info-item">
|
||||
{i18n('EMAIL')}
|
||||
<div className="admin-panel-view-user__info-box">
|
||||
{this.state.email}
|
||||
</div>
|
||||
</div>
|
||||
<div className="admin-panel-view-user__delete-button">
|
||||
<Button onClick={this.onDeleteClick.bind(this)} size="medium">{i18n('DELETE_AND_BAN')}</Button>
|
||||
</div>
|
||||
</div>
|
||||
<span className="admin-panel-view-user__separator" />
|
||||
<div className="admin-panel-view-user__tickets">
|
||||
<div className="admin-panel-view-user__tickets-title">{i18n('TICKETS')}</div>
|
||||
<TicketList {...this.getTicketListProps()}/>
|
||||
</div>
|
||||
</div>
|
||||
);
|
||||
}
|
||||
|
||||
getTicketListProps() {
|
||||
return {
|
||||
type: 'secondary',
|
||||
tickets: this.state.tickets,
|
||||
loading: this.state.loading,
|
||||
departments: this.props.departments,
|
||||
ticketPath: '/admin/panel/tickets/view-ticket/'
|
||||
};
|
||||
}
|
||||
|
||||
onUserRetrieved(result) {
|
||||
this.setState({
|
||||
name: result.data.name,
|
||||
email: result.data.email,
|
||||
tickets: result.data.tickets,
|
||||
loading: false
|
||||
});
|
||||
}
|
||||
|
||||
onDeleteClick() {
|
||||
AreYouSure.openModal(i18n('DELETE_USER_DESCRIPTION'), this.deleteUser.bind(this))
|
||||
}
|
||||
|
||||
deleteUser() {
|
||||
API.call({
|
||||
path: '/user/delete',
|
||||
data: {
|
||||
userId: this.props.params.userId
|
||||
}
|
||||
}).then(() => {
|
||||
browserHistory.push('/admin/panel/user/list-users');
|
||||
});
|
||||
}
|
||||
}
|
||||
|
||||
export default AdminPanelViewUser;
|
||||
export default connect((store) => {
|
||||
return {
|
||||
departments: store.session.userDepartments
|
||||
};
|
||||
})(AdminPanelViewUser);
|
||||
|
|
|
@ -0,0 +1,40 @@
|
|||
@import '../../../../scss/vars';
|
||||
|
||||
.admin-panel-view-user {
|
||||
|
||||
&__info {
|
||||
text-align: left;
|
||||
|
||||
&-item {
|
||||
display: inline-block;
|
||||
margin-right: 20px;
|
||||
width: 200px;
|
||||
}
|
||||
|
||||
&-box {
|
||||
background-color: $grey;
|
||||
color: $primary-black;
|
||||
font-size: $font-size--sm;
|
||||
padding: 5px 15px;
|
||||
text-align: center;
|
||||
}
|
||||
}
|
||||
|
||||
&__delete-button {
|
||||
margin-top: 20px;
|
||||
}
|
||||
|
||||
&__separator {
|
||||
background-color: $grey;
|
||||
display: block;
|
||||
margin: 30px 0;
|
||||
height: 1px;
|
||||
width: 100%;
|
||||
}
|
||||
|
||||
&__tickets-title {
|
||||
font-size: $font-size--md;
|
||||
margin-bottom: 20px;
|
||||
text-align: left;
|
||||
}
|
||||
}
|
|
@ -41,7 +41,7 @@ class Button extends React.Component {
|
|||
|
||||
static defaultProps = {
|
||||
type: 'primary',
|
||||
size: 'medium'
|
||||
size: 'large'
|
||||
};
|
||||
|
||||
render() {
|
||||
|
|
|
@ -59,11 +59,14 @@
|
|||
}
|
||||
|
||||
&_medium {
|
||||
width: 239px;
|
||||
width: auto;
|
||||
padding: 5px 15px;
|
||||
height: 35px;
|
||||
text-transform: none;
|
||||
}
|
||||
|
||||
&_large {
|
||||
//width: 239px;
|
||||
width: 239px;
|
||||
}
|
||||
|
||||
&_auto {
|
||||
|
|
|
@ -1,3 +1,5 @@
|
|||
import _ from 'lodash';
|
||||
|
||||
module.exports = [
|
||||
{
|
||||
path: '/user/login',
|
||||
|
@ -124,6 +126,137 @@ module.exports = [
|
|||
};
|
||||
}
|
||||
},
|
||||
{
|
||||
path: '/user/get-user',
|
||||
time: 100,
|
||||
response: function () {
|
||||
return {
|
||||
status: 'success',
|
||||
data: {
|
||||
name: 'Kurt Gödel',
|
||||
email: 'kurt@currycurrylady.hs',
|
||||
tickets: _.times(13).map(() => {
|
||||
return {
|
||||
ticketNumber: '118551',
|
||||
title: 'Lorem ipsum door',
|
||||
content: 'I had a problem with the installation of the php server',
|
||||
department: {
|
||||
id: 1,
|
||||
name: 'Sales Support'
|
||||
},
|
||||
date: '20150409',
|
||||
file: 'http://www.opensupports.com/some_file.zip',
|
||||
language: 'en',
|
||||
unread: false,
|
||||
closed: false,
|
||||
priority: 'low',
|
||||
author: {
|
||||
name: 'Haskell Curry',
|
||||
email: 'haskell@lambda.com'
|
||||
},
|
||||
owner: {
|
||||
name: 'Steve Jobs'
|
||||
},
|
||||
events: [
|
||||
{
|
||||
type: 'ASSIGN',
|
||||
date: '20150409',
|
||||
author: {
|
||||
name: 'Emilia Clarke',
|
||||
email: 'jobs@steve.com',
|
||||
profilePic: 'http://www.opensupports.com/profilepic.jpg',
|
||||
staff: true
|
||||
}
|
||||
},
|
||||
{
|
||||
type: 'COMMENT',
|
||||
date: '20150409',
|
||||
content: 'Do you have apache installed? It generally happens if you dont have apache.',
|
||||
author: {
|
||||
name: 'Emilia Clarke',
|
||||
email: 'jobs@steve.com',
|
||||
profilePic: 'http://www.opensupports.com/profilepic.jpg',
|
||||
staff: true
|
||||
}
|
||||
},
|
||||
{
|
||||
type: 'UN_ASSIGN',
|
||||
date: '20150410',
|
||||
author: {
|
||||
name: 'Emilia Clarke',
|
||||
email: 'jobs@steve.com',
|
||||
profilePic: 'http://www.opensupports.com/profilepic.jpg',
|
||||
staff: true
|
||||
}
|
||||
},
|
||||
{
|
||||
type: 'DEPARTMENT_CHANGED',
|
||||
date: '20150411',
|
||||
content: 'System support',
|
||||
author: {
|
||||
name: 'Emilia Clarke',
|
||||
email: 'jobs@steve.com',
|
||||
profilePic: 'http://www.opensupports.com/profilepic.jpg',
|
||||
staff: true
|
||||
}
|
||||
},
|
||||
{
|
||||
type: 'COMMENT',
|
||||
date: '20150412',
|
||||
content: 'I have already installed apache, but the problem persists',
|
||||
author: {
|
||||
name: 'Haskell Curry',
|
||||
steve: 'haskell@lambda.com',
|
||||
staff: false
|
||||
}
|
||||
},
|
||||
{
|
||||
type: 'PRIORITY_CHANGED',
|
||||
date: '20150413',
|
||||
content: 'MEDIUM',
|
||||
author: {
|
||||
name: 'Emilia Clarke',
|
||||
email: 'jobs@steve.com',
|
||||
profilePic: 'http://www.opensupports.com/profilepic.jpg',
|
||||
staff: true
|
||||
}
|
||||
},
|
||||
{
|
||||
type: 'COMMENT',
|
||||
date: '20150511',
|
||||
content: 'Thanks!, I soved it by myself',
|
||||
author: {
|
||||
name: 'Haskell Curry',
|
||||
steve: 'haskell@lambda.com',
|
||||
staff: false
|
||||
}
|
||||
},
|
||||
{
|
||||
type: 'CLOSE',
|
||||
date: '20150513',
|
||||
author: {
|
||||
name: 'Emilia Clarke',
|
||||
email: 'jobs@steve.com',
|
||||
profilePic: 'http://www.opensupports.com/profilepic.jpg',
|
||||
staff: true
|
||||
}
|
||||
},
|
||||
{
|
||||
type: 'RE_OPEN',
|
||||
date: '20151018',
|
||||
author: {
|
||||
name: 'Haskell Curry',
|
||||
email: 'haskell@lambda.com',
|
||||
staff: false
|
||||
}
|
||||
}
|
||||
]
|
||||
};
|
||||
})
|
||||
}
|
||||
}
|
||||
}
|
||||
},
|
||||
{
|
||||
path: '/user/get-users',
|
||||
time: 100,
|
||||
|
|
|
@ -59,6 +59,7 @@ export default {
|
|||
'SAVE': 'Save',
|
||||
'DISCARD_CHANGES': 'Discard changes',
|
||||
'DELETE': 'Delete',
|
||||
'DELETE_AND_BAN': 'Delete and ban',
|
||||
'LANGUAGE': 'Language',
|
||||
'OWNER': 'Owner',
|
||||
'OWNED': 'Owned',
|
||||
|
@ -78,7 +79,8 @@ export default {
|
|||
'NAME': 'Name',
|
||||
'SIGNUP_DATE': 'Sign up date',
|
||||
'SEARCH_USERS': 'Search users...',
|
||||
|
||||
'USER_VIEW_TITLE': 'User #{userId}',
|
||||
|
||||
//VIEW DESCRIPTIONS
|
||||
'CREATE_TICKET_DESCRIPTION': 'This is a form for creating tickets. Fill the form and send us your issues/doubts/suggestions. Our support system will answer it as soon as possible.',
|
||||
'TICKET_LIST_DESCRIPTION': 'Here you can find a list of all tickets you have sent to our support team.',
|
||||
|
@ -92,6 +94,8 @@ export default {
|
|||
'ALL_TICKETS_DESCRIPTION': 'Here you can view the tickets of the departments you are assigned.',
|
||||
'TICKET_VIEW_DESCRIPTION': 'This ticket has been sent by a customer. Here you can respond or assign the ticket',
|
||||
'LIST_USERS_DESCRIPTION': 'This is the list of users that are registered in this platform. You can search for someone in particular, delete it or ban it.',
|
||||
'USER_VIEW_DESCRIPTION': 'Here you can find all the information about an user and all the tickets sent by the user. You can also delete or ban it.',
|
||||
'DELETE_USER_DESCRIPTION': 'The user will not be able to log in aging and all its tickets will be erased. Also, the email can not be used any more.',
|
||||
|
||||
//ERRORS
|
||||
'EMAIL_OR_PASSWORD': 'Email or password invalid',
|
||||
|
@ -106,6 +110,7 @@ export default {
|
|||
'INVALID_RECOVER': 'Invalid recover data',
|
||||
'TICKET_SENT_ERROR': 'An error occurred while trying to create the ticket.',
|
||||
'NO_PERMISSION': 'You\'ve no permission to access to this page.',
|
||||
'INVALID_USER': 'User id is invalid',
|
||||
|
||||
//MESSAGES
|
||||
'SIGNUP_SUCCESS': 'You have registered successfully in our support system.',
|
||||
|
|
Loading…
Reference in New Issue