tyler.durden/opensupports
1
0
Fork 0
mirror of https://github.com/opensupports/opensupports.git synced 2025-07-27 15:54:23 +02:00
Code Issues Packages Projects Releases Wiki Activity

Fix custom responses #388

Browse Source
This commit is contained in:
Ivan Diaz 2018-11-15 12:53:23 -03:00
parent 9d67a19c35
commit a2e505c33d
1 changed files with 60 additions and 36 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

74
client/src/app/admin/panel/tickets/admin-panel-custom-responses.js
View File

@ -21,18 +21,24 @@ import TextEditor from 'core-components/text-editor';
class AdminPanelCustomResponses extends React.Component {
static defaultProps = {
items: []
items: [],
};
state = {
formClicked: false,
showForm: false,
formLoading: false,
selectedIndex: -1,
edited: false,
errors: {},
originalForm: {
title: '',
content: TextEditor.createEmpty(),
language: this.props.language
},
form: {
title: '',
content: TextEditor.createEmpty(),
language: 'en'
language: this.props.language
}
};
@ -57,6 +63,21 @@ class AdminPanelCustomResponses extends React.Component {
<div className="col-md-3">
<Listing {...this.getListingProps()}/>
</div>
{this.state.showForm ? this.renderForm() : null}
</div>
);
}
renderLoading() {
return (
<div className="admin-panel-custom-responses__loading">
<Loading backgrounded size="large"/>
</div>
);
}
renderForm() {
return (
<div className="col-md-9">
<Form {...this.getFormProps()}>
<div className="row">
@ -76,15 +97,6 @@ class AdminPanelCustomResponses extends React.Component {
</div>
</Form>
</div>
</div>
);
}
renderLoading() {
return (
<div className="admin-panel-custom-responses__loading">
<Loading backgrounded size="large"/>
</div>
);
}
@ -92,7 +104,7 @@ class AdminPanelCustomResponses extends React.Component {
return (
<div className="admin-panel-custom-responses__optional-buttons">
<div className="admin-panel-custom-responses__discard-button">
<Button onClick={this.onDiscardChangesClick.bind(this)}>{i18n('DISCARD_CHANGES')}</Button>
{this.isEdited() ? <Button onClick={this.onDiscardChangesClick.bind(this)}>{i18n('DISCARD_CHANGES')}</Button> : null}
</div>
<div className="admin-panel-custom-responses__delete-button">
<Button onClick={this.onDeleteClick.bind(this)}>{i18n('DELETE')}</Button>
@ -117,7 +129,8 @@ class AdminPanelCustomResponses extends React.Component {
values: this.state.form,
errors: this.state.errors,
loading: this.state.formLoading,
onChange: (form) => {this.setState({form, edited: true})},
onClick: () => this.setState({formClicked: true}),
onChange: (form) => this.setState({form}),
onValidateErrors: (errors) => {this.setState({errors})},
onSubmit: this.onFormSubmit.bind(this)
}
@ -139,7 +152,7 @@ class AdminPanelCustomResponses extends React.Component {
}
onItemChange(index) {
if(this.state.edited) {
if(this.isEdited()) {
AreYouSure.openModal(i18n('WILL_LOSE_CHANGES'), this.updateForm.bind(this, index));
} else {
this.updateForm(index);
@ -147,28 +160,30 @@ class AdminPanelCustomResponses extends React.Component {
}
onFormSubmit(form) {
const {items, allowedLanguages} = this.props;
this.setState({formLoading: true});
if(this.state.selectedIndex !== -1) {
API.call({
path: '/ticket/edit-custom-response',
data: {
id: this.props.items[this.state.selectedIndex].id,
name: form.name,
id: items[this.state.selectedIndex].id,
name: form.title,
content: form.content,
language: form.language
language: _.includes(allowedLanguages, form.language) ? form.language : allowedLanguages[0]
}
}).then(() => {
this.setState({formLoading: false});
this.setState({formLoading: false, originalForm: form});
this.retrieveCustomResponses();
}).catch(this.onItemChange.bind(this, -1));
} else {
this.setState({form, originalForm: form});
API.call({
path: '/ticket/add-custom-response',
data: {
name: form.title,
content: form.content,
language: form.language
language: _.includes(allowedLanguages, form.language) ? form.language : allowedLanguages[0]
}
}).then(() => {
this.retrieveCustomResponses();
@ -204,12 +219,14 @@ class AdminPanelCustomResponses extends React.Component {
form.title = (this.props.items[index] && this.props.items[index].name) || '';
form.content = TextEditor.getEditorStateFromHTML((this.props.items[index] && this.props.items[index].content) || '');
form.language = (this.props.items[index] && this.props.items[index].language) || 'en';
form.language = (this.props.items[index] && this.props.items[index].language) || this.props.language;
this.setState({
formClicked: false,
showForm: true,
selectedIndex: index,
edited: false,
formLoading: false,
originalForm: form,
form: form,
errors: {}
});
@ -217,14 +234,21 @@ class AdminPanelCustomResponses extends React.Component {
retrieveCustomResponses() {
this.props.dispatch(AdminDataActions.retrieveCustomResponses());
this.setState({
edited: false
});
}
isEdited() {
return this.state.form.title && this.state.formClicked && (
this.state.form.title != this.state.originalForm.title ||
this.state.form.content != this.state.originalForm.content ||
this.state.form.language != this.state.originalForm.language
);
}
}
export default connect((store) => {
return {
allowedLanguages: store.config.allowedLanguages,
language: store.config.language,
loaded: store.adminData.customResponsesLoaded,
items: store.adminData.customResponses
};