add 发货页面 review by hongmo
Showing
10 changed files
with
487 additions
and
0 deletions
@@ -37,6 +37,7 @@ import requestStatsInitialState from './reducers/requestStats/requestStatsInitia | @@ -37,6 +37,7 @@ import requestStatsInitialState from './reducers/requestStats/requestStatsInitia | ||
37 | import refoundStatisticsInitialState from './reducers/refoundStatistics/refoundStatisticsInitialState'; | 37 | import refoundStatisticsInitialState from './reducers/refoundStatistics/refoundStatisticsInitialState'; |
38 | import transferShipmentInitialState from './reducers/transferShipment/transferShipmentInitialState'; | 38 | import transferShipmentInitialState from './reducers/transferShipment/transferShipmentInitialState'; |
39 | import outOfStockInitialState from './reducers/outOfStock/outOfStockInitialState'; | 39 | import outOfStockInitialState from './reducers/outOfStock/outOfStockInitialState'; |
40 | +import deliverGoodsInitialState from './reducers/deliverGoods/deliverGoodsInitialState'; | ||
40 | 41 | ||
41 | import App from './containers/App'; | 42 | import App from './containers/App'; |
42 | import GuideContainer from './containers/GuideContainer'; | 43 | import GuideContainer from './containers/GuideContainer'; |
@@ -57,6 +58,7 @@ import RequestStatsContainer from './containers/RequestStatsContainer' | @@ -57,6 +58,7 @@ import RequestStatsContainer from './containers/RequestStatsContainer' | ||
57 | import RefoundStatisticsContainer from './containers/RefoundStatisticsContainer' | 58 | import RefoundStatisticsContainer from './containers/RefoundStatisticsContainer' |
58 | import TransferShipmentContainer from './containers/TransferShipmentContainer' | 59 | import TransferShipmentContainer from './containers/TransferShipmentContainer' |
59 | import OutOfStockContainer from './containers/OutOfStockContainer' | 60 | import OutOfStockContainer from './containers/OutOfStockContainer' |
61 | +import DeliverGoodsContainer from './containers/DeliverGoodsContainer' | ||
60 | 62 | ||
61 | import NavBar from './components/NavBar'; | 63 | import NavBar from './components/NavBar'; |
62 | import TabIcon from './containers/TabIcon'; | 64 | import TabIcon from './containers/TabIcon'; |
@@ -282,6 +284,10 @@ export default function native(platform) { | @@ -282,6 +284,10 @@ export default function native(platform) { | ||
282 | component={TransferShipmentContainer} | 284 | component={TransferShipmentContainer} |
283 | title='调拨发货' | 285 | title='调拨发货' |
284 | hideNavBar={false} | 286 | hideNavBar={false} |
287 | + rightTitle='发货' | ||
288 | + onRight={()=>{ | ||
289 | + Actions.DeliverGoods(); | ||
290 | + }} | ||
285 | initial={false} | 291 | initial={false} |
286 | navBar={NavBar} | 292 | navBar={NavBar} |
287 | titleStyle={styles.navTitle} | 293 | titleStyle={styles.navTitle} |
@@ -300,6 +306,21 @@ export default function native(platform) { | @@ -300,6 +306,21 @@ export default function native(platform) { | ||
300 | panHandlers={Platform.OS === 'android' ? null : undefined} | 306 | panHandlers={Platform.OS === 'android' ? null : undefined} |
301 | /> | 307 | /> |
302 | <Scene | 308 | <Scene |
309 | + key="DeliverGoods" | ||
310 | + component={DeliverGoodsContainer} | ||
311 | + hideNavBar={false} | ||
312 | + initial={false} | ||
313 | + navBar={NavBar} | ||
314 | + title='发货' | ||
315 | + rightTitle='提交' | ||
316 | + onRight={()=>{ | ||
317 | + console.log('sssssssssssss');; | ||
318 | + }} | ||
319 | + titleStyle={styles.navTitle} | ||
320 | + type="push" | ||
321 | + panHandlers={Platform.OS === 'android' ? null : undefined} | ||
322 | + /> | ||
323 | + <Scene | ||
303 | key='AboutUs' | 324 | key='AboutUs' |
304 | component={AboutUsContainer} | 325 | component={AboutUsContainer} |
305 | title='关于我们' | 326 | title='关于我们' |
js/components/DeliverGoods/DeliverGoods.js
0 → 100644
1 | +'use strict'; | ||
2 | + | ||
3 | +import React, {Component} from 'react'; | ||
4 | +import LoadMoreIndicator from '../indicator/LoadMoreIndicator'; | ||
5 | +import LoadingIndicator from '../indicator/LoadingIndicator'; | ||
6 | +import moment from 'moment'; | ||
7 | +import DeliverGoodsCell from './DeliverGoodsCell'; | ||
8 | + | ||
9 | +import { | ||
10 | + StyleSheet, | ||
11 | + View, | ||
12 | + Text, | ||
13 | + ListView, | ||
14 | + Image, | ||
15 | + Dimensions, | ||
16 | + TouchableOpacity, | ||
17 | + TextInput, | ||
18 | + Picker, | ||
19 | +} from 'react-native'; | ||
20 | + | ||
21 | +export default class DeliverGoods extends Component { | ||
22 | + | ||
23 | + constructor(props) { | ||
24 | + super (props); | ||
25 | + this.dataSource = new ListView.DataSource({ | ||
26 | + rowHasChanged: (r1, r2) => !Immutable.is(r1, r2), | ||
27 | + }); | ||
28 | + this._renderRow = this._renderRow.bind(this); | ||
29 | + this._picker = this._picker.bind(this); | ||
30 | + this.state = { | ||
31 | + express: '1', | ||
32 | + showPicker: false, | ||
33 | + }; | ||
34 | + } | ||
35 | + | ||
36 | + _renderRow(rowData, sectionID, rowID) { | ||
37 | + return( | ||
38 | + <DeliverGoodsCell /> | ||
39 | + ); | ||
40 | + } | ||
41 | + | ||
42 | + _picker() { | ||
43 | + return ( | ||
44 | + <View style={styles.pickerContainer}> | ||
45 | + <TouchableOpacity onPress={() => { | ||
46 | + this.setState({showPicker: false}); | ||
47 | + }}> | ||
48 | + <View style={styles.pickerSpaceContainer}/> | ||
49 | + </TouchableOpacity> | ||
50 | + <View style={styles.pickerSubContainer}> | ||
51 | + <Picker | ||
52 | + selectedValue={this.state.express} | ||
53 | + onValueChange={(lang) => this.setState({express: lang})}> | ||
54 | + <Picker.Item label="Java" value="java" /> | ||
55 | + <Picker.Item label="1" value="1" /> | ||
56 | + <Picker.Item label="2" value="2" /> | ||
57 | + <Picker.Item label="JavaScript" value="js" /> | ||
58 | + </Picker> | ||
59 | + </View> | ||
60 | + </View> | ||
61 | + ); | ||
62 | + } | ||
63 | + | ||
64 | + render() { | ||
65 | + | ||
66 | + return ( | ||
67 | + <View style={styles.container}> | ||
68 | + <View style={styles.cell0}> | ||
69 | + <Text style={styles.numberName} numberOfLines={1}> | ||
70 | + 物流公司: | ||
71 | + </Text> | ||
72 | + <TouchableOpacity onPress={() => { | ||
73 | + this.setState({showPicker: !this.state.showPicker}); | ||
74 | + }}> | ||
75 | + <View style={styles.pickerView}> | ||
76 | + <Text style={styles.pickerText} numberOfLines={1}> | ||
77 | + {this.state.express} | ||
78 | + </Text> | ||
79 | + </View> | ||
80 | + </TouchableOpacity> | ||
81 | + </View> | ||
82 | + <View style={styles.cell0}> | ||
83 | + <Text style={styles.numberName} numberOfLines={1}> | ||
84 | + 物流单号: | ||
85 | + </Text> | ||
86 | + <TextInput style={styles.numberInputText} | ||
87 | + ref = 'textInput1' | ||
88 | + placeholder={'输入物流单号'} | ||
89 | + /> | ||
90 | + <TouchableOpacity onPress={() => { | ||
91 | + }}> | ||
92 | + <View style={styles.camera}> | ||
93 | + </View> | ||
94 | + </TouchableOpacity> | ||
95 | + </View> | ||
96 | + <View style={styles.cellAddress}> | ||
97 | + <Text style={styles.cellAddressText} numberOfLines={3}> | ||
98 | + 收货地址:南京1号仓库 江苏省南京市江宁区江宁开发经济技术开发区 苏源大道87号YOHO!有货物流中心东一楼 曾庆红 | ||
99 | + </Text> | ||
100 | + </View> | ||
101 | + <ListView | ||
102 | + style={styles.listContainer} | ||
103 | + dataSource={this.dataSource.cloneWithRows([1,1,11,1,1,1,1])} | ||
104 | + renderRow={this._renderRow} | ||
105 | + /> | ||
106 | + {this.state.showPicker ? this._picker() : null} | ||
107 | + </View> | ||
108 | + ); | ||
109 | + } | ||
110 | +} | ||
111 | + | ||
112 | +let {width, height} = Dimensions.get('window'); | ||
113 | +const styles = StyleSheet.create({ | ||
114 | + container: { | ||
115 | + flex: 1, | ||
116 | + backgroundColor: 'white', | ||
117 | + }, | ||
118 | + cell0: { | ||
119 | + width: width, | ||
120 | + height: 50, | ||
121 | + backgroundColor: 'white', | ||
122 | + flexDirection: 'row', | ||
123 | + borderBottomWidth: 1, | ||
124 | + borderBottomColor: 'black', | ||
125 | + alignItems: 'center', | ||
126 | + }, | ||
127 | + | ||
128 | + numberName: { | ||
129 | + backgroundColor: 'transparent', | ||
130 | + fontSize:15, | ||
131 | + alignItems: 'center', | ||
132 | + textAlign: 'left', | ||
133 | + marginLeft: 10, | ||
134 | + }, | ||
135 | + numberInputText:{ | ||
136 | + width: width - 150, | ||
137 | + height: 40, | ||
138 | + backgroundColor:'transparent', | ||
139 | + fontSize:15, | ||
140 | + marginLeft: 5, | ||
141 | + borderWidth: 1, | ||
142 | + borderColor: '#CCC', | ||
143 | + borderRadius: 4, | ||
144 | + marginTop: 5, | ||
145 | + }, | ||
146 | + pickerView: { | ||
147 | + width: width - 150, | ||
148 | + height: 40, | ||
149 | + backgroundColor:'transparent', | ||
150 | + marginLeft: 5, | ||
151 | + borderWidth: 1, | ||
152 | + borderColor: '#CCC', | ||
153 | + borderRadius: 4, | ||
154 | + justifyContent: 'center', | ||
155 | + }, | ||
156 | + pickerText: { | ||
157 | + | ||
158 | + }, | ||
159 | + camera: { | ||
160 | + width: 30, | ||
161 | + height: 30, | ||
162 | + backgroundColor: 'red', | ||
163 | + marginLeft: 10, | ||
164 | + }, | ||
165 | + cellAddress: { | ||
166 | + width: width, | ||
167 | + height: 60, | ||
168 | + backgroundColor: 'white', | ||
169 | + alignItems: 'center', | ||
170 | + justifyContent: 'center', | ||
171 | + }, | ||
172 | + cellAddressText: { | ||
173 | + width: width - 20, | ||
174 | + backgroundColor: 'white', | ||
175 | + fontSize:15, | ||
176 | + alignItems: 'center', | ||
177 | + textAlign: 'left', | ||
178 | + }, | ||
179 | + listContainer: { | ||
180 | + flex: 1, | ||
181 | + }, | ||
182 | + pickerContainer: { | ||
183 | + flex: 1, | ||
184 | + flexDirection: 'column', | ||
185 | + top: 0, | ||
186 | + left: 0, | ||
187 | + width: width, | ||
188 | + height: height , | ||
189 | + position: 'absolute', | ||
190 | + backgroundColor: 'transparent', | ||
191 | + }, | ||
192 | + pickerSpaceContainer: { | ||
193 | + width: width, | ||
194 | + height: height - 400 , | ||
195 | + backgroundColor: 'transparent', | ||
196 | + }, | ||
197 | + pickerSubContainer: { | ||
198 | + flex: 1, | ||
199 | + flexDirection: 'column', | ||
200 | + bottom: 0, | ||
201 | + width: width, | ||
202 | + height: 400 , | ||
203 | + backgroundColor: 'white', | ||
204 | + }, | ||
205 | +}); |
1 | +'use strict'; | ||
2 | + | ||
3 | +import React, {Component} from 'react'; | ||
4 | +import CheckBox from 'react-native-checkbox'; | ||
5 | +import CONFIG from '../../constants/config'; | ||
6 | + | ||
7 | +import { | ||
8 | + StyleSheet, | ||
9 | + View, | ||
10 | + Text, | ||
11 | + ListView, | ||
12 | + Image, | ||
13 | + Dimensions, | ||
14 | + TextInput, | ||
15 | + TouchableOpacity, | ||
16 | +} from 'react-native'; | ||
17 | + | ||
18 | +export default class DeliverGoodsCell extends Component { | ||
19 | + | ||
20 | + constructor(props) { | ||
21 | + super (props); | ||
22 | + } | ||
23 | + | ||
24 | + render() { | ||
25 | + let num = 2; | ||
26 | + let tags = [1,1]; | ||
27 | + | ||
28 | + return ( | ||
29 | + <View style={{width: width,height: headerH + cellH * num,backgroundColor: 'white',}}> | ||
30 | + <View style={styles.header}> | ||
31 | + <Text style={styles.title} numberOfLines={1}>单号:175321</Text> | ||
32 | + </View> | ||
33 | + {tags.map((value, i) => { | ||
34 | + return ( | ||
35 | + <View style={styles.cell}> | ||
36 | + <Text style={styles.cellText1} numberOfLines={1}>SKU:2564123</Text> | ||
37 | + <Text style={styles.cellText2} numberOfLines={1}>商品条码:KT-2017156 红色/L</Text> | ||
38 | + <Text style={styles.cellText3} numberOfLines={1}>当前需发数:5</Text> | ||
39 | + </View> | ||
40 | + ); | ||
41 | + })} | ||
42 | + </View> | ||
43 | + ); | ||
44 | + } | ||
45 | +} | ||
46 | + | ||
47 | +let {width, height} = Dimensions.get('window'); | ||
48 | +let headerH = 30; | ||
49 | +let cellH = 40; | ||
50 | + | ||
51 | +const styles = StyleSheet.create({ | ||
52 | + container: { | ||
53 | + | ||
54 | + }, | ||
55 | + header: { | ||
56 | + width: width, | ||
57 | + height: headerH, | ||
58 | + backgroundColor: 'gray', | ||
59 | + alignItems: 'center', | ||
60 | + justifyContent: 'center', | ||
61 | + }, | ||
62 | + title: { | ||
63 | + fontSize:15, | ||
64 | + alignItems: 'center', | ||
65 | + textAlign: 'left', | ||
66 | + marginLeft: 10, | ||
67 | + width: width-20, | ||
68 | + }, | ||
69 | + cell: { | ||
70 | + width: width, | ||
71 | + height: 40, | ||
72 | + backgroundColor: 'white', | ||
73 | + flexDirection: 'row', | ||
74 | + alignItems: 'center', | ||
75 | + borderBottomWidth: 1, | ||
76 | + borderBottomColor: 'black', | ||
77 | + }, | ||
78 | + cellText1: { | ||
79 | + fontSize:12, | ||
80 | + marginLeft: 10, | ||
81 | + width: Math.ceil((width-20)/3)-30, | ||
82 | + textAlign: 'left', | ||
83 | + color: 'black', | ||
84 | + }, | ||
85 | + cellText2: { | ||
86 | + fontSize:12, | ||
87 | + width: Math.ceil((width-20)/3)+60, | ||
88 | + textAlign: 'center', | ||
89 | + color: 'black', | ||
90 | + }, | ||
91 | + cellText3: { | ||
92 | + fontSize:12, | ||
93 | + width: Math.ceil((width-20)/3)-30, | ||
94 | + textAlign: 'right', | ||
95 | + color: 'black', | ||
96 | + }, | ||
97 | +}); |
@@ -27,6 +27,7 @@ module.exports = { | @@ -27,6 +27,7 @@ module.exports = { | ||
27 | requestStats: 'requestStats', | 27 | requestStats: 'requestStats', |
28 | transferShipment: 'transferShipment', | 28 | transferShipment: 'transferShipment', |
29 | outOfStock: 'outOfStock', | 29 | outOfStock: 'outOfStock', |
30 | + deliverGoods: 'deliverGoods', | ||
30 | }, | 31 | }, |
31 | dateFilterKey: { | 32 | dateFilterKey: { |
32 | date: 1,//天 | 33 | date: 1,//天 |
js/containers/DeliverGoodsContainer.js
0 → 100644
1 | + | ||
2 | +'use strict'; | ||
3 | + | ||
4 | +import React, { Component } from 'react'; | ||
5 | +import Immutable, {List, Record} from 'immutable'; | ||
6 | +import DeliverGoods from '../components/DeliverGoods/DeliverGoods' | ||
7 | + | ||
8 | +import { | ||
9 | + StyleSheet, | ||
10 | + View, | ||
11 | + Text, | ||
12 | + ListView, | ||
13 | + Dimensions, | ||
14 | + Platform, | ||
15 | +} from 'react-native'; | ||
16 | + | ||
17 | +import {bindActionCreators} from 'redux'; | ||
18 | +import {connect} from 'react-redux'; | ||
19 | + | ||
20 | +import {Map} from 'immutable'; | ||
21 | + | ||
22 | +import * as deliverGoodsActions from '../reducers/deliverGoods/deliverGoodsActions'; | ||
23 | + | ||
24 | +const actions = [ | ||
25 | + deliverGoodsActions, | ||
26 | +]; | ||
27 | + | ||
28 | + | ||
29 | +function mapStateToProps(state) { | ||
30 | + return { | ||
31 | + ...state | ||
32 | + } | ||
33 | +}; | ||
34 | + | ||
35 | +function mapDispatchToProps(dispatch) { | ||
36 | + | ||
37 | + const creators = Map() | ||
38 | + .merge(...actions) | ||
39 | + .filter(value => typeof value === 'function') | ||
40 | + .toObject(); | ||
41 | + | ||
42 | + return { | ||
43 | + actions: bindActionCreators(creators, dispatch), | ||
44 | + dispatch | ||
45 | + }; | ||
46 | +} | ||
47 | + | ||
48 | +class DeliverGoodsContainer extends Component { | ||
49 | + | ||
50 | + constructor(props) { | ||
51 | + super(props); | ||
52 | + } | ||
53 | + | ||
54 | + componentDidMount() { | ||
55 | + | ||
56 | + } | ||
57 | + | ||
58 | + componentWillUnmount() { | ||
59 | + | ||
60 | + } | ||
61 | + | ||
62 | + render() { | ||
63 | + return ( | ||
64 | + <View style={styles.container}> | ||
65 | + <DeliverGoods /> | ||
66 | + </View> | ||
67 | + ); | ||
68 | + } | ||
69 | +} | ||
70 | + | ||
71 | +let {width, height} = Dimensions.get('window'); | ||
72 | +let navbarHeight = (Platform.OS === 'android') ? 50 : 64; | ||
73 | + | ||
74 | +let styles = StyleSheet.create({ | ||
75 | + container: { | ||
76 | + top: navbarHeight, | ||
77 | + height: height - navbarHeight, | ||
78 | + paddingBottom: (Platform.OS === 'android') ? 24 : 0, | ||
79 | + }, | ||
80 | + | ||
81 | +}); | ||
82 | + | ||
83 | +export default connect(mapStateToProps, mapDispatchToProps)(DeliverGoodsContainer); |
1 | +/** | ||
2 | + * # guideActions.js | ||
3 | + * | ||
4 | + * App user guide | ||
5 | + * | ||
6 | + */ | ||
7 | +'use strict'; | ||
8 | + | ||
9 | +import {Actions} from 'react-native-router-flux'; | ||
10 | +import DeliverGoodsService from '../../services/DeliverGoodsService'; | ||
11 | +import {Alert, Linking} from 'react-native'; | ||
12 | + | ||
13 | +const { | ||
14 | + | ||
15 | + LOGOUT, | ||
16 | + | ||
17 | +} = require('../../constants/actionTypes').default; |
1 | + | ||
2 | +'use strict'; | ||
3 | +/** | ||
4 | + * ## Imports | ||
5 | + * | ||
6 | + * InitialState | ||
7 | + */ | ||
8 | +import InitialState from './deliverGoodsInitialState'; | ||
9 | + | ||
10 | +import Immutable, {List, Record} from 'immutable'; | ||
11 | + | ||
12 | +const { | ||
13 | + | ||
14 | + LOGOUT, | ||
15 | + | ||
16 | +} = require('../../constants/actionTypes').default; | ||
17 | + | ||
18 | +const initialState = new InitialState; | ||
19 | + | ||
20 | +/** | ||
21 | + * ## guideReducer function | ||
22 | + * @param {Object} state - initialState | ||
23 | + * @param {Object} action - type and payload | ||
24 | + */ | ||
25 | +export default function userReducer(state = initialState, action) { | ||
26 | + if (!(state instanceof InitialState)) return initialState.merge(state); | ||
27 | + | ||
28 | + switch (action.type) { | ||
29 | + case LOGOUT:{ | ||
30 | + return state; | ||
31 | + } | ||
32 | + return state; | ||
33 | + } | ||
34 | + | ||
35 | + return state; | ||
36 | +} |
@@ -23,6 +23,7 @@ import requestStats from './requestStats/requestStatsReducer'; | @@ -23,6 +23,7 @@ import requestStats from './requestStats/requestStatsReducer'; | ||
23 | import refoundStats from './refoundStatistics/refoundStatisticsReducer' | 23 | import refoundStats from './refoundStatistics/refoundStatisticsReducer' |
24 | import transferShipment from './transferShipment/transferShipmentReducer' | 24 | import transferShipment from './transferShipment/transferShipmentReducer' |
25 | import outOfStock from './outOfStock/outOfStockReducer' | 25 | import outOfStock from './outOfStock/outOfStockReducer' |
26 | +import deliverGoods from './deliverGoods/deliverGoodsReducer' | ||
26 | 27 | ||
27 | import { combineReducers } from 'redux'; | 28 | import { combineReducers } from 'redux'; |
28 | 29 | ||
@@ -46,6 +47,7 @@ const rootReducer = combineReducers({ | @@ -46,6 +47,7 @@ const rootReducer = combineReducers({ | ||
46 | refoundStats, | 47 | refoundStats, |
47 | transferShipment, | 48 | transferShipment, |
48 | outOfStock, | 49 | outOfStock, |
50 | + deliverGoods, | ||
49 | }); | 51 | }); |
50 | 52 | ||
51 | export default rootReducer; | 53 | export default rootReducer; |
-
Please register or login to post a comment