tyler.durden
/
opensupports
mirror of https://github.com/opensupports/opensupports.git
1
0
Fork 0
Code Issues Packages Projects Releases Wiki Activity

Merged in os-157-disable-user-system-views (pull request #129) 

Os 157 disable user system views
This commit is contained in:
Ivan Diaz 2017-01-26 20:29:03 +00:00
parent d3ecbacf2d 09c6453d46
commit 5dbbcdc114
29 changed files with 505 additions and 70 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

2
client/src/app-components/topic-viewer.js
View File

@ -105,7 +105,7 @@ class TopicViewer extends React.Component {
<Link {...this.getArticleLinkProps(article, index)}>
{article.title}
</Link>
<Icon className="topic-viewer__grab-icon" name="arrows" ref={'grab-' + index}/>
{(this.props.editable) ? <Icon className="topic-viewer__grab-icon" name="arrows" ref={'grab-' + index}/> : null}
</li>
);
}

3
client/src/app-components/topic-viewer.scss
View File

@ -2,10 +2,11 @@
.topic-viewer {
text-align: left;
margin: 35px 0;
&__header {
cursor: default;
margin-bottom: 15px;
margin-bottom: 20px;
font-size: $font-size--bg;
&:hover {

9
client/src/app/Routes.js
View File

@ -13,6 +13,8 @@ import MainSignUpPage from 'app/main/main-signup/main-signup-page';
import MainVerifyTokenPage from 'app/main/main-verify-token-page';
import MainRecoverPasswordPage from 'app/main/main-recover-password/main-recover-password-page';
import MainMaintenancePage from 'app/main/main-maintenance-page';
import MainCheckTicketPage from 'app/main/main-check-ticket-page';
import MainViewTicketPage from 'app/main/main-view-ticket-page';
import DashboardLayout from 'app/main/dashboard/dashboard-layout';
import DashboardListTicketsPage from 'app/main/dashboard/dashboard-list-tickets/dashboard-list-tickets-page';
@ -63,6 +65,13 @@ export default (
<Route path='verify-token/:email/:token' component={MainVerifyTokenPage}/>
<Route path='recover-password' component={MainRecoverPasswordPage}/>
<Route path='maintenance' component={MainMaintenancePage}/>
<Route path='create-ticket' component={DashboardCreateTicketPage}/>
<Route path='check-ticket(/:ticketNumber/:email)' component={MainCheckTicketPage}/>
<Route path='view-ticket/:ticketNumber' component={MainViewTicketPage}/>
<Route path='articles' component={DashboardListArticlesPage}/>
<Route path='article/:articleId' component={DashboardArticlePage}/>
<Route path='dashboard' component={DashboardLayout}>
<IndexRoute component={DashboardListTicketsPage} />
<Route path='articles' component={DashboardListArticlesPage}/>

14
client/src/app/admin/panel/tickets/admin-panel-view-ticket.js
View File

@ -12,6 +12,16 @@ import Header from 'core-components/header';
class AdminPanelViewTicket extends React.Component {
static propTypes = {
avoidSeen: React.PropTypes.bool,
assignmentAllowed: React.PropTypes.bool
};
static defaultProps = {
avoidSeen: false,
assignmentAllowed: true
};
state = {
loading: true,
ticket: {}
@ -62,7 +72,7 @@ class AdminPanelViewTicket extends React.Component {
return {
ticket: this.state.ticket,
onChange: this.retrieveTicket.bind(this),
assignmentAllowed: true,
assignmentAllowed: this.props.assignmentAllowed,
customResponses: this.props.customResponses,
editable: this.state.ticket.owner && this.state.ticket.owner.id == SessionStore.getSessionData().userId
};
@ -83,7 +93,7 @@ class AdminPanelViewTicket extends React.Component {
ticket: result.data
});
if(result.data.unreadStaff) {
if(!this.props.avoidSeen && result.data.unreadStaff) {
API.call({
path: '/ticket/seen',
data: {

33
client/src/app/main/dashboard/dashboard-article/dashboard-article-page.js
View File

@ -1,5 +1,6 @@
import React from 'react';
import _ from 'lodash';
import classNames from 'classnames';
import {connect} from 'react-redux';
import ArticlesActions from 'actions/articles-actions';
@ -10,6 +11,7 @@ import DateTransformer from 'lib-core/date-transformer';
import Header from 'core-components/header';
import Loading from 'core-components/loading';
import BreadCrumb from 'core-components/breadcrumb';
import Widget from 'core-components/widget';
class DashboardArticlePage extends React.Component {
@ -32,12 +34,20 @@ class DashboardArticlePage extends React.Component {
}
render() {
let Wrapper = 'div';
if(_.startsWith(this.props.location.pathname, '/article/')) {
Wrapper = Widget;
}
return (
<div className="dashboard-article-page">
<div className="dashboard-article-page__breadcrumb">
<BreadCrumb items={this.getBreadCrumbItems()}/>
</div>
{(this.props.loading) ? <Loading /> : this.renderContent()}
<div className={this.getClass()}>
<Wrapper>
<div className="dashboard-article-page__breadcrumb">
<BreadCrumb items={this.getBreadCrumbItems()}/>
</div>
{(this.props.loading) ? <Loading /> : this.renderContent()}
</Wrapper>
</div>
);
}
@ -62,6 +72,15 @@ class DashboardArticlePage extends React.Component {
</div>
);
}
getClass() {
let classes = {
'dashboard-article-page': true,
'dashboard-article-page_wrapped': _.startsWith(this.props.location.pathname, '/article/')
};
return classNames(classes);
}
findArticle() {
let article = null;
@ -91,11 +110,11 @@ class DashboardArticlePage extends React.Component {
let article = this.findArticle();
let topic = this.findTopic();
let items = [
{content: i18n('ARTICLES'), url: '/dashboard/articles'}
{content: i18n('ARTICLES'), url: (_.startsWith(this.props.location.pathname, '/article/')) ? '/articles' : '/dashboard/articles'}
];
if(topic && topic.name) {
items.push({content: topic.name, url: '/dashboard/articles'});
items.push({content: topic.name, url: (_.startsWith(this.props.location.pathname, '/article/')) ? '/articles' : '/dashboard/articles'});
}
if(article && article.title) {

4
client/src/app/main/dashboard/dashboard-article/dashboard-article-page.scss
View File

@ -5,4 +5,8 @@
text-align: right;
margin-top: 20px;
}
&_wrapped {
padding: 0 15px;
}
}

43
client/src/app/main/dashboard/dashboard-create-ticket/create-ticket-form.js
View File

@ -2,7 +2,7 @@ import React from 'react';
import _ from 'lodash';
import ReCAPTCHA from 'react-google-recaptcha';
import { browserHistory } from 'react-router';
import RichTextEditor from 'react-rte-browserify';
import RichTextEditor from 'react-rte-browserify';
import i18n from 'lib-app/i18n';
import API from 'lib-app/api-call';
@ -10,6 +10,7 @@ import SessionStore from 'lib-app/session-store';
import store from 'app/store';
import SessionActions from 'actions/session-actions';
import LanguageSelector from 'app-components/language-selector';
import Captcha from 'app/main/captcha';
import Header from 'core-components/header';
import Form from 'core-components/form';
@ -34,6 +35,8 @@ class CreateTicketForm extends React.Component {
title: '',
content: RichTextEditor.createEmptyValue(),
departmentIndex: 0,
email: '',
name: '',
language: 'en'
}
};
@ -79,7 +82,7 @@ class CreateTicketForm extends React.Component {
renderCaptcha() {
return (
<div className="create-ticket-form__captcha">
<Captcha />
<Captcha ref="captcha"/>
</div>
);
}
@ -105,27 +108,37 @@ class CreateTicketForm extends React.Component {
}
onSubmit(formState) {
this.setState({
loading: true
});
let captcha = this.refs.captcha && this.refs.captcha.getWrappedInstance();
API.call({
path: '/ticket/create',
data: _.extend({}, formState, {
departmentId: SessionStore.getDepartments()[formState.departmentIndex].id
})
}).then(this.onTicketSuccess.bind(this)).catch(this.onTicketFail.bind(this));
if (captcha && !captcha.getValue()) {
captcha.focus();
} else {
this.setState({
loading: true
});
API.call({
path: '/ticket/create',
data: _.extend({}, formState, {
captcha: captcha && captcha.getValue(),
departmentId: SessionStore.getDepartments()[formState.departmentIndex].id
})
}).then(this.onTicketSuccess.bind(this, formState.email)).catch(this.onTicketFail.bind(this));
}
}
onTicketSuccess() {
onTicketSuccess(email, result) {
this.setState({
loading: false,
message: 'success'
});
store.dispatch(SessionActions.getUserData());
setTimeout(() => {browserHistory.push('/dashboard')}, 2000);
if(this.props.userLogged) {
store.dispatch(SessionActions.getUserData());
setTimeout(() => {browserHistory.push('/dashboard')}, 2000);
} else {
setTimeout(() => {browserHistory.push('/check-ticket/' + email + '/' + result.data.ticketNumber)}, 2000);
}
}
onTicketFail() {

27
client/src/app/main/dashboard/dashboard-create-ticket/dashboard-create-ticket-page.js
View File

@ -1,16 +1,39 @@
import React from 'react';
import classNames from 'classnames';
import CreateTicketForm from 'app/main/dashboard/dashboard-create-ticket/create-ticket-form';
import Widget from 'core-components/widget';
class DashboardCreateTicketPage extends React.Component {
static propTypes = {
userSystemEnabled: React.PropTypes.bool
};
render() {
let Wrapper = 'div';
if((this.props.location.pathname === '/create-ticket')) {
Wrapper = Widget;
}
return (
<div>
<CreateTicketForm />
<div className={this.getClass()}>
<Wrapper>
<CreateTicketForm userLogged={(this.props.location.pathname !== '/create-ticket')} />
</Wrapper>
</div>
);
}
getClass() {
let classes = {
'dashboard-create-ticket-page': true,
'dashboard-create-ticket-page_wrapped': (this.props.location.pathname === '/create-ticket')
};
return classNames(classes);
}
}
export default DashboardCreateTicketPage;

6
client/src/app/main/dashboard/dashboard-create-ticket/dashboard-create-ticket-page.scss Normal file
View File

@ -0,0 +1,6 @@
.dashboard-create-ticket-page {
&_wrapped {
padding: 0 10px;
}
}

33
client/src/app/main/dashboard/dashboard-list-articles/dashboard-list-articles-page.js
View File

@ -1,4 +1,5 @@
import React from 'react';
import classNames from 'classnames';
import {connect} from 'react-redux';
import _ from 'lodash';
import {Link} from 'react-router';
@ -9,6 +10,7 @@ import ArticlesActions from 'actions/articles-actions';
import Header from 'core-components/header';
import SearchBox from 'core-components/search-box';
import Widget from 'core-components/widget';
class DashboardListArticlesPage extends React.Component {
@ -22,18 +24,28 @@ class DashboardListArticlesPage extends React.Component {
}
render() {
let Wrapper = 'div';
if(this.props.location.pathname == '/articles') {
Wrapper = Widget;
}
return (
<div className="dashboard-list-articles-page">
<Header title={i18n('LIST_ARTICLES')} description={i18n('LIST_ARTICLES_DESCRIPTION')}/>
<SearchBox className="dashboard-list-articles-page__search-box" onSearch={this.onSearch.bind(this)} searchOnType />
{(!this.state.showSearchResults) ? this.renderArticleList() : this.renderSearchResults()}
<div className={this.getClass()}>
<Wrapper>
<Header title={i18n('LIST_ARTICLES')} description={i18n('LIST_ARTICLES_DESCRIPTION')}/>
<SearchBox className="dashboard-list-articles-page__search-box" onSearch={this.onSearch.bind(this)} searchOnType />
{(!this.state.showSearchResults) ? this.renderArticleList() : this.renderSearchResults()}
</Wrapper>
</div>
);
}
renderArticleList() {
let articlePath = (this.props.location.pathname == '/articles') ? '/article/' : '/dashboard/article/';
return (
<ArticlesList editable={false} articlePath="/dashboard/article/" retrieveOnMount={false}/>
<ArticlesList editable={false} articlePath={articlePath} retrieveOnMount={false}/>
);
}
@ -53,7 +65,7 @@ class DashboardListArticlesPage extends React.Component {
return (
<div className="dashboard-list-articles-page__search-result">
<div className="dashboard-list-articles-page__search-result-title">
<Link to={'/dashboard/article/' + item.id}>{item.title}</Link>
<Link to={((this.props.location.pathname == '/articles') ? '/article/' : '/dashboard/article/') + item.id}>{item.title}</Link>
</div>
<div className="dashboard-list-articles-page__search-result-description">{content}</div>
<div className="dashboard-list-articles-page__search-result-topic">{item.topic}</div>
@ -61,6 +73,15 @@ class DashboardListArticlesPage extends React.Component {
);
}
getClass() {
let classes = {
'dashboard-list-articles-page': true,
'dashboard-list-articles-page_wrapped': (this.props.location.pathname == '/articles')
};
return classNames(classes);
}
onSearch(query) {
this.setState({
results: SearchBox.searchQueryInList(this.getArticles(), query, this.isQueryInTitle.bind(this), this.isQueryInContent.bind(this)),

4
client/src/app/main/dashboard/dashboard-list-articles/dashboard-list-articles-page.scss
View File

@ -29,4 +29,8 @@
text-transform: uppercase;
}
}
&_wrapped {
padding: 0 15px;
}
}

95
client/src/app/main/main-check-ticket-page.js Normal file
View File

@ -0,0 +1,95 @@
import React from 'react';
import { browserHistory } from 'react-router';
import i18n from 'lib-app/i18n';
import API from 'lib-app/api-call';
import SessionStore from 'lib-app/session-store';
import Widget from 'core-components/widget';
import Header from 'core-components/header';
import Form from 'core-components/form';
import FormField from 'core-components/form-field';
import SubmitButton from 'core-components/submit-button';
import Captcha from 'app/main/captcha';
class MainCheckTicketPage extends React.Component {
state = {
loading: false,
form: {
email: this.props.params.email || '',
ticketNumber: this.props.params.ticketNumber || ''
},
errors: {}
};
render() {
return (
<div className="main-check-ticket-page">
<Widget>
<Header title={i18n('CHECK_TICKET')} description={i18n('VIEW_TICKET_DESCRIPTION')} />
<Form {...this.getFormProps()}>
<div className="main-check-ticket-page__inputs">
<div className="main-check-ticket-page__input">
<FormField name="email" label={i18n('EMAIL')} validation="EMAIL" required fieldProps={{size: 'large'}}/>
</div>
<div className="main-check-ticket-page__input">
<FormField name="ticketNumber" label={i18n('TICKET_NUMBER')} validation="DEFAULT" required fieldProps={{size: 'large'}}/>
</div>
</div>
<div className="main-check-ticket-page__captcha">
<Captcha ref="captcha"/>
</div>
<SubmitButton>{i18n('CHECK_TICKET')}</SubmitButton>
</Form>
</Widget>
</div>
);
}
getFormProps() {
return {
className: 'main-check-ticket-page__form',
loading: this.state.loading,
values: this.state.form,
errors: this.state.errors,
onChange: (form) => this.setState({form}),
onValidateErrors: (errors) => this.setState({errors}),
onSubmit: this.onFormSubmit.bind(this)
};
}
onFormSubmit(form) {
const captcha = this.refs.captcha.getWrappedInstance();
if (!captcha.getValue()) {
captcha.focus();
} else {
this.setState({
loading: true
});
API.call({
path: '/ticket/get',
data: {
captcha: captcha && captcha.getValue(),
ticketNumber: form.ticketNumber,
email: form.email
}
}).then(this.onTicketGetSuccess.bind(this)).catch(() => this.setState({
loading: false,
errors: {
email: i18n('INVALID_EMAIL_OR_TICKET_NUMBER'),
ticketNumber: i18n('INVALID_EMAIL_OR_TICKET_NUMBER')
}
}));
}
}
onTicketGetSuccess(result) {
SessionStore.setItem('token', result.data.token);
setTimeout(() => {browserHistory.push('/view-ticket/' + this.state.form.ticketNumber)}, 2000);
}
}
export default MainCheckTicketPage;

24
client/src/app/main/main-check-ticket-page.scss Normal file
View File

@ -0,0 +1,24 @@
.main-check-ticket-page {
padding: 0 15px;
&__form {
margin: 0 auto;
max-width: 790px;
}
&__inputs {
display: inline-block;
margin: 0 auto;
}
&__input {
display: inline-block;
margin: 0 20px;
}
&__captcha {
margin: 20px auto 20px;
height: 78px;
width: 304px;
}
}

62
client/src/app/main/main-home/main-home-page-portal.js
View File

@ -1,5 +1,7 @@
import React from 'react';
import classNames from 'classnames';
import {browserHistory} from 'react-router';
import {connect} from 'react-redux'
import Widget from 'core-components/widget';
import Card from 'core-components/card';
@ -7,26 +9,76 @@ import i18n from 'lib-app/i18n';
import Header from 'core-components/header';
class MainHomePagePortal extends React.Component {
static propTypes = {
type: React.PropTypes.oneOf(['default', 'complete'])
};
render() {
return (
<Widget className={classNames('main-home-page-portal', this.props.className)}>
<div className="main-home-page-portal__title">
<Header title={i18n('SUPPORT_CENTER')} description={i18n('SUPPORT_CENTER_DESCRIPTION')} />
<Header title={this.props.title || i18n('SUPPORT_CENTER')} description={i18n('SUPPORT_CENTER_DESCRIPTION')} />
</div>
<div className="main-home-page-portal__cards">
<div className="main-home-page-portal__card col-md-4">
<Card title={i18n('TICKETS')} description={i18n('TICKETS_DESCRIPTION')} icon="ticket" color="red"/>
<Card {...this.getTicketsCardProps()}/>
</div>
<div className="main-home-page-portal__card col-md-4">
<Card title={i18n('ARTICLES')} description={i18n('ARTICLES_DESCRIPTION')} icon="book" color="blue"/>
<Card {...((this.props.type === 'complete') ? this.getViewTicketCardProps() : this.getAccountCardProps())} />
</div>
<div className="main-home-page-portal__card col-md-4">
<Card title={i18n('ACCOUNT')} description={i18n('ACCOUNT_DESCRIPTION')} icon="user" color="green"/>
<Card {...this.getArticlesCardProps()} />
</div>
</div>
</Widget>
);
}
getTicketsCardProps() {
return {
title: i18n('TICKETS'),
description: i18n('TICKETS_DESCRIPTION'),
icon: 'ticket',
color: 'red',
buttonText: (this.props.type === 'complete') ? i18n('CREATE_TICKET') : null,
onButtonClick: () => browserHistory.push('/create-ticket')
};
}
getAccountCardProps() {
return {
title: i18n('ACCOUNT'),
description: i18n('ACCOUNT_DESCRIPTION'),
icon: 'user',
color: 'green'
};
}
getArticlesCardProps() {
return {
title: i18n('ARTICLES'),
description: i18n('ARTICLES_DESCRIPTION'),
icon: 'book',
color: 'blue',
buttonText: (this.props.type === 'complete') ? i18n('VIEW_ARTICLES') : null,
onButtonClick: () => browserHistory.push('/articles')
};
}
getViewTicketCardProps() {
return {
title: i18n('VIEW_TICKET'),
description: i18n('VIEW_TICKET_DESCRIPTION'),
icon: 'check-square-o',
color: 'green',
buttonText: (this.props.type === 'complete') ? i18n('CHECK_TICKET') : null,
onButtonClick: () => browserHistory.push('/check-ticket')
};
}
}
export default MainHomePagePortal;
export default connect((store) => {
return {
title: store.config.title
};
})(MainHomePagePortal);

21
client/src/app/main/main-home/main-home-page.js
View File

@ -1,6 +1,6 @@
import React from 'react';
import {connect} from 'react-redux'
import {connect} from 'react-redux'
import i18n from 'lib-app/i18n';
import MainHomePageLoginWidget from 'app/main/main-home/main-home-page-login-widget';
@ -13,11 +13,9 @@ class MainHomePage extends React.Component {
return (
<div className="main-home-page">
{this.renderMessage()}
<div className="col-md-4">
<MainHomePageLoginWidget />
</div>
<div className="col-md-8">
<MainHomePagePortal />
{(this.props.config['user-system-enabled']) ? this.renderLoginWidget() : null}
<div className={(this.props.config['user-system-enabled']) ? 'col-md-8' : 'col-md-12'}>
<MainHomePagePortal type={((this.props.config['user-system-enabled']) ? 'default' : 'complete')}/>
</div>
</div>
);
@ -34,6 +32,14 @@ class MainHomePage extends React.Component {
}
}
renderLoginWidget() {
return (
<div className="col-md-4">
<MainHomePageLoginWidget />
</div>
);
}
renderSuccess() {
return (
<Message title={i18n('VERIFY_SUCCESS')} type="success" className="main-home-page__message">
@ -53,6 +59,7 @@ class MainHomePage extends React.Component {
export default connect((store) => {
return {
session: store.session
session: store.session,
config: store.config
};
})(MainHomePage);

12
client/src/app/main/main-layout-header.js
View File

@ -12,7 +12,7 @@ class MainLayoutHeader extends React.Component {
render() {
return (
<div className="main-layout-header">
{this.renderAccessLinks()}
{(this.props.config['user-system-enabled']) ? this.renderAccessLinks() : this.renderHomeLink()}
<LanguageSelector {...this.getLanguageSelectorProps()} />
</div>
);
@ -32,7 +32,7 @@ class MainLayoutHeader extends React.Component {
result = (
<div className="main-layout-header__login-links">
<Button type="clean" route={{to:'/'}}>{i18n('LOG_IN')}</Button>
{this.props.config === true ? <Button type="clean" route={{to:'/signup'}}>{i18n('SIGN_UP')}</Button> : null}
{(this.props.config['registration'] === true) ? <Button type="clean" route={{to:'/signup'}}>{i18n('SIGN_UP')}</Button> : null}
</div>
);
}
@ -40,6 +40,14 @@ class MainLayoutHeader extends React.Component {
return result;
}
renderHomeLink() {
return (
<div className="main-layout-header__login-links">
<Button type="clean" route={{to:'/'}}>{i18n('HOME')}</Button>
</div>
);
}
getLanguageSelectorProps() {
return {
className: 'main-layout-header__languages',

4
client/src/app/main/main-signup/main-signup-page.js
View File

@ -63,7 +63,7 @@ class MainSignUpPageWidget extends React.Component {
return {
loading: this.state.loading,
className: 'signup-widget__form',
onSubmit: this.onLoginFormSubmit.bind(this)
onSubmit: this.onSignupFormSubmit.bind(this)
};
}
@ -77,7 +77,7 @@ class MainSignUpPageWidget extends React.Component {
};
}
onLoginFormSubmit(formState) {
onSignupFormSubmit(formState) {
const captcha = this.refs.captcha.getWrappedInstance();
if (!captcha.getValue()) {

20
client/src/app/main/main-view-ticket-page.js Normal file
View File

@ -0,0 +1,20 @@
import React from 'react';
import AdminPanelViewTicket from 'app/admin/panel/tickets/admin-panel-view-ticket'
import Widget from 'core-components/widget';
class MainViewTicketPage extends React.Component {
render() {
return (
<div className="main-view-ticket-page">
<Widget>
<AdminPanelViewTicket {...this.props} avoidSeen assignmentAllowed={false} />
</Widget>
</div>
);
}
}
export default MainViewTicketPage;

3
client/src/app/main/main-view-ticket-page.scss Normal file
View File

@ -0,0 +1,3 @@
.main-view-ticket-page {
padding: 0 15px;
}

4
client/src/core-components/button.js
View File

@ -17,6 +17,7 @@ class Button extends React.Component {
static propTypes = {
children: React.PropTypes.node,
inverted: React.PropTypes.bool,
size: React.PropTypes.oneOf([
'extra-small',
'small',
@ -70,7 +71,8 @@ class Button extends React.Component {
let classes = {
'button': true,
'button_disabled': this.props.disabled,
'button_inverted': this.props.inverted,
'button_primary': (this.props.type === 'primary'),
'button_secondary': (this.props.type === 'secondary'),
'button_tertiary': (this.props.type === 'tertiary'),

31
client/src/core-components/button.scss
View File

@ -31,6 +31,10 @@
&_secondary {
background-color: $primary-green;
&:focus, &:hover {
background-color: lighten($primary-green, 5%);
outline: none;
}
&.button_disabled,
&.button_disabled:hover {
@ -41,6 +45,11 @@
&_tertiary {
background-color: $secondary-blue;
&:focus, &:hover {
background-color: lighten($secondary-blue, 5%);
outline: none;
}
&.button_disabled,
&.button_disabled:hover {
background-color: lighten($secondary-blue, 15%);
@ -93,4 +102,26 @@
text-decoration: underline;
}
}
&_inverted {
background-color: white;
&:focus, &:hover {
background-color: white;
opacity: 0.9;
outline: none;
}
&.button_primary {
color: $primary-red;
}
&.button_secondary {
color: $primary-green;
}
&.button_tertiary {
color: $secondary-blue;
}
}
}

28
client/src/core-components/card.js
View File

@ -1,5 +1,6 @@
import React from 'react';
import Icon from 'core-components/icon';
import Button from 'core-components/button';
import classNames from 'classnames';
class Card extends React.Component{
@ -7,7 +8,9 @@ class Card extends React.Component{
description: React.PropTypes.string,
title: React.PropTypes.string,
icon: React.PropTypes.string,
color: React.PropTypes.string
color: React.PropTypes.string,
buttonText: React.PropTypes.string,
onButtonClick: React.PropTypes.func
};
render() {
@ -16,12 +19,23 @@ class Card extends React.Component{
<div className="card__icon"><Icon name={this.props.icon} size="5x"/></div>
<div className="card__title">{this.props.title}</div>
<div className="card__description">{this.props.description}</div>
{(this.props.buttonText) ? this.renderButton() : null}
</div>
);
}
renderButton() {
return (
<div className="card__button">
<Button type={this.getButtonType()} inverted onClick={this.props.onButtonClick}>
{this.props.buttonText}
</Button>
</div>
);
}
getClass() {
var classes = {
let classes = {
'card': true,
'card_red': (this.props.color === 'red'),
'card_blue': (this.props.color === 'blue'),
@ -32,5 +46,15 @@ class Card extends React.Component{
return classNames(classes);
}
getButtonType() {
let types = {
'red': 'primary',
'green': 'secondary',
'blue': 'tertiary'
};
return types[this.props.color];
}
}
export default Card;

8
client/src/core-components/card.scss
View File

@ -5,6 +5,7 @@
color: white;
height: 260px;
padding: 15px;
position: relative;
&__title {
font-variant: small-caps;
@ -16,6 +17,13 @@
font-size: $font-size--sm;
}
&__button {
position: absolute;
left: 0;
right: 0;
bottom: 17px;
}
&_red {
background-color: $primary-red;
}

7
client/src/data/fixtures/system-fixtures.js
View File

@ -11,7 +11,7 @@ module.exports = [
'reCaptchaKey': '6LfM5CYTAAAAAGLz6ctpf-hchX2_l0Ge-Bn-n8wS',
'reCaptchaPrivate': 'LALA',
'url': 'http://www.opensupports.com/support',
'title': 'Very Cool',
'title': 'OpenSupports Support Center',
'layout': 'Boxed',
'time-zone': 3,
'no-reply-email': 'shitr@post.com',
@ -19,6 +19,7 @@ module.exports = [
'smtp-port': '7070',
'smtp-user': 'Wesa',
'maintenance-mode': false,
'user-system-enabled': true,
'allow-attachments': true,
'registration': true,
'max-size': 500,
@ -37,8 +38,12 @@ module.exports = [
status: 'success',
data: {
'language': 'en',
'title': '',
'layout': 'Boxed',
'reCaptchaKey': '6LfM5CYTAAAAAGLz6ctpf-hchX2_l0Ge-Bn-n8wS',
'maintenance-mode': false,
'user-system-enabled': true,
'registration': true,
'departments': [
{id: 1, name: 'Sales Support', owners: 2},
{id: 2, name: 'Technical Issues', owners: 5},

2
client/src/data/fixtures/ticket-fixtures.js
View File

@ -110,10 +110,12 @@ module.exports = [
closed: false,
priority: 'medium',
author: {
id: 3,
name: 'Haskell Curry',
email: 'haskell@lambda.com'
},
owner: {
id: 1,
name: 'Steve Jobs'
},
events: [

8
client/src/data/languages/en.js
View File

@ -73,6 +73,7 @@ export default {
'ASSIGN_TO_ME': 'Assign to me',
'UN_ASSIGN': 'Unassign',
'VIEW_TICKET': 'View Ticket',
'VIEW_TICKET_DESCRIPTION': 'Check the status of your ticket using your ticket number and email.',
'SELECT_CUSTOM_RESPONSE': 'Select a custom response...',
'WARNING': 'Warning',
'INFO': 'Information',
@ -152,10 +153,11 @@ export default {
'ALL_NOTIFICATIONS': 'All notifications',
'VERIFY_SUCCESS': 'User verified',
'VERIFY_FAILED': 'Could not verify',
'STATISTICS': 'Statistics',
'CHECK_TICKET': 'Check Ticket',
'ACTIVITY': 'Activity',
'HOME': 'Home',
'TICKET_NUMBER': 'Ticket number',
'CHART_CREATE_TICKET': 'Tickets created',
'CHART_CLOSE': 'Tickets closed',
'CHART_SIGNUP': 'Signups',

12
server/controllers/ticket/comment.php
View File

@ -25,9 +25,15 @@ class CommentController extends Controller {
if(!Controller::isUserSystemEnabled()) {
$validations['permission'] = 'any';
$validations['requestData']['email'] = [
'validation' => DataValidator::email(),
'error' => ERRORS::INVALID_EMAIL
$session = Session::getInstance();
$validations['requestData']['csrf_token'] = [
'validation' => DataValidator::equals($session->getToken()),
'error' => ERRORS::NO_PERMISSION
];
$validations['requestData']['ticketNumber'] = [
'validation' => DataValidator::equals($session->getTicketNumber()),
'error' => ERRORS::INVALID_TICKET
];
}

45
server/controllers/ticket/get.php
View File

@ -20,14 +20,28 @@ class TicketGetController extends Controller {
if(!Controller::isUserSystemEnabled() && !Controller::isStaffLogged()) {
$validations['permission'] = 'any';
$validations['requestData']['email'] = [
'validation' => DataValidator::email(),
'error' => ERRORS::INVALID_EMAIL
];
$validations['requestData']['captcha'] = [
'validation' => DataValidator::captcha(),
'error' => ERRORS::INVALID_CAPTCHA
];
if(Controller::request('token')) {
$session = Session::getInstance();
$validations['requestData']['csrf_token'] = [
'validation' => DataValidator::equals($session->getToken()),
'error' => ERRORS::NO_PERMISSION
];
$validations['requestData']['ticketNumber'] = [
'validation' => DataValidator::equals($session->getTicketNumber()),
'error' => ERRORS::INVALID_TICKET
];
} else {
$validations['requestData']['email'] = [
'validation' => DataValidator::email(),
'error' => ERRORS::INVALID_EMAIL
];
$validations['requestData']['captcha'] = [
'validation' => DataValidator::captcha(),
'error' => ERRORS::INVALID_CAPTCHA
];
}
}
return $validations;
@ -40,7 +54,11 @@ class TicketGetController extends Controller {
if(!Controller::isUserSystemEnabled() && !Controller::isStaffLogged()) {
if($this->ticket->authorEmail === $email) {
Response::respondSuccess($this->ticket->toArray());
if(!Controller::request('token')) {
$this->generateSessionToken();
} else {
Response::respondSuccess($this->ticket->toArray());
}
return;
} else {
throw new Exception(ERRORS::NO_PERMISSION);
@ -54,6 +72,15 @@ class TicketGetController extends Controller {
}
}
private function generateSessionToken() {
$session = Session::getInstance();
$token = Hashing::generateRandomToken();
$session->createTicketSession($this->ticket->ticketNUmber);
Response::respondSuccess(['token' => $token, 'ticketNumber' => $this->ticket->ticketNUmber]);
}
private function shouldDenyPermission() {
$user = Controller::getLoggedUser();

11
server/models/Session.php
View File

@ -29,6 +29,15 @@ class Session {
$this->store('staff', $staff);
$this->store('token', Hashing::generateRandomToken());
}
public function createTicketSession($ticketNumber) {
$this->store('ticketNumber', $ticketNumber);
$this->store('token', Hashing::generateRandomToken());
}
public function getTicketNumber() {
return $this->getStoredData('ticketNumber');
}
public function getToken() {
return $this->getStoredData('token');
@ -51,7 +60,7 @@ class Session {
$token === $data['token'];
}
private function store($key, $value) {
public function store($key, $value) {
$_SESSION[$key] = $value;
}