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

Ivan - Update departments view styling [skip ci]

This commit is contained in:
ivan 2016-12-12 18:02:28 -03:00
parent a45f39adab
commit 1b72c23844
3 changed files with 32 additions and 14 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

13
client/src/app/admin/panel/staff/admin-panel-departments.js
View File

@ -39,13 +39,15 @@ class AdminPanelDepartments extends React.Component {
<div className="admin-panel-departments">
<Header title={i18n('DEPARTMENTS')} description={i18n('DEPARTMENTS_DESCRIPTION')} />
<div className="row">
<div className="col-md-3">
<div className="col-md-4">
<Listing {...this.getListingProps()}/>
</div>
<div className="col-md-9">
<div className="col-md-8">
<Form {...this.getFormProps()}>
<FormField label={i18n('NAME')} name="name" validation="NAME" required fieldProps={{size: 'large'}}/>
<SubmitButton size="medium" className="admin-panel-departments__update-name-button">{i18n('UPDATE_NAME')}</SubmitButton>
<SubmitButton size="medium" className="admin-panel-departments__update-name-button" type="secondary">
{i18n((this.state.selectedIndex !== -1) ? 'UPDATE_NAME' : 'ADD_DEPARTMENT')}
</SubmitButton>
</Form>
{(this.state.selectedIndex !== -1) ? this.renderOptionalButtons() : null}
</div>
@ -58,10 +60,10 @@ class AdminPanelDepartments extends React.Component {
return (
<div className="admin-panel-departments__optional-buttons">
<div className="admin-panel-departments__discard-button">
<Button onClick={this.onDiscardChangesClick.bind(this)}>{i18n('DISCARD_CHANGES')}</Button>
<Button onClick={this.onDiscardChangesClick.bind(this)} size="medium">{i18n('DISCARD_CHANGES')}</Button>
</div>
<div className="admin-panel-departments__delete-button">
<Button onClick={this.onDeleteClick.bind(this)}>{i18n('DELETE')}</Button>
<Button onClick={this.onDeleteClick.bind(this)} size="medium">{i18n('DELETE')}</Button>
</div>
</div>
);
@ -70,6 +72,7 @@ class AdminPanelDepartments extends React.Component {
getListingProps() {
return {
className: 'admin-panel-departments__list',
title: i18n('DEPARTMENTS'),
items: this.props.departments.map(department => {
return {

20
client/src/app/admin/panel/staff/admin-panel-departments.scss
View File

@ -2,23 +2,27 @@
.admin-panel-departments {
&__update-name-button {
&__list {
position: relative;
}
&__update-name-button {
float: left;
}
&__optional-buttons {
}
&__discard-button {
float: right;
}
&__discard-button,
&__delete-button {
display: inline-block;
margin-left: 10px;
}
&__warning {
position: absolute;
right: 10px;
}
}

13
client/src/core-components/listing.js
View File

@ -1,4 +1,5 @@
import React from 'react';
import classNames from 'classnames';
import Menu from 'core-components/menu';
import Button from 'core-components/button';
@ -20,7 +21,7 @@ class Listing extends React.Component {
render() {
return (
<div className="listing">
<div className={this.getClass()}>
<div className="listing__header">
{this.props.title}
</div>
@ -42,6 +43,16 @@ class Listing extends React.Component {
);
}
getClass() {
let classes = {
'listing': true
};
classes[this.props.className] = (this.props.className);
return classNames(classes);
}
}
export default Listing;