Max Red - Modified fixtures, added recoverSettings and modified visual layout [skip ci]
This commit is contained in:
ivan
parent
37ae4b1bfe
commit
f6a0ab29a0
|
|
@ -1,4 +1,6 @@
|
|||
import React from 'react';
|
||||
import _ from 'lodash';
|
||||
import languageList from 'data/language-list';
|
||||
|
||||
import Form from 'core-components/form';
|
||||
import FormField from 'core-components/form-field';
|
||||
|
|
@ -6,6 +8,7 @@ import Header from 'core-components/header';
|
|||
import SubmitButton from 'core-components/submit-button';
|
||||
import Button from 'core-components/button';
|
||||
|
||||
import API from 'lib-app/api-call';
|
||||
import ToggleButton from 'app-components/toggle-button';
|
||||
import i18n from 'lib-app/i18n';
|
||||
|
||||
|
|
@ -17,73 +20,92 @@ class AdminPanelSystemPreferences extends React.Component {
|
|||
}
|
||||
};
|
||||
|
||||
componentDidMount() {
|
||||
this.recoverSettings();
|
||||
}
|
||||
|
||||
render() {
|
||||
return (
|
||||
<div className="admin-panel-system-preferences">
|
||||
<Header title={i18n('SYSTEM_PREFERENCES')} description="Here you can adjust your system preferences :)"/>
|
||||
<Form values={this.state.values} onChange={values => this.setState({values})} onSubmit={this.onSubmit.bind(this)}>
|
||||
<div className="admin-panel-system-preferences__maintenance">
|
||||
<span>Maintenance Mode</span>
|
||||
<FormField className="admin-panel-system-preferences__maintenance-field" name="maintenance-mode" decorator={ToggleButton}/>
|
||||
<div className="row">
|
||||
<div className="col-md-12">
|
||||
<div className="admin-panel-system-preferences__maintenance">
|
||||
<span>Maintenance Mode</span>
|
||||
<FormField className="admin-panel-system-preferences__maintenance-field" name="maintenance-mode" decorator={ToggleButton}/>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
<div className="row">
|
||||
<div className="col-md-12">
|
||||
<span className="separator" />
|
||||
</div>
|
||||
</div>
|
||||
<span className="separator" />
|
||||
<div className="row">
|
||||
<div className="col-md-6">
|
||||
<FormField label={i18n('SUPPORT_CENTER_URL')} fieldProps={{size: 'large'}} name="url"/>
|
||||
<FormField label={i18n('SUPPORT_CENTER_LAYOUT')} fieldProps={{size: 'large', items: [{content: i18n('BOXED')}, {content: i18n('FULL_WIDTH')}]}} field="select" name="layout"/>
|
||||
</div>
|
||||
<div className="col-md-6">
|
||||
<FormField label={i18n('SUPPORT_CENTER_TITLE')} fieldProps={{size: 'large'}} name="system-title"/>
|
||||
<FormField label={i18n('SUPPORT_CENTER_TITLE')} fieldProps={{size: 'large'}} name="title"/>
|
||||
<FormField label={i18n('DEFAULT_TIMEZONE')} fieldProps={{size: 'large'}} name="time-zone"/>
|
||||
</div>
|
||||
</div>
|
||||
<span className="separator" />
|
||||
<div className="row">
|
||||
<div className="col-md-4">
|
||||
asd
|
||||
</div>
|
||||
<div className="col-md-8">
|
||||
<div className="col-md-12">
|
||||
<span className="separator" />
|
||||
<div className="row">
|
||||
<div className="col-md-6">
|
||||
<FormField label={i18n('NOREPLY_EMAIL')} fieldProps={{size: 'auto'}} name="email"/>
|
||||
<FormField label={i18n('SMTP_USER')} fieldProps={{size: 'auto'}} name="smtp_user"/>
|
||||
<FormField label={i18n('NOREPLY_EMAIL')} fieldProps={{size: 'large'}} name="no-reply-email"/>
|
||||
<FormField label={i18n('SMTP_USER')} fieldProps={{size: 'large'}} name="smtp-user"/>
|
||||
</div>
|
||||
<div className="col-md-6">
|
||||
<div className="row">
|
||||
<div className="col-md-9">
|
||||
<FormField label={i18n('SMTP_SERVER')} fieldProps={{size: 'auto'}} name="smtp_server"/>
|
||||
<FormField label={i18n('SMTP_SERVER')} fieldProps={{size: 'large'}} name="smtp-host"/>
|
||||
<FormField label={i18n('SMTP_PASSWORD')} fieldProps={{size: 'large', password: true}} name="smtp-pass"/>
|
||||
</div>
|
||||
<div className="col-md-3">
|
||||
<FormField label={i18n('PORT')} fieldProps={{size: 'auto'}} name="port"/>
|
||||
<FormField label={i18n('PORT')} fieldProps={{size: 'auto'}} name="smtp-port"/>
|
||||
</div>
|
||||
</div>
|
||||
<FormField label={i18n('SMTP_PASSWORD')} fieldProps={{size: 'auto'}} name="smtp_password"/>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
<div className="row">
|
||||
<div className="col-md-12">
|
||||
<span className="separator" />
|
||||
<div className="row">
|
||||
<div className="col-md-6">
|
||||
<FormField label={i18n('RECAPTCHA_PUBLIC_KEY')} fieldProps={{size: 'auto'}} name="public_key"/>
|
||||
</div>
|
||||
<div className="col-md-6">
|
||||
<div className="row admin-panel-system-preferences__languages">
|
||||
<div className="col-md-6 admin-panel-system-preferences__languages-allowed">
|
||||
<div>{i18n('ALLOWED_LANGUAGES')}</div>
|
||||
<FormField name="allowedLanguages" field="checkbox-group" fieldProps={{items: this.getLanguageList()}} />
|
||||
</div>
|
||||
<div className="col-md-6">
|
||||
<FormField label={i18n('RECAPTCHA_PRIVATE_KEY')} fieldProps={{size: 'auto'}} name="private_key"/>
|
||||
<div className="col-md-6 admin-panel-system-preferences__languages-supported">
|
||||
<div>{i18n('SUPPORTED_LANGUAGES')}</div>
|
||||
<FormField name="supportedLanguages" field="checkbox-group" fieldProps={{items: this.getLanguageList()}} />
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
<div className="col-md-6">
|
||||
<FormField label={i18n('RECAPTCHA_PUBLIC_KEY')} fieldProps={{size: 'large'}} name="reCaptchaKey"/>
|
||||
<FormField label={i18n('RECAPTCHA_PRIVATE_KEY')} fieldProps={{size: 'large'}} name="reCaptchaPrivate"/>
|
||||
<div className="admin-panel-system-preferences__file-attachments">
|
||||
<span>{i18n('ALLOW_FILE_ATTACHMENTS')}</span>
|
||||
<FormField className="admin-panel-system-preferences__file-attachments-field" name="file-attachments" decorator={ToggleButton}/>
|
||||
</div>
|
||||
<div className="admin-panel-system-preferences__max-size">
|
||||
<span>{i18n('MAX_SIZE_KB')}</span>
|
||||
<FormField className="admin-panel-system-preferences__max-size-field" fieldProps={{size: 'small'}} name="max-size"/>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
<div className="row">
|
||||
<div className="col-md-12">
|
||||
<span className="separator" />
|
||||
<div className="row">
|
||||
<div className="col-md-5 col-md-offset-1">
|
||||
<div className="admin-panel-system-preferences__file-attachments">
|
||||
<span>{i18n('ALLOW_FILE_ATTACHMENTS')}</span>
|
||||
<FormField className="admin-panel-system-preferences__file-attachments-field" name="file-attachments" decorator={ToggleButton}/>
|
||||
</div>
|
||||
</div>
|
||||
<div className="col-md-6">
|
||||
<div className="admin-panel-system-preferences__max-size">
|
||||
<span>{i18n('MAX_SIZE_KB')}</span>
|
||||
<FormField className="admin-panel-system-preferences__max-size-field" fieldProps={{size: 'small'}} name="max-size"/>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
<div className="row">
|
||||
|
|
@ -102,6 +124,49 @@ asd
|
|||
onSubmit() {
|
||||
alert('WESA');
|
||||
}
|
||||
|
||||
getLanguageList() {
|
||||
return Object.keys(languageList).map(key => languageList[key].name);
|
||||
}
|
||||
|
||||
recoverSettings() {
|
||||
API.call({
|
||||
path: '/system/get-settings',
|
||||
data: {
|
||||
allSettings: true
|
||||
}
|
||||
}).then(this.onRecoverSettingsSuccess.bind(this)).catch(this.onRecoverSettingsFail.bind(this));
|
||||
}
|
||||
|
||||
onRecoverSettingsSuccess(result) {
|
||||
let fullList = Object.keys(languageList);
|
||||
this.setState({
|
||||
values: {
|
||||
'language': result.data.language,
|
||||
'reCaptchaKey': result.data.reCaptchaKey,
|
||||
'reCaptchaPrivate': result.data.reCaptchaPrivate,
|
||||
'url': result.data['url'],
|
||||
'title': result.data['title'],
|
||||
'layout': result.data['layout'] == 'Full width' ? 1 : 0,
|
||||
'time-zone': result.data['time-zone'],
|
||||
'no-reply-email': result.data['no-reply-email'],
|
||||
'smtp-host': result.data['smtp-host'],
|
||||
'smtp-port': result.data['smtp-port'],
|
||||
'smtp-user': result.data['smtp-user'],
|
||||
'smtp-pass': '',
|
||||
'maintenance-mode': result.data['maintenance-mode'],
|
||||
'file-attachments': result.data['file-attachments'],
|
||||
'max-size': result.data['max-size'],
|
||||
'departments': result.data.departments,
|
||||
'allowedLanguages': result.data.allowedLanguages.map(lang => (_.indexOf(fullList, lang))),
|
||||
'supportedLanguages': result.data.supportedLanguages.map(lang => (_.indexOf(fullList, lang)))
|
||||
}
|
||||
});
|
||||
}
|
||||
|
||||
onRecoverSettingsFail(result) {
|
||||
|
||||
}
|
||||
}
|
||||
|
||||
export default AdminPanelSystemPreferences;
|
||||
|
|
@ -29,4 +29,20 @@
|
|||
display: inline-block;
|
||||
margin-left: 30px;
|
||||
}
|
||||
|
||||
&__languages {
|
||||
margin: 0 auto;
|
||||
|
||||
&-allowed {
|
||||
text-align: left;
|
||||
display: inline-block;
|
||||
//background-color: red;
|
||||
}
|
||||
|
||||
&-supported {
|
||||
text-align: left;
|
||||
display: inline-block;
|
||||
//background-color: $light-grey;
|
||||
}
|
||||
}
|
||||
}
|
||||
|
|
@ -2,22 +2,52 @@ module.exports = [
|
|||
{
|
||||
path: '/system/get-settings',
|
||||
time: 1000,
|
||||
response: function () {
|
||||
return {
|
||||
status: 'success',
|
||||
data: {
|
||||
'language': 'en',
|
||||
'reCaptchaKey': '6LfM5CYTAAAAAGLz6ctpf-hchX2_l0Ge-Bn-n8wS',
|
||||
'maintenance-mode': false,
|
||||
'departments': [
|
||||
{id: 1, name: 'Sales Support', owners: 2},
|
||||
{id: 2, name: 'Technical Issues', owners: 5},
|
||||
{id: 3, name: 'System and Administration', owners: 0}
|
||||
],
|
||||
'allowedLanguages': ['en', 'es', 'de', 'fr', 'pt', 'jp', 'ru', 'cn', 'in', 'tr'],
|
||||
'supportedLanguages': ['en', 'es', 'de']
|
||||
}
|
||||
};
|
||||
response: function (params) {
|
||||
if(params && params.allSettings) {
|
||||
return {
|
||||
status: 'success',
|
||||
data: {
|
||||
'language': 'en',
|
||||
'reCaptchaKey': '6LfM5CYTAAAAAGLz6ctpf-hchX2_l0Ge-Bn-n8wS',
|
||||
'reCaptchaPrivate': 'LALA',
|
||||
'url': 'hola@lala.com',
|
||||
'title': 'Very Cool',
|
||||
'layout': 'Boxed',
|
||||
'time-zone': 3,
|
||||
'no-reply-email': 'shitr@post.com',
|
||||
'smtp-host': 'localhost',
|
||||
'smtp-port': '7070',
|
||||
'smtp-user': 'Wesa',
|
||||
'maintenance-mode': false,
|
||||
'fileAttachments': false,
|
||||
'max-size': 500,
|
||||
'departments': [
|
||||
{id: 1, name: 'Sales Support', owners: 2},
|
||||
{id: 2, name: 'Technical Issues', owners: 5},
|
||||
{id: 3, name: 'System and Administration', owners: 0}
|
||||
],
|
||||
'allowedLanguages': ['en', 'es', 'de', 'fr', 'pt', 'jp', 'ru', 'cn', 'in', 'tr'],
|
||||
'supportedLanguages': ['en', 'es', 'de']
|
||||
}
|
||||
};
|
||||
|
||||
} else {
|
||||
return {
|
||||
status: 'success',
|
||||
data: {
|
||||
'language': 'en',
|
||||
'reCaptchaKey': '6LfM5CYTAAAAAGLz6ctpf-hchX2_l0Ge-Bn-n8wS',
|
||||
'maintenance-mode': false,
|
||||
'departments': [
|
||||
{id: 1, name: 'Sales Support', owners: 2},
|
||||
{id: 2, name: 'Technical Issues', owners: 5},
|
||||
{id: 3, name: 'System and Administration', owners: 0}
|
||||
],
|
||||
'allowedLanguages': ['en', 'es', 'de', 'fr', 'pt', 'jp', 'ru', 'cn', 'in', 'tr'],
|
||||
'supportedLanguages': ['en', 'es', 'de']
|
||||
}
|
||||
};
|
||||
}
|
||||
}
|
||||
},
|
||||
{
|
||||
|
|
|
|||
|
|
@ -132,7 +132,8 @@ export default {
|
|||
'ALLOW_FILE_ATTACHMENTS': 'Allow file attachments',
|
||||
'MAX_SIZE_KB': 'Max Size (KB)',
|
||||
'UPDATE_SYSTEM': 'Update system',
|
||||
'DISCARD_CHANGES': 'Discard changes',
|
||||
'SUPPORTED_LANGUAGES': 'Supported Languages',
|
||||
'ALLOWED_LANGUAGES': 'Allowed Languages',
|
||||
'ON': 'On',
|
||||
'OFF': 'Off',
|
||||
'BOXED': 'Boxed',
|
||||
|
|
|
|||
Loading…
Reference in New Issue