Skip to content

Commit ba16016

Browse files
webdevstarwebdevstar
committed
Added className
1 parent cf6e946 commit ba16016

13 files changed

Lines changed: 96 additions & 72 deletions

File tree

‎src/admin/client/layouts/products/categories/index.js‎

Lines changed: 1 addition & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -4,7 +4,7 @@ import Categories from 'modules/product-categories/list';
44

55
export default () => (
66
<div className="row row--no-gutter col-full-height">
7-
<div className="col-xs-3 col--no-gutter scroll col-full-height right-border">
7+
<div className="col-xs-3 col--no-gutter scroll col-full-height">
88
<Categories showAll={false} showTrash={false} showAdd={true} />
99
</div>
1010
<div className="col-xs-9 col--no-gutter scroll col-full-height">

‎src/admin/client/modules/app/head/components/appBar.js‎

Lines changed: 20 additions & 20 deletions
Original file line numberDiff line numberDiff line change
@@ -102,12 +102,12 @@ export default class AppBarTop extends React.Component {
102102
}
103103
else if(location.startsWith('/admin/product/')){
104104
title = title = messages.products_titleEdit;
105-
leftButton = <IconButton><Link to="/admin/products"><FontIcon color="#fff" className="material-icons">arrow_back</FontIcon></Link></IconButton>
105+
leftButton = <Link to="/admin/products"><IconButton><FontIcon color="#fff" className="material-icons">arrow_back</FontIcon></IconButton></Link>
106106
rightElements = <ProductHead />;
107107
}
108108
else if(location === '/admin/products/categories'){
109109
title = messages.productCategories_title;
110-
leftButton = <IconButton><Link to="/admin/products"><FontIcon color="#fff" className="material-icons">arrow_back</FontIcon></Link></IconButton>
110+
leftButton = <Link to="/admin/products"><IconButton><FontIcon color="#fff" className="material-icons">arrow_back</FontIcon></IconButton></Link>
111111
if(productCategoryName){
112112
title = title = messages.productCategories_titleEdit;;
113113
rightElements = <ProductCategoryHead />
@@ -128,7 +128,7 @@ export default class AppBarTop extends React.Component {
128128
}
129129
else if(location === '/admin/customers/groups'){
130130
title = messages.customerGroups_title;
131-
leftButton = <IconButton><Link to="/admin/customers"><FontIcon color="#fff" className="material-icons">arrow_back</FontIcon></Link></IconButton>
131+
leftButton = <Link to="/admin/customers"><IconButton><FontIcon color="#fff" className="material-icons">arrow_back</FontIcon></IconButton></Link>
132132
if(customerGroupName){
133133
title = title = messages.customerGroups_titleEdit;;
134134
rightElements = <CustomerGroupHead />
@@ -139,19 +139,19 @@ export default class AppBarTop extends React.Component {
139139
}
140140
else if(location === '/admin/settings/email/smtp'){
141141
title = messages.settings_smtpSettings;
142-
leftButton = <IconButton><Link to="/admin/settings/email"><FontIcon color="#fff" className="material-icons">arrow_back</FontIcon></Link></IconButton>
142+
leftButton = <Link to="/admin/settings/email"><IconButton><FontIcon color="#fff" className="material-icons">arrow_back</FontIcon></IconButton></Link>
143143
}
144144
else if(location === '/admin/settings/email/templates/order_confirmation'){
145145
title = messages.settings_orderConfirmation;
146-
leftButton = <IconButton><Link to="/admin/settings/email"><FontIcon color="#fff" className="material-icons">arrow_back</FontIcon></Link></IconButton>
146+
leftButton = <Link to="/admin/settings/email"><IconButton><FontIcon color="#fff" className="material-icons">arrow_back</FontIcon></IconButton></Link>
147147
}
148148
else if(location === '/admin/settings/email/templates/customer_registration'){
149149
title = messages.settings_customerRegistration;
150-
leftButton = <IconButton><Link to="/admin/settings/email"><FontIcon color="#fff" className="material-icons">arrow_back</FontIcon></Link></IconButton>
150+
leftButton = <Link to="/admin/settings/email"><IconButton><FontIcon color="#fff" className="material-icons">arrow_back</FontIcon></IconButton></Link>
151151
}
152152
else if(location === '/admin/settings/email/templates/customer_recovery'){
153153
title = messages.settings_customerRecovery;
154-
leftButton = <IconButton><Link to="/admin/settings/email"><FontIcon color="#fff" className="material-icons">arrow_back</FontIcon></Link></IconButton>
154+
leftButton = <Link to="/admin/settings/email"><IconButton><FontIcon color="#fff" className="material-icons">arrow_back</FontIcon></IconButton></Link>
155155
}
156156
else if(location === '/admin/settings/theme'){
157157
title = messages.settings_themeSettings;
@@ -161,23 +161,23 @@ export default class AppBarTop extends React.Component {
161161
}
162162
else if(location === '/admin/settings/checkout/fields/email'){
163163
title = messages.email;
164-
leftButton = <IconButton><Link to="/admin/settings/checkout"><FontIcon color="#fff" className="material-icons">arrow_back</FontIcon></Link></IconButton>
164+
leftButton = <Link to="/admin/settings/checkout"><IconButton><FontIcon color="#fff" className="material-icons">arrow_back</FontIcon></IconButton></Link>
165165
}
166166
else if(location === '/admin/settings/checkout/fields/mobile'){
167167
title = messages.mobile;
168-
leftButton = <IconButton><Link to="/admin/settings/checkout"><FontIcon color="#fff" className="material-icons">arrow_back</FontIcon></Link></IconButton>
168+
leftButton = <Link to="/admin/settings/checkout"><IconButton><FontIcon color="#fff" className="material-icons">arrow_back</FontIcon></IconButton></Link>
169169
}
170170
else if(location === '/admin/settings/checkout/fields/country'){
171171
title = messages.country;
172-
leftButton = <IconButton><Link to="/admin/settings/checkout"><FontIcon color="#fff" className="material-icons">arrow_back</FontIcon></Link></IconButton>
172+
leftButton = <Link to="/admin/settings/checkout"><IconButton><FontIcon color="#fff" className="material-icons">arrow_back</FontIcon></IconButton></Link>
173173
}
174174
else if(location === '/admin/settings/checkout/fields/state'){
175175
title = messages.state;
176-
leftButton = <IconButton><Link to="/admin/settings/checkout"><FontIcon color="#fff" className="material-icons">arrow_back</FontIcon></Link></IconButton>
176+
leftButton = <Link to="/admin/settings/checkout"><IconButton><FontIcon color="#fff" className="material-icons">arrow_back</FontIcon></IconButton></Link>
177177
}
178178
else if(location === '/admin/settings/checkout/fields/city'){
179179
title = messages.city;
180-
leftButton = <IconButton><Link to="/admin/settings/checkout"><FontIcon color="#fff" className="material-icons">arrow_back</FontIcon></Link></IconButton>
180+
leftButton = <Link to="/admin/settings/checkout"><IconButton><FontIcon color="#fff" className="material-icons">arrow_back</FontIcon></IconButton></Link>
181181
}
182182
else if(location === '/admin/settings/shipping'){
183183
title = messages.settings_shippingMethods;
@@ -187,20 +187,20 @@ export default class AppBarTop extends React.Component {
187187
}
188188
else if(location === '/admin/settings/shipping/add'){
189189
title = messages.settings_addShippingMethod;
190-
leftButton = <IconButton><Link to="/admin/settings/shipping"><FontIcon color="#fff" className="material-icons">arrow_back</FontIcon></Link></IconButton>
190+
leftButton = <Link to="/admin/settings/shipping"><IconButton><FontIcon color="#fff" className="material-icons">arrow_back</FontIcon></IconButton></Link>
191191
}
192192
else if(location === '/admin/settings/payments/add'){
193193
title = messages.settings_addPaymentMethod;
194-
leftButton = <IconButton><Link to="/admin/settings/payments"><FontIcon color="#fff" className="material-icons">arrow_back</FontIcon></Link></IconButton>
194+
leftButton = <Link to="/admin/settings/payments"><IconButton><FontIcon color="#fff" className="material-icons">arrow_back</FontIcon></IconButton></Link>
195195
}
196196
else if(location.startsWith('/admin/settings/shipping/')){
197197
title = messages.settings_editShippingMethod;
198-
leftButton = <IconButton><Link to="/admin/settings/shipping"><FontIcon color="#fff" className="material-icons">arrow_back</FontIcon></Link></IconButton>
198+
leftButton = <Link to="/admin/settings/shipping"><IconButton><FontIcon color="#fff" className="material-icons">arrow_back</FontIcon></IconButton></Link>
199199
rightElements = <ShippingMethodHead />
200200
}
201201
else if(location.startsWith('/admin/settings/payments/')){
202202
title = messages.settings_editPaymentMethod;
203-
leftButton = <IconButton><Link to="/admin/settings/payments"><FontIcon color="#fff" className="material-icons">arrow_back</FontIcon></Link></IconButton>
203+
leftButton = <Link to="/admin/settings/payments"><IconButton><FontIcon color="#fff" className="material-icons">arrow_back</FontIcon></IconButton></Link>
204204
rightElements = <PaymentMethodHead />
205205
}
206206
else if(location === '/admin/settings/general' || location === '/admin/settings'){
@@ -211,23 +211,23 @@ export default class AppBarTop extends React.Component {
211211
}
212212
else if(location === '/admin/settings/pages/add'){
213213
title = messages.settings_addPage;
214-
leftButton = <IconButton><Link to="/admin/settings/pages"><FontIcon color="#fff" className="material-icons">arrow_back</FontIcon></Link></IconButton>
214+
leftButton = <Link to="/admin/settings/pages"><IconButton><FontIcon color="#fff" className="material-icons">arrow_back</FontIcon></IconButton></Link>
215215
}
216216
else if(location.startsWith('/admin/settings/pages/')){
217217
title = messages.settings_editPage;
218-
leftButton = <IconButton><Link to="/admin/settings/pages"><FontIcon color="#fff" className="material-icons">arrow_back</FontIcon></Link></IconButton>
218+
leftButton = <Link to="/admin/settings/pages"><IconButton><FontIcon color="#fff" className="material-icons">arrow_back</FontIcon></IconButton></Link>
219219
rightElements = <PageHead />
220220
}
221221
else if(location === '/admin/settings/tokens'){
222222
title = messages.settings_tokens;
223223
}
224224
else if(location === '/admin/settings/tokens/add'){
225225
title = messages.settings_addToken;
226-
leftButton = <IconButton><Link to="/admin/settings/tokens"><FontIcon color="#fff" className="material-icons">arrow_back</FontIcon></Link></IconButton>
226+
leftButton = <Link to="/admin/settings/tokens"><IconButton><FontIcon color="#fff" className="material-icons">arrow_back</FontIcon></IconButton></Link>
227227
}
228228
else if(location.startsWith('/admin/settings/tokens/')){
229229
title = messages.settings_editToken;
230-
leftButton = <IconButton><Link to="/admin/settings/tokens"><FontIcon color="#fff" className="material-icons">arrow_back</FontIcon></Link></IconButton>
230+
leftButton = <Link to="/admin/settings/tokens"><IconButton><FontIcon color="#fff" className="material-icons">arrow_back</FontIcon></IconButton></Link>
231231
}
232232

233233
return (

‎src/admin/client/modules/product-categories/actions.js‎

Lines changed: 21 additions & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -79,7 +79,7 @@ function successReplaceCategory(newParentId) {
7979
}
8080
}
8181

82-
function fetchCategories() {
82+
export function fetchCategories() {
8383
return dispatch => {
8484
dispatch(requestCategories());
8585
return api.product_categories.list()
@@ -150,6 +150,26 @@ export function createCategory() {
150150
}
151151
}
152152

153+
export function deleteImage() {
154+
return (dispatch, getState) => {
155+
const state = getState();
156+
const categoryId = state.productCategories.selectedId;
157+
158+
return api.product_categories.deleteImage(categoryId)
159+
.then(({status, json}) => {
160+
if(status === 200) {
161+
dispatch(fetchCategories());
162+
} else {
163+
throw status
164+
}
165+
})
166+
.catch(error => {
167+
//dispatch error
168+
console.log(error)
169+
});
170+
}
171+
}
172+
153173
export function deleteCategory(id) {
154174
return (dispatch, getState) => {
155175
return api.product_categories.delete(id)

‎src/admin/client/modules/product-categories/edit/components/form.js‎

Lines changed: 21 additions & 17 deletions
Original file line numberDiff line numberDiff line change
@@ -1,7 +1,8 @@
11
import React from 'react'
22
import { Field, reduxForm } from 'redux-form'
3-
import { TextField, Toggle } from 'redux-form-material-ui'
3+
import { TextField } from 'redux-form-material-ui'
44

5+
import { CustomToggle } from 'modules/shared/form'
56
import ImageUpload from 'modules/shared/image-upload'
67
import messages from 'lib/text'
78
import style from './style.css'
@@ -25,12 +26,10 @@ const validate = values => {
2526
return errors
2627
}
2728

28-
const asyncValidate = (values/*, dispatch */) => {
29+
const asyncValidate = (values) => {
2930
return new Promise((resolve, reject) => {
30-
if(!values.slug) {
31-
resolve();
32-
} else {
33-
api.sitemap.retrieve({ path: values.slug })
31+
if(values.slug && values.slug.length > 0) {
32+
api.sitemap.retrieve({ path: '/' + values.slug })
3433
.then(({status, json}) => {
3534
if(status === 404) {
3635
resolve();
@@ -42,11 +41,13 @@ const asyncValidate = (values/*, dispatch */) => {
4241
}
4342
}
4443
});
44+
} else {
45+
resolve();
4546
}
4647
})
4748
}
4849

49-
class Form extends React.Component {
50+
class ProductCategoryEditForm extends React.Component {
5051
constructor(props){
5152
super(props);
5253
}
@@ -58,6 +59,9 @@ class Form extends React.Component {
5859
handleSubmit,
5960
pristine,
6061
submitting,
62+
onCancel,
63+
onImageUpload,
64+
onImageDelete,
6165
isSaving,
6266
initialValues } = this.props;
6367

@@ -74,41 +78,41 @@ class Form extends React.Component {
7478
<Paper className={style.form} zDepth={1}>
7579
<form onSubmit={handleSubmit}>
7680
<div className={style.innerBox}>
77-
<Field name="name" component={TextField} floatingLabelText={messages.productCategories_name+' *'} fullWidth={true}/><br />
78-
<Field name="description" component={TextField} floatingLabelText={messages.description} fullWidth={true} multiLine={true} rows={2}/>
81+
<Field name="name" component={TextField} floatingLabelText={messages.productCategories_name+' *'} fullWidth={true}/>
82+
<Field name="description" component={TextField} floatingLabelText={messages.description} fullWidth={true} multiLine={true} rows={1}/>
7983
<div className={style.shortBox}>
80-
<Field name="enabled" component={Toggle} label={messages.enabled} className={style.toggle}/><br />
84+
<Field name="enabled" component={CustomToggle} label={messages.enabled} className={style.toggle}/>
8185
<ImageUpload
8286
imageUrl={imageUrl}
8387
postUrl={`${settings.apiBaseUrl}/product_categories/${categoryId}/image`}
8488
apiToken={apiToken}
85-
onDelete={() => { api.product_categories.deleteImage(categoryId); }}
86-
onUpload={() => {}}
89+
onDelete={onImageDelete}
90+
onUpload={onImageUpload}
8791
/>
8892
</div>
8993
<div className="blue-title">{messages.seo}</div>
9094
<Field name="slug" component={TextField} floatingLabelText={messages.slug} fullWidth={true}/>
9195
<p className="field-hint">{messages.help_slug}</p>
92-
<Field name="meta_title" component={TextField} floatingLabelText={messages.pageTitle} fullWidth={true}/><br/>
96+
<Field name="meta_title" component={TextField} floatingLabelText={messages.pageTitle} fullWidth={true}/>
9397
<Field name="meta_description" component={TextField} floatingLabelText={messages.metaDescription} fullWidth={true}/>
9498
</div>
9599
<div className="buttons-box">
96-
<FlatButton label={messages.actions_cancel} className={style.button} onClick={() => { this.props.onCancel(); }} />
100+
<FlatButton label={messages.actions_cancel} className={style.button} onClick={onCancel} />
97101
<RaisedButton type="submit" label={messages.actions_save} primary={true} className={style.button} disabled={pristine || submitting || isSaving}/>
98102
</div>
99103
</form>
100104
</Paper>
101105
)
102106
} else {
103-
return <br />
107+
return <div></div>
104108
}
105109
}
106110
}
107111

108112
export default reduxForm({
109-
form: 'FormProductCategory',
113+
form: 'ProductCategoryEditForm',
110114
validate,
111115
asyncValidate,
112116
asyncBlurFields: [ 'slug' ],
113117
enableReinitialize: true
114-
})(Form)
118+
})(ProductCategoryEditForm)

‎src/admin/client/modules/product-categories/edit/index.js‎

Lines changed: 9 additions & 3 deletions
Original file line numberDiff line numberDiff line change
@@ -1,7 +1,7 @@
11
import { connect } from 'react-redux'
22
import { reset } from 'redux-form';
3-
import { updateCategory, deselectCategory } from '../actions'
4-
import Form from './components/form'
3+
import { updateCategory, deselectCategory, fetchCategories, deleteImage } from '../actions'
4+
import ProductCategoryEditForm from './components/form'
55

66
const mapStateToProps = (state) => {
77
return {
@@ -14,6 +14,12 @@ const mapStateToProps = (state) => {
1414

1515
const mapDispatchToProps = (dispatch) => {
1616
return {
17+
onImageDelete: () => {
18+
dispatch(deleteImage());
19+
},
20+
onImageUpload: () => {
21+
dispatch(fetchCategories());
22+
},
1723
onSubmit: (values) => {
1824
delete values.image;
1925
if(!values.slug || values.slug === '') {
@@ -28,4 +34,4 @@ const mapDispatchToProps = (dispatch) => {
2834
}
2935
}
3036

31-
export default connect(mapStateToProps, mapDispatchToProps)(Form);
37+
export default connect(mapStateToProps, mapDispatchToProps)(ProductCategoryEditForm);

‎src/admin/client/modules/product-categories/head/components/buttons.js‎

Lines changed: 6 additions & 15 deletions
Original file line numberDiff line numberDiff line change
@@ -84,28 +84,19 @@ export default class Buttons extends React.Component {
8484
];
8585

8686
return (
87-
<span>
88-
<IconButton touch={true} tooltip={messages.actions_moveUp} onTouchTap={()=>{ onMoveUp() }}>
87+
<span style={{ marginRight: 12 }}>
88+
<IconButton touch={true} tooltip={messages.actions_moveUp} onTouchTap={onMoveUp}>
8989
<FontIcon color="#fff" className="material-icons">arrow_upward</FontIcon>
9090
</IconButton>
91-
<IconButton touch={true} tooltip={messages.actions_moveDown} onTouchTap={()=>{ onMoveDown() }}>
91+
<IconButton touch={true} tooltip={messages.actions_moveDown} onTouchTap={onMoveDown}>
9292
<FontIcon color="#fff" className="material-icons">arrow_downward</FontIcon>
9393
</IconButton>
9494
<IconButton touch={true} tooltip={messages.actions_delete} onTouchTap={this.showDelete}>
9595
<FontIcon color="#fff" className="material-icons">delete</FontIcon>
9696
</IconButton>
97-
<IconMenu
98-
iconButtonElement={
99-
<IconButton touch={true}>
100-
<FontIcon color="#fff" className="material-icons">more_vert</FontIcon>
101-
</IconButton>
102-
}
103-
targetOrigin={{horizontal: 'right', vertical: 'top'}}
104-
anchorOrigin={{horizontal: 'right', vertical: 'top'}}
105-
>
106-
<MenuItem primaryText={messages.actions_moveTo} onTouchTap={this.showMoveTo} />
107-
</IconMenu>
108-
97+
<IconButton touch={true} tooltip={messages.actions_moveTo} onTouchTap={this.showMoveTo}>
98+
<FontIcon color="#fff" className="material-icons">move_to_inbox</FontIcon>
99+
</IconButton>
109100
<Dialog
110101
title={messages.actions_moveTo}
111102
actions={actionsMoveTo}

‎src/admin/client/modules/products/actions.js‎

Lines changed: 4 additions & 2 deletions
Original file line numberDiff line numberDiff line change
@@ -176,10 +176,12 @@ const getFilter = (state, offset = 0) => {
176176
return filter;
177177
}
178178

179-
export function fetchProducts() {
179+
export function fetchProducts(canTakeFromState = false) {
180180
return (dispatch, getState) => {
181181
const state = getState();
182-
if (!state.products.loadingItems) {
182+
if (state.products.loadingItems || (canTakeFromState && state.products.items.length > 0)) {
183+
// do nothing
184+
} else {
183185
dispatch(requestProducts());
184186
dispatch(deselectAllProduct());
185187

‎src/admin/client/modules/products/list/components/head.js‎

Lines changed: 1 addition & 2 deletions
Original file line numberDiff line numberDiff line change
@@ -1,6 +1,5 @@
11
import React from 'react'
22
import Subheader from 'material-ui/Subheader';
3-
import Checkbox from 'material-ui/Checkbox';
43
import messages from 'lib/text'
54

65
const Head = ({ onSelectAll }) => (
@@ -9,7 +8,7 @@ const Head = ({ onSelectAll }) => (
98
<div className="col-xs-6 col--no-gutter">
109
<div className="row row--no-gutter middle-xs">
1110
<div className="col-xs-1 col--no-gutter">
12-
<Checkbox onCheck={(event, isInputChecked) => { onSelectAll(isInputChecked); }} />
11+
<input type="checkbox" onChange={onSelectAll} />
1312
</div>
1413
<div className="col-xs-11">
1514
{messages.products_name}

0 commit comments

Comments
 (0)