Add close ticket button at the end of ticket viewer (#932)
* Add close ticket button at the end of ticket viewer * WIP * standardization
This commit is contained in:
parent
7fb7be3860
commit
560f231e51
|
@ -118,7 +118,7 @@ class TicketViewer extends React.Component {
|
|||
<div className="ticket-viewer__comments">
|
||||
{ticket.events && ticket.events.map(this.renderTicketEvent.bind(this))}
|
||||
</div>
|
||||
{(!ticket.closed && (editable || !assignmentAllowed)) ? this.renderResponseField() : (this.showDeleteButton())? <Button size="medium" onClick={this.onDeleteTicketClick.bind(this)}>{i18n('DELETE_TICKET')}</Button> : null}
|
||||
{(!ticket.closed && (editable || !assignmentAllowed)) ? this.renderResponseField() : (this.showDeleteButton()) ? this.renderDeleteTicketButton() : null}
|
||||
</div>
|
||||
);
|
||||
}
|
||||
|
@ -265,9 +265,7 @@ class TicketViewer extends React.Component {
|
|||
<Button type='secondary' size="medium" onClick={this.onReopenClick.bind(this)}>
|
||||
{i18n('RE_OPEN')}
|
||||
</Button> :
|
||||
<Button type='secondary' size="medium" onClick={this.onCloseTicketClick.bind(this)}>
|
||||
{i18n('CLOSE')}
|
||||
</Button>}
|
||||
this.renderCloseTicketButton()}
|
||||
</div>
|
||||
);
|
||||
}
|
||||
|
@ -454,11 +452,14 @@ class TicketViewer extends React.Component {
|
|||
</div>
|
||||
<div className="ticket-viewer__response-field row">
|
||||
<FormField name="content" validation="TEXT_AREA" required field="textarea" fieldProps={{allowImages: allowAttachments}} />
|
||||
{allowAttachments ? <FormField name="file" field="file" /> : null}
|
||||
<div className="ticket-viewer__response-buttons">
|
||||
{allowAttachments ? <FormField name="file" field="file" /> : null}
|
||||
<SubmitButton type="secondary">{i18n('RESPOND_TICKET')}</SubmitButton>
|
||||
<div>
|
||||
{(this.showDeleteButton())? <Button className="ticket-viewer__delete-button" size="medium" onClick={this.onDeleteTicketClick.bind(this)}>{i18n('DELETE_TICKET')}</Button> : null}
|
||||
</div>
|
||||
<div className="ticket-viewer__buttons-column">
|
||||
<div className="ticket-viewer__buttons-row">
|
||||
{(this.showDeleteButton()) ? this.renderDeleteTicketButton() : null}
|
||||
{this.renderCloseTicketButton()}
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
|
@ -468,6 +469,18 @@ class TicketViewer extends React.Component {
|
|||
);
|
||||
}
|
||||
|
||||
renderDeleteTicketButton() {
|
||||
return (
|
||||
<Button className="ticket-viewer__delete-button" size="medium" onClick={this.onDeleteTicketClick.bind(this)}>{i18n('DELETE_TICKET')}</Button>
|
||||
);
|
||||
}
|
||||
|
||||
renderCloseTicketButton() {
|
||||
return (
|
||||
<Button size="medium" onClick={this.onCloseTicketClick.bind(this)}>{i18n('CLOSE_TICKET')}</Button>
|
||||
);
|
||||
}
|
||||
|
||||
renderCustomResponses() {
|
||||
let customResponsesNode = null;
|
||||
|
||||
|
|
|
@ -1,7 +1,6 @@
|
|||
@import "../scss/vars";
|
||||
|
||||
.ticket-viewer {
|
||||
|
||||
&__header {
|
||||
background-color: $primary-blue;
|
||||
border-top-right-radius: 4px;
|
||||
|
@ -20,6 +19,22 @@
|
|||
}
|
||||
}
|
||||
|
||||
&__buttons-column {
|
||||
padding-top: 10px;
|
||||
display: flex;
|
||||
flex-direction: column;
|
||||
justify-content: flex-start;
|
||||
align-items: flex-start;
|
||||
}
|
||||
|
||||
&__buttons-row {
|
||||
display: flex;
|
||||
flex-direction: row;
|
||||
justify-content: space-between;
|
||||
align-items: flex-start;
|
||||
width: 250px;
|
||||
}
|
||||
|
||||
&__edited-title-text {
|
||||
font-style: italic;
|
||||
font-size: 14px;
|
||||
|
@ -193,13 +208,14 @@
|
|||
|
||||
&-buttons {
|
||||
display: flex;
|
||||
flex-direction: row;
|
||||
justify-content: space-between;
|
||||
align-items: center;
|
||||
}
|
||||
|
||||
}
|
||||
|
||||
&__delete-button {
|
||||
margin-left: 10px;
|
||||
}
|
||||
|
||||
@media screen and (max-width: 1151px) {
|
||||
|
|
Loading…
Reference in New Issue