Skip to content

Commit 38ef225

Browse files
webdevstarwebdevstar
committed
upload
1 parent 1d66e71 commit 38ef225

4 files changed

Lines changed: 259 additions & 0 deletions

File tree

‎src/admin/client/modules/apps/listHead/components/buttons.js‎

Lines changed: 125 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,125 @@
1+
import React from 'react';
2+
import { Link } from 'react-router-dom';
3+
import messages from 'lib/text';
4+
import GroupSelect from 'modules/customerGroups/select';
5+
import DeleteConfirmation from 'modules/shared/deleteConfirmation';
6+
import FontIcon from 'material-ui/FontIcon';
7+
import IconMenu from 'material-ui/IconMenu';
8+
import IconButton from 'material-ui/IconButton';
9+
import MenuItem from 'material-ui/MenuItem';
10+
import Dialog from 'material-ui/Dialog';
11+
import FlatButton from 'material-ui/FlatButton';
12+
import RaisedButton from 'material-ui/RaisedButton';
13+
import TextField from 'material-ui/TextField';
14+
import Search from './search';
15+
16+
export default class Buttons extends React.Component {
17+
constructor(props) {
18+
super(props);
19+
this.state = {
20+
groupId: null,
21+
openSetGroup: false,
22+
openDelete: false
23+
};
24+
}
25+
26+
showSetGroup = () => {
27+
this.setState({ openSetGroup: true });
28+
};
29+
30+
showDelete = () => {
31+
this.setState({ openDelete: true });
32+
};
33+
34+
closeSetGroup = () => {
35+
this.setState({ openSetGroup: false });
36+
};
37+
38+
closeDelete = () => {
39+
this.setState({ openDelete: false });
40+
};
41+
42+
deleteCustomers = () => {
43+
this.setState({ openDelete: false });
44+
this.props.onDelete();
45+
};
46+
47+
saveSetGroup = () => {
48+
this.setState({ openSetGroup: false });
49+
this.props.onSetGroup(this.state.groupId);
50+
};
51+
52+
selectSetGroup = groupId => {
53+
this.setState({ groupId: groupId });
54+
};
55+
56+
render() {
57+
const { search, setSearch, selectedCount, onDelete } = this.props;
58+
59+
const actionsSetGroup = [
60+
<FlatButton
61+
label={messages.cancel}
62+
onClick={this.closeSetGroup}
63+
style={{ marginRight: 10 }}
64+
/>,
65+
<FlatButton
66+
label={messages.save}
67+
primary={true}
68+
keyboardFocused={true}
69+
onClick={this.saveSetGroup}
70+
/>
71+
];
72+
73+
return (
74+
<span>
75+
<Search value={search} setSearch={setSearch} />
76+
{selectedCount > 0 && (
77+
<span>
78+
<IconButton
79+
touch={true}
80+
tooltipPosition="bottom-left"
81+
tooltip={messages.actions_delete}
82+
onClick={this.showDelete}
83+
>
84+
<FontIcon color="#fff" className="material-icons">
85+
delete
86+
</FontIcon>
87+
</IconButton>
88+
<IconButton
89+
touch={true}
90+
tooltipPosition="bottom-left"
91+
tooltip={messages.customers_setGroup}
92+
onClick={this.showSetGroup}
93+
>
94+
<FontIcon color="#fff" className="material-icons">
95+
folder
96+
</FontIcon>
97+
</IconButton>
98+
<DeleteConfirmation
99+
open={this.state.openDelete}
100+
isSingle={false}
101+
itemsCount={selectedCount}
102+
onCancel={this.closeDelete}
103+
onDelete={this.deleteCustomers}
104+
/>
105+
<Dialog
106+
title={messages.customers_setGroup}
107+
actions={actionsSetGroup}
108+
modal={false}
109+
open={this.state.openSetGroup}
110+
onRequestClose={this.closeSetGroup}
111+
autoScrollBodyContent={true}
112+
>
113+
<GroupSelect
114+
onSelect={this.selectSetGroup}
115+
selectedId={this.state.groupId}
116+
showRoot={true}
117+
showAll={false}
118+
/>
119+
</Dialog>
120+
</span>
121+
)}
122+
</span>
123+
);
124+
}
125+
}

‎src/admin/client/modules/apps/listHead/components/search.js‎

