tyler.durden/opensupports
1
0
Fork 0
mirror of https://github.com/opensupports/opensupports.git synced 2025-04-08 18:35:06 +02:00
Code Issues Packages Projects Releases Wiki Activity

Ivan - wip [skip ci]

Browse Source
This commit is contained in:
ivan 2016-10-15 19:37:29 -03:00
parent 0642e04b31
commit 5e25905e3c
3 changed files with 94 additions and 30 deletions
client/src
app-components
ticket-viewer.jsticket-viewer.scss
data/languages
en.js

106
client/src/app-components/ticket-viewer.js

@ -10,6 +10,8 @@ import TicketAction from 'app-components/ticket-action';
import Form from 'core-components/form';
import FormField from 'core-components/form-field';
import SubmitButton from 'core-components/submit-button';
import DropDown from 'core-components/drop-down';
import Button from 'core-components/button';
class TicketViewer extends React.Component {
static propTypes = {
@ -18,7 +20,7 @@ class TicketViewer extends React.Component {
};
static defaultProps = {
editable: false,
editable: true,
ticket: {
author: {},
department: {},
@ -44,6 +46,83 @@ class TicketViewer extends React.Component {
<span className="ticket-viewer__number">#{ticket.ticketNumber}</span>
<span className="ticket-viewer__title">{ticket.title}</span>
</div>
{this.props.editable ? this.renderEditableHeaders() : this.renderHeaders()}
<div className="ticket-viewer__content">
<TicketAction type="COMMENT" author={ticket.author} content={ticket.content} date={ticket.date} file={ticket.file}/>
</div>
<div className="ticket-viewer__comments">
{ticket.actions && ticket.actions.map(this.renderAction.bind(this))}
</div>
<div className="ticket-viewer__response">
<div className="ticket-viewer__response-title row">{i18n('RESPOND')}</div>
<div className="ticket-viewer__response-field row">
<Form onSubmit={this.onSubmit.bind(this)} loading={this.state.loading}>
<FormField name="content" validation="TEXT_AREA" required field="textarea" />
<SubmitButton>{i18n('RESPOND_TICKET')}</SubmitButton>
</Form>
</div>
</div>
</div>
);
}
renderEditableHeaders() {
const ticket = this.props.ticket;
const priorities = {
'low': 0,
'medium': 1,
'high': 2
};
const priorityList = [
{content: i18n('LOW')},
{content: i18n('MEDIUM')},
{content: i18n('HIGH')}
];
return (
<div className="ticket-viewer__headers">
<div className="ticket-viewer__info-row-header row">
<div className="col-md-4">{i18n('DEPARTMENT')}</div>
<div className=" col-md-4">{i18n('AUTHOR')}</div>
<div className="col-md-4">{i18n('DATE')}</div>
</div>
<div className="ticket-viewer__info-row-values row">
<div className="col-md-4">{ticket.department.name}</div>
<div className="col-md-4">{ticket.author.name}</div>
<div className="col-md-4">{ticket.date}</div>
</div>
<div className="ticket-viewer__info-row-header row">
<div className="col-md-4">{i18n('PRIORITY')}</div>
<div className="col-md-4">{i18n('OWNED')}</div>
<div className="col-md-4">{i18n('STATUS')}</div>
</div>
<div className="ticket-viewer__info-row-values row">
<div className="col-md-4">
<DropDown className="ticket-viewer__editable-dropdown" items={priorityList} selectedIndex={priorities[ticket.priority]} />
</div>
<div className="col-md-4">
<Button type="secondary" size="small">
{i18n(ticket.owner ? 'ASSIGN' : 'UN_ASSIGN')}
</Button>
</div>
<div className="col-md-4">
{i18n((ticket.closed) ? 'CLOSED' : 'OPEN')}
</div>
</div>
</div>
);
}
renderHeaders() {
const ticket = this.props.ticket;
const priorities = {
'low': 'LOW',
'medium': 'MEDIUM',
'high': 'HIGH'
};
return (
<div className="ticket-viewer__headers">
<div className="ticket-viewer__info-row-header row">
<div className="ticket-viewer__department col-md-4">{i18n('DEPARTMENT')}</div>
<div className="ticket-viewer__author col-md-4">{i18n('AUTHOR')}</div>
@ -60,28 +139,15 @@ class TicketViewer extends React.Component {
<div className="ticket-viewer__date col-md-4">{i18n('STATUS')}</div>
</div>
<div className="ticket-viewer__info-row-values row">
<div className="ticket-viewer__department col-md-4">
{ticket.priority}
<div className="col-md-4">
{i18n(priorities[this.props.ticket.priority || 'low'])}
</div>
<div className="ticket-viewer__author col-md-4">
<div className="col-md-4">
{(ticket.owner) ? ticket.owner.name : i18n('NONE')}
</div>
<div className="col-md-4">
{i18n((ticket.closed) ? 'CLOSED' : 'OPEN')}
</div>
<div className="ticket-viewer__date col-md-4">{ticket.date}</div>
</div>
<div className="ticket-viewer__content">
<TicketAction type="COMMENT" author={ticket.author} content={ticket.content} date={ticket.date} file={ticket.file}/>
</div>
<div className="ticket-viewer__comments">
{ticket.actions && ticket.actions.map(this.renderAction.bind(this))}
</div>
<div className="ticket-viewer__response">
<div className="ticket-viewer__response-title row">{i18n('RESPOND')}</div>
<div className="ticket-viewer__response-field row">
<Form onSubmit={this.onSubmit.bind(this)} loading={this.state.loading}>
<FormField name="content" validation="TEXT_AREA" required field="textarea" />
<SubmitButton>{i18n('RESPOND_TICKET')}</SubmitButton>
</Form>
</div>
</div>
</div>
);

12
client/src/app-components/ticket-viewer.scss

@ -30,16 +30,8 @@
color: $secondary-blue;
}
&__date {
}
&__author {
}
&__department {
&__editable-dropdown {
margin: auto;
}
&__content {

6
client/src/data/languages/en.js

@ -60,6 +60,12 @@ export default {
'DISCARD_CHANGES': 'Discard changes',
'DELETE': 'Delete',
'LANGUAGE': 'Language',
'OWNER': 'Owner',
'OWNED': 'Owned',
'STATUS': 'Status',
'NONE': 'None',
'OPEN': 'Open',
'CLOSED': 'Closed',
//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.',