Ivan - Change name TicketAction => TicketEvent [skip ci]
This commit is contained in:
parent
3b8bcc8438
commit
a876e83108
|
@ -4,7 +4,7 @@ import classNames from 'classnames';
|
|||
import i18n from 'lib-app/i18n';
|
||||
import Icon from 'core-components/icon';
|
||||
|
||||
class TicketAction extends React.Component {
|
||||
class TicketEvent extends React.Component {
|
||||
static propTypes = {
|
||||
type: React.PropTypes.oneOf([
|
||||
'COMMENT',
|
||||
|
@ -31,12 +31,12 @@ class TicketAction extends React.Component {
|
|||
|
||||
return (
|
||||
<div className={this.getClass()}>
|
||||
<span className="ticket-action__connector" />
|
||||
<span className="ticket-event__connector" />
|
||||
<div className="col-md-1">
|
||||
{iconNode}
|
||||
</div>
|
||||
<div className="col-md-11">
|
||||
{this.renderActionDescription()}
|
||||
{this.renderEventDescription()}
|
||||
</div>
|
||||
</div>
|
||||
);
|
||||
|
@ -44,21 +44,21 @@ class TicketAction extends React.Component {
|
|||
|
||||
renderStaffPic() {
|
||||
return (
|
||||
<div className="ticket-action__staff-pic">
|
||||
<img src={this.props.author.profilePic} className="ticket-action__staff-pic-img" />
|
||||
<div className="ticket-event__staff-pic">
|
||||
<img src={this.props.author.profilePic} className="ticket-event__staff-pic-img" />
|
||||
</div>
|
||||
);
|
||||
}
|
||||
|
||||
renderIcon() {
|
||||
return (
|
||||
<div className="ticket-action__icon">
|
||||
<div className="ticket-event__icon">
|
||||
<Icon {...this.getIconProps()}/>
|
||||
</div>
|
||||
);
|
||||
}
|
||||
|
||||
renderActionDescription() {
|
||||
renderEventDescription() {
|
||||
const renders = {
|
||||
'COMMENT': this.renderComment.bind(this),
|
||||
'ASSIGN': this.renderAssignment.bind(this),
|
||||
|
@ -74,14 +74,14 @@ class TicketAction extends React.Component {
|
|||
|
||||
renderComment() {
|
||||
return (
|
||||
<div className="ticket-action__comment">
|
||||
<span className="ticket-action__comment-pointer" />
|
||||
<div className="ticket-action__comment-author">
|
||||
<span className="ticket-action__comment-author-name">{this.props.author.name}</span>
|
||||
<span className="ticket-action__comment-author-type">({i18n((this.props.author.staff) ? 'STAFF' : 'CUSTOMER')})</span>
|
||||
<div className="ticket-event__comment">
|
||||
<span className="ticket-event__comment-pointer" />
|
||||
<div className="ticket-event__comment-author">
|
||||
<span className="ticket-event__comment-author-name">{this.props.author.name}</span>
|
||||
<span className="ticket-event__comment-author-type">({i18n((this.props.author.staff) ? 'STAFF' : 'CUSTOMER')})</span>
|
||||
</div>
|
||||
<div className="ticket-action__comment-date">{this.props.date}</div>
|
||||
<div className="ticket-action__comment-content" dangerouslySetInnerHTML={{__html: this.props.content}}></div>
|
||||
<div className="ticket-event__comment-date">{this.props.date}</div>
|
||||
<div className="ticket-event__comment-content" dangerouslySetInnerHTML={{__html: this.props.content}}></div>
|
||||
{this.renderFileRow(this.props.file)}
|
||||
</div>
|
||||
);
|
||||
|
@ -89,62 +89,62 @@ class TicketAction extends React.Component {
|
|||
|
||||
renderAssignment() {
|
||||
return (
|
||||
<div className="ticket-action__circled">
|
||||
<span className="ticket-action__circled-author">{this.props.author.name}</span>
|
||||
<span className="ticket-action__circled-text"> assigned this ticket</span>
|
||||
<span className="ticket-action__circled-date"> on {this.props.date}</span>
|
||||
<div className="ticket-event__circled">
|
||||
<span className="ticket-event__circled-author">{this.props.author.name}</span>
|
||||
<span className="ticket-event__circled-text"> assigned this ticket</span>
|
||||
<span className="ticket-event__circled-date"> on {this.props.date}</span>
|
||||
</div>
|
||||
)
|
||||
}
|
||||
|
||||
renderUnAssignment() {
|
||||
return (
|
||||
<div className="ticket-action__circled">
|
||||
<span className="ticket-action__circled-author">{this.props.author.name}</span>
|
||||
<span className="ticket-action__circled-text"> unassigned this ticket</span>
|
||||
<span className="ticket-action__circled-date"> on {this.props.date}</span>
|
||||
<div className="ticket-event__circled">
|
||||
<span className="ticket-event__circled-author">{this.props.author.name}</span>
|
||||
<span className="ticket-event__circled-text"> unassigned this ticket</span>
|
||||
<span className="ticket-event__circled-date"> on {this.props.date}</span>
|
||||
</div>
|
||||
)
|
||||
}
|
||||
|
||||
renderClosed() {
|
||||
return (
|
||||
<div className="ticket-action__circled">
|
||||
<span className="ticket-action__circled-author">{this.props.author.name}</span>
|
||||
<span className="ticket-action__circled-text"> closed this ticket</span>
|
||||
<span className="ticket-action__circled-date"> on {this.props.date}</span>
|
||||
<div className="ticket-event__circled">
|
||||
<span className="ticket-event__circled-author">{this.props.author.name}</span>
|
||||
<span className="ticket-event__circled-text"> closed this ticket</span>
|
||||
<span className="ticket-event__circled-date"> on {this.props.date}</span>
|
||||
</div>
|
||||
)
|
||||
}
|
||||
|
||||
renderReOpened() {
|
||||
return (
|
||||
<div className="ticket-action__circled">
|
||||
<span className="ticket-action__circled-author">{this.props.author.name}</span>
|
||||
<span className="ticket-action__circled-text"> reopen this ticket</span>
|
||||
<span className="ticket-action__circled-date"> on {this.props.date}</span>
|
||||
<div className="ticket-event__circled">
|
||||
<span className="ticket-event__circled-author">{this.props.author.name}</span>
|
||||
<span className="ticket-event__circled-text"> reopen this ticket</span>
|
||||
<span className="ticket-event__circled-date"> on {this.props.date}</span>
|
||||
</div>
|
||||
);
|
||||
}
|
||||
|
||||
renderDepartmentChange() {
|
||||
return (
|
||||
<div className="ticket-action__circled">
|
||||
<span className="ticket-action__circled-author">{this.props.author.name}</span>
|
||||
<span className="ticket-action__circled-text"> change department to</span>
|
||||
<span className="ticket-action__circled-indication"> {this.props.content}</span>
|
||||
<span className="ticket-action__circled-date"> on {this.props.date}</span>
|
||||
<div className="ticket-event__circled">
|
||||
<span className="ticket-event__circled-author">{this.props.author.name}</span>
|
||||
<span className="ticket-event__circled-text"> change department to</span>
|
||||
<span className="ticket-event__circled-indication"> {this.props.content}</span>
|
||||
<span className="ticket-event__circled-date"> on {this.props.date}</span>
|
||||
</div>
|
||||
);
|
||||
}
|
||||
|
||||
renderPriorityChange() {
|
||||
return (
|
||||
<div className="ticket-action__circled">
|
||||
<span className="ticket-action__circled-author">{this.props.author.name}</span>
|
||||
<span className="ticket-action__circled-text"> change priority to</span>
|
||||
<span className="ticket-action__circled-indication"> {this.props.content}</span>
|
||||
<span className="ticket-action__circled-date"> on {this.props.date}</span>
|
||||
<div className="ticket-event__circled">
|
||||
<span className="ticket-event__circled-author">{this.props.author.name}</span>
|
||||
<span className="ticket-event__circled-text"> change priority to</span>
|
||||
<span className="ticket-event__circled-indication"> {this.props.content}</span>
|
||||
<span className="ticket-event__circled-date"> on {this.props.date}</span>
|
||||
</div>
|
||||
);
|
||||
}
|
||||
|
@ -177,14 +177,14 @@ class TicketAction extends React.Component {
|
|||
};
|
||||
const classes = {
|
||||
'row': true,
|
||||
'ticket-action': true,
|
||||
'ticket-action_staff': this.props.author && this.props.author.staff,
|
||||
'ticket-action_circled': circledTypes[this.props.type],
|
||||
'ticket-action_unassignment': this.props.type === 'UN_ASSIGN',
|
||||
'ticket-action_close': this.props.type === 'CLOSE',
|
||||
'ticket-action_reopen': this.props.type === 'RE_OPEN',
|
||||
'ticket-action_department': this.props.type === 'DEPARTMENT_CHANGED',
|
||||
'ticket-action_priority': this.props.type === 'PRIORITY_CHANGED'
|
||||
'ticket-event': true,
|
||||
'ticket-event_staff': this.props.author && this.props.author.staff,
|
||||
'ticket-event_circled': circledTypes[this.props.type],
|
||||
'ticket-event_unassignment': this.props.type === 'UN_ASSIGN',
|
||||
'ticket-event_close': this.props.type === 'CLOSE',
|
||||
'ticket-event_reopen': this.props.type === 'RE_OPEN',
|
||||
'ticket-event_department': this.props.type === 'DEPARTMENT_CHANGED',
|
||||
'ticket-event_priority': this.props.type === 'PRIORITY_CHANGED'
|
||||
};
|
||||
|
||||
return classNames(classes);
|
||||
|
@ -225,4 +225,4 @@ class TicketAction extends React.Component {
|
|||
}
|
||||
}
|
||||
|
||||
export default TicketAction;
|
||||
export default TicketEvent;
|
|
@ -1,6 +1,6 @@
|
|||
@import "../scss/vars";
|
||||
|
||||
.ticket-action {
|
||||
.ticket-event {
|
||||
margin-top: 20px;
|
||||
text-align: left;
|
||||
position: relative;
|
||||
|
@ -91,11 +91,11 @@
|
|||
}
|
||||
|
||||
&_staff {
|
||||
.ticket-action__icon {
|
||||
.ticket-event__icon {
|
||||
background-color: $primary-blue;
|
||||
}
|
||||
|
||||
.ticket-action__comment-author-type {
|
||||
.ticket-event__comment-author-type {
|
||||
color: $primary-blue;
|
||||
}
|
||||
}
|
||||
|
@ -104,11 +104,11 @@
|
|||
margin-top: 35px;
|
||||
margin-bottom: 30px;
|
||||
|
||||
.ticket-action__connector {
|
||||
.ticket-event__connector {
|
||||
top: 28px;
|
||||
}
|
||||
|
||||
.ticket-action__icon {
|
||||
.ticket-event__icon {
|
||||
background-color: white;
|
||||
color: $primary-black;
|
||||
border: 3px solid $light-grey;
|
||||
|
@ -121,48 +121,48 @@
|
|||
margin-top: -8px;
|
||||
}
|
||||
|
||||
.ticket-action__circled {
|
||||
.ticket-event__circled {
|
||||
color: $primary-black;
|
||||
font-size: $font-size--sm;
|
||||
margin-top: 1px;
|
||||
}
|
||||
|
||||
.ticket-action__circled-author {
|
||||
.ticket-event__circled-author {
|
||||
color: $secondary-blue;
|
||||
}
|
||||
|
||||
.ticket-action__circled-indication {
|
||||
.ticket-event__circled-indication {
|
||||
color: $primary-green;
|
||||
}
|
||||
}
|
||||
|
||||
&_unassignment {
|
||||
.ticket-action__icon {
|
||||
.ticket-event__icon {
|
||||
padding-left: 6px;
|
||||
}
|
||||
}
|
||||
|
||||
&_close {
|
||||
.ticket-action__icon {
|
||||
.ticket-event__icon {
|
||||
padding-left: 9px;
|
||||
}
|
||||
}
|
||||
|
||||
&_reopen {
|
||||
.ticket-action__icon {
|
||||
.ticket-event__icon {
|
||||
padding-left: 9px;
|
||||
padding-top: 5px;
|
||||
}
|
||||
}
|
||||
|
||||
&_department {
|
||||
.ticket-action__icon {
|
||||
.ticket-event__icon {
|
||||
padding-left: 6px;
|
||||
}
|
||||
}
|
||||
|
||||
&_priority {
|
||||
.ticket-action__icon {
|
||||
.ticket-event__icon {
|
||||
padding-left: 11px;
|
||||
padding-top: 5px;
|
||||
}
|
|
@ -7,7 +7,7 @@ import store from 'app/store';
|
|||
import SessionStore from 'lib-app/session-store';
|
||||
import SessionActions from 'actions/session-actions';
|
||||
|
||||
import TicketAction from 'app-components/ticket-action';
|
||||
import TicketEvent from 'app-components/ticket-event';
|
||||
import AreYouSure from 'app-components/are-you-sure';
|
||||
import Form from 'core-components/form';
|
||||
import FormField from 'core-components/form-field';
|
||||
|
@ -49,10 +49,10 @@ class TicketViewer extends React.Component {
|
|||
</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}/>
|
||||
<TicketEvent 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))}
|
||||
{ticket.events && ticket.events.map(this.renderTicketEvent.bind(this))}
|
||||
</div>
|
||||
<div className="ticket-viewer__response">
|
||||
<div className="ticket-viewer__response-title row">{i18n('RESPOND')}</div>
|
||||
|
@ -162,9 +162,9 @@ class TicketViewer extends React.Component {
|
|||
);
|
||||
}
|
||||
|
||||
renderAction(action, index) {
|
||||
renderTicketEvent(options, index) {
|
||||
return (
|
||||
<TicketAction {...action} key={index} />
|
||||
<TicketEvent {...options} key={index} />
|
||||
);
|
||||
}
|
||||
|
||||
|
|
|
@ -159,7 +159,7 @@ module.exports = [
|
|||
name: 'Steve Jobs',
|
||||
email: 'steve@jobs.com'
|
||||
},
|
||||
actions: [
|
||||
events: [
|
||||
{
|
||||
type: 'ASSIGN',
|
||||
date: 20150409,
|
||||
|
@ -275,7 +275,7 @@ module.exports = [
|
|||
owner: {
|
||||
name: 'Steve Jobs'
|
||||
},
|
||||
actions: [
|
||||
events: [
|
||||
{
|
||||
type: 'ASSIGN',
|
||||
date: 20150409,
|
||||
|
@ -391,7 +391,7 @@ module.exports = [
|
|||
owner: {
|
||||
name: 'Steve Jobs'
|
||||
},
|
||||
actions: [
|
||||
events: [
|
||||
{
|
||||
type: 'ASSIGN',
|
||||
date: 20150409,
|
||||
|
|
Loading…
Reference in New Issue