Lines changed: 24 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,24 @@
1+
import React from 'react';
2+
import messages from 'lib/text';
3+
import TextField from 'material-ui/TextField';
4+
5+
export default ({ value, setSearch }) => {
6+
return (
7+
<TextField
8+
value={value}
9+
onChange={(e, v) => {
10+
setSearch(v);
11+
}}
12+
hintText={messages.customers_search}
13+
underlineShow={false}
14+
className="searchField"
15+
hintStyle={{ color: 'rgba(255,255,255,0.4)', textIndent: '16px' }}
16+
inputStyle={{
17+
color: '#fff',
18+
backgroundColor: 'rgba(255,255,255,0.2)',
19+
borderRadius: '4px',
20+
textIndent: '16px'
21+
}}
22+
/>
23+
);
24+
};

‎src/admin/client/modules/apps/listHead/index.js‎

Lines changed: 36 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,36 @@
1+
import React from 'react';
2+
import { connect } from 'react-redux';
3+
import {
4+
fetchCustomers,
5+
deleteCustomers,
6+
setGroup,
7+
setFilterSearch
8+
} from '../actions';
9+
import Buttons from './components/buttons';
10+
11+
const mapStateToProps = state => {
12+
return {
13+
search: state.customers.search,
14+
selectedCount: state.customers.selected.length
15+
};
16+
};
17+
18+
const mapDispatchToProps = dispatch => {
19+
return {
20+
setSearch: value => {
21+
dispatch(setFilterSearch(value));
22+
dispatch(fetchCustomers());
23+
},
24+
onDelete: () => {
25+
dispatch(deleteCustomers());
26+
},
27+
onSetGroup: group_id => {
28+
dispatch(setGroup(group_id));
29+
}
30+
};
31+
};
32+
33+
export default connect(
34+
mapStateToProps,
35+
mapDispatchToProps
36+
)(Buttons);

‎src/admin/client/modules/apps/reducer.js‎

Lines changed: 74 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,74 @@
1+
import * as t from './actionTypes';
2+
3+
const initialState = {
4+
editCustomer: null,
5+
items: [],
6+
selected: [],
7+
hasMore: false,
8+
totalCount: 0,
9+
loadingItems: false,
10+
errorLoadingItems: null,
11+
search: ''
12+
};
13+
14+
export default (state = initialState, action) => {
15+
switch (action.type) {
16+
case t.CUSTOMERS_DETAIL_REQUEST:
17+
return Object.assign({}, state, {});
18+
case t.CUSTOMERS_DETAIL_RECEIVE:
19+
return Object.assign({}, state, {
20+
editCustomer: action.item
21+
});
22+
case t.CUSTOMERS_REQUEST:
23+
return Object.assign({}, state, {
24+
loadingItems: true
25+
});
26+
case t.CUSTOMERS_RECEIVE:
27+
return Object.assign({}, state, {
28+
loadingItems: false,
29+
hasMore: action.has_more,
30+
totalCount: action.total_count,
31+
items: action.data
32+
});
33+
case t.CUSTOMERS_FAILURE:
34+
return Object.assign({}, state, {
35+
loadingItems: false,
36+
errorLoadingItems: action.error
37+
});
38+
case t.CUSTOMERS_SELECT:
39+
return Object.assign({}, state, {
40+
selected: [...state.selected, action.customerId]
41+
});
42+
case t.CUSTOMERS_DESELECT:
43+
return Object.assign({}, state, {
44+
selected: state.selected.filter(id => id !== action.customerId)
45+
});
46+
case t.CUSTOMERS_DESELECT_ALL:
47+
return Object.assign({}, state, {
48+
selected: []
49+
});
50+
case t.CUSTOMERS_SELECT_ALL:
51+
let selected = state.items.map(item => item.id);
52+
return Object.assign({}, state, {
53+
selected: selected
54+
});
55+
case t.CUSTOMERS_FILTER_SET_SEARCH:
56+
return Object.assign({}, state, {
57+
search: action.search
58+
});
59+
case t.CUSTOMERS_MORE_REQUEST:
60+
return Object.assign({}, state, {
61+
loadingItems: true
62+
});
63+
case t.CUSTOMERS_MORE_RECEIVE:
64+
return Object.assign({}, state, {
65+
loadingItems: false,
66+
hasMore: action.has_more,
67+
totalCount: action.total_count,
68+
items: [...state.items, ...action.data]
69+
});
70+
case t.CUSTOMER_DELETE_SUCCESS:
71+
default:
72+
return state;
73+
}
74+
};

0 commit comments

Comments
 (0)