逛列表cell通用兼容,review by 盖剑秋
Showing
26 changed files
with
9 additions
and
243 deletions
@@ -79,6 +79,7 @@ export default class List extends Component { | @@ -79,6 +79,7 @@ export default class List extends Component { | ||
79 | url, | 79 | url, |
80 | share, | 80 | share, |
81 | id, | 81 | id, |
82 | + isFavor, | ||
82 | } = this.props.resource.toJS(); | 83 | } = this.props.resource.toJS(); |
83 | let urlAry = url.split('&'); | 84 | let urlAry = url.split('&'); |
84 | let shareParam = { | 85 | let shareParam = { |
@@ -92,10 +93,10 @@ export default class List extends Component { | @@ -92,10 +93,10 @@ export default class List extends Component { | ||
92 | if (!tagImg) { | 93 | if (!tagImg) { |
93 | tagImg = "../../image/chaopin_icon.png"; | 94 | tagImg = "../../image/chaopin_icon.png"; |
94 | } | 95 | } |
95 | - let likeImg = isPraise == 'N'?require('../../image/wsc_icon.png'):require('../../image/sc_icon.png'); | ||
96 | - let isLike = isPraise == 'N'; | 96 | + let likeImg = isFavor == 'N'?require('../../image/wsc_icon.png'):require('../../image/sc_icon.png'); |
97 | + let isLike = isFavor == 'N'; | ||
97 | return ( | 98 | return ( |
98 | - <TouchableOpacity activeOpacity={0.5} onPress={() => { | 99 | + <TouchableOpacity activeOpacity={1.0} onPress={() => { |
99 | this.props.onPressCell&&this.props.onPressCell(url, this.props.rowID, id); | 100 | this.props.onPressCell&&this.props.onPressCell(url, this.props.rowID, id); |
100 | }}> | 101 | }}> |
101 | <View style={styles.container}> | 102 | <View style={styles.container}> |
@@ -113,10 +114,10 @@ export default class List extends Component { | @@ -113,10 +114,10 @@ export default class List extends Component { | ||
113 | <Text style={styles.text}>{publish_time}</Text> | 114 | <Text style={styles.text}>{publish_time}</Text> |
114 | <Image source={require('../../image/shared_view_icon.png')} style={styles.iconThumb}resizeMode={'contain'}></Image> | 115 | <Image source={require('../../image/shared_view_icon.png')} style={styles.iconThumb}resizeMode={'contain'}></Image> |
115 | <Text style={styles.text}>{views_num}</Text> | 116 | <Text style={styles.text}>{views_num}</Text> |
116 | - <TouchableOpacity style={styles.likeButton} onPress={()=>{this.props.onPressLike&&this.props.onPressLike(id, isLike)}}> | 117 | + <TouchableOpacity activeOpacity={1.0} style={styles.likeButton} onPress={()=>{this.props.onPressLike&&this.props.onPressLike(id, isLike)}}> |
117 | <Image source={likeImg}/> | 118 | <Image source={likeImg}/> |
118 | </TouchableOpacity> | 119 | </TouchableOpacity> |
119 | - <TouchableOpacity style={styles.shareButton} onPress={()=>{this.props.onPressShare&&this.props.onPressShare(shareParam)}}> | 120 | + <TouchableOpacity activeOpacity={1.0} style={styles.shareButton} onPress={()=>{this.props.onPressShare&&this.props.onPressShare(shareParam)}}> |
120 | <Image source={require('../../image/shared_sharebuttom_highlighted.png')}/> | 121 | <Image source={require('../../image/shared_sharebuttom_highlighted.png')}/> |
121 | </TouchableOpacity> | 122 | </TouchableOpacity> |
122 | </View> | 123 | </View> |
@@ -69,7 +69,7 @@ export default function listReducer(state=initialState, action) { | @@ -69,7 +69,7 @@ export default function listReducer(state=initialState, action) { | ||
69 | let originAry = state.get('articles').get('list').toJS(); | 69 | let originAry = state.get('articles').get('list').toJS(); |
70 | for (var i = 0; i < originAry.length; i++) { | 70 | for (var i = 0; i < originAry.length; i++) { |
71 | if (originAry[i].id == article_id) { | 71 | if (originAry[i].id == article_id) { |
72 | - originAry[i].isPraise = isLike?'Y':'N'; | 72 | + originAry[i].isFavor = isLike?'Y':'N'; |
73 | } | 73 | } |
74 | } | 74 | } |
75 | let newState = state.setIn(['articles', 'list'], Immutable.fromJS(originAry)); | 75 | let newState = state.setIn(['articles', 'list'], Immutable.fromJS(originAry)); |
@@ -83,7 +83,7 @@ export default function listReducer(state=initialState, action) { | @@ -83,7 +83,7 @@ export default function listReducer(state=initialState, action) { | ||
83 | return state.setIn(['articles', 'isFetching'], false) | 83 | return state.setIn(['articles', 'isFetching'], false) |
84 | .setIn(['articles', 'error'], action.payload) | 84 | .setIn(['articles', 'error'], action.payload) |
85 | } | 85 | } |
86 | - | 86 | + |
87 | case GET_AUTHOR_REQUEST: { | 87 | case GET_AUTHOR_REQUEST: { |
88 | return state.setIn(['author', 'isFetching'], true) | 88 | return state.setIn(['author', 'isFetching'], true) |
89 | .setIn(['author', 'error'], null); | 89 | .setIn(['author', 'error'], null); |
js/mineGuang/components/ListCell.js
deleted
100644 → 0
1 | -'use strict'; | ||
2 | - | ||
3 | -import React, {Component} from 'react'; | ||
4 | -import ReactNative, { | ||
5 | - View, | ||
6 | - Text, | ||
7 | - Image, | ||
8 | - ListView, | ||
9 | - StyleSheet, | ||
10 | - Dimensions, | ||
11 | - TouchableOpacity, | ||
12 | - InteractionManager, | ||
13 | - Platform, | ||
14 | -} from 'react-native'; | ||
15 | -import {getSlicedUrl} from '../../classify/utils/Utils'; | ||
16 | - | ||
17 | - | ||
18 | - | ||
19 | -export default class List extends Component { | ||
20 | - | ||
21 | - constructor(props) { | ||
22 | - super(props); | ||
23 | - this._renderHeader = this._renderHeader.bind(this); | ||
24 | - this.state = { | ||
25 | - width: Dimensions.get('window').width, | ||
26 | - height: Dimensions.get('window').width, | ||
27 | - }; | ||
28 | - } | ||
29 | - | ||
30 | - componentDidMount() { | ||
31 | - let src = this.props.resource.src; | ||
32 | - let bigPic = getSlicedUrl(src, 640, 640, 2); | ||
33 | - Image.getSize(bigPic, (width, height) => { | ||
34 | - let newWidth = Dimensions.get('window').width; | ||
35 | - let newHeight = Dimensions.get('window').width/width*height; | ||
36 | - this.setState({width: newWidth, height: newHeight }); | ||
37 | - }); | ||
38 | - } | ||
39 | - | ||
40 | - _renderHeader() { | ||
41 | - let {author} = this.props.resource.toJS(); | ||
42 | - if (this.props.type == 'editor' || !author) { | ||
43 | - return null; | ||
44 | - } | ||
45 | - let { | ||
46 | - url, | ||
47 | - avatar, | ||
48 | - name | ||
49 | - } = author; | ||
50 | - return ( | ||
51 | - <TouchableOpacity onPress={()=>{this.props.onPressHeader&&this.props.onPressHeader(url)}}> | ||
52 | - <View style={styles.headerContainer}> | ||
53 | - <Image style={styles.avatar} source={{uri:avatar}}/> | ||
54 | - <Text style={styles.name}>{name}</Text> | ||
55 | - </View> | ||
56 | - </TouchableOpacity> | ||
57 | - ) | ||
58 | - } | ||
59 | - | ||
60 | - render() { | ||
61 | - let tagMap = { | ||
62 | - '潮品' :require('../image/chaopin_icon.png'), | ||
63 | - '话题' :require('../image/huati_icon.png'), | ||
64 | - '潮人' :require('../image/chaoren_icon.png'), | ||
65 | - '搭配' :require('../image/dapei_icon.png'), | ||
66 | - '小贴士' :require('../image/xiaotieshi_icon.png'), | ||
67 | - '专题' :require('../image/zuanti_icon.png') | ||
68 | - }; | ||
69 | - let { | ||
70 | - browse, | ||
71 | - category_name, | ||
72 | - intro, | ||
73 | - isPraise, | ||
74 | - praise_num, | ||
75 | - publish_time, | ||
76 | - src, | ||
77 | - title, | ||
78 | - views_num, | ||
79 | - url, | ||
80 | - share, | ||
81 | - id, | ||
82 | - isFavor, | ||
83 | - } = this.props.resource.toJS(); | ||
84 | - let urlAry = url.split('&'); | ||
85 | - let shareParam = { | ||
86 | - title, | ||
87 | - 'content': intro, | ||
88 | - 'image': src, | ||
89 | - 'url': urlAry[0], | ||
90 | - }; | ||
91 | - let bigPic = getSlicedUrl(src, 640, 640, 2); | ||
92 | - let tagImg = tagMap[category_name]; | ||
93 | - if (!tagImg) { | ||
94 | - tagImg = "../../image/chaopin_icon.png"; | ||
95 | - } | ||
96 | - let likeImg = isFavor == 'N'?require('../image/wsc_icon.png'):require('../image/sc_icon.png'); | ||
97 | - return ( | ||
98 | - <TouchableOpacity activeOpacity={0.5} onPress={() => { | ||
99 | - this.props.onPressCell&&this.props.onPressCell(url, this.props.rowID, id); | ||
100 | - }}> | ||
101 | - <View style={styles.container}> | ||
102 | - <View style={styles.sapatorView}/> | ||
103 | - {this._renderHeader()} | ||
104 | - <Image style={styles.image,{width: this.state.width, height: this.state.height}} source={{uri:bigPic}}> | ||
105 | - <Image style={styles.tagContainer} source={tagImg}> | ||
106 | - <Text style={styles.tagText}>{category_name}</Text> | ||
107 | - </Image> | ||
108 | - </Image> | ||
109 | - <Text style={styles.titleText}>{title}</Text> | ||
110 | - <Text style={styles.contentText} numberOfLines={3}>{intro}</Text> | ||
111 | - <View style={styles.toolContainer}> | ||
112 | - <Image source={require('../image/time_icon.png')} style={styles.iconThumb}resizeMode={'contain'}></Image> | ||
113 | - <Text style={styles.text}>{publish_time}</Text> | ||
114 | - <Image source={require('../image/shared_view_icon.png')} style={styles.iconThumb}resizeMode={'contain'}></Image> | ||
115 | - <Text style={styles.text}>{views_num}</Text> | ||
116 | - <TouchableOpacity style={styles.likeButton} onPress={()=>{this.props.onPressLike&&this.props.onPressLike(id, isFavor)}}> | ||
117 | - <Image source={likeImg}/> | ||
118 | - </TouchableOpacity> | ||
119 | - <TouchableOpacity style={styles.shareButton} onPress={()=>{this.props.onPressShare&&this.props.onPressShare(shareParam)}}> | ||
120 | - <Image source={require('../image/shared_sharebuttom_highlighted.png')}/> | ||
121 | - </TouchableOpacity> | ||
122 | - </View> | ||
123 | - </View> | ||
124 | - </TouchableOpacity> | ||
125 | - | ||
126 | - ); | ||
127 | - } | ||
128 | -} | ||
129 | - | ||
130 | -let {width, height} = Dimensions.get('window'); | ||
131 | - | ||
132 | -let styles = StyleSheet.create({ | ||
133 | - container: { | ||
134 | - flex: 1, | ||
135 | - backgroundColor: 'white', | ||
136 | - }, | ||
137 | - contentContainer: { | ||
138 | - backgroundColor: 'white', | ||
139 | - }, | ||
140 | - sapatorView: { | ||
141 | - backgroundColor: 'white', | ||
142 | - width: width, | ||
143 | - height: 16, | ||
144 | - borderColor: 'rgb(215, 215, 215)', | ||
145 | - borderTopWidth: 1, | ||
146 | - borderBottomWidth: 1, | ||
147 | - }, | ||
148 | - headerContainer: { | ||
149 | - height: 60, | ||
150 | - width: width, | ||
151 | - backgroundColor: 'white', | ||
152 | - flexDirection: 'row', | ||
153 | - }, | ||
154 | - avatar: { | ||
155 | - width: 30, | ||
156 | - height: 30, | ||
157 | - borderRadius: 15, | ||
158 | - marginLeft: 17, | ||
159 | - marginTop: 15, | ||
160 | - }, | ||
161 | - name: { | ||
162 | - fontSize: 17, | ||
163 | - color: 'rgb(83, 83, 83)', | ||
164 | - textAlign: 'left', | ||
165 | - width: width - 80, | ||
166 | - marginTop: 22, | ||
167 | - marginLeft: 17, | ||
168 | - }, | ||
169 | - image: { | ||
170 | - width: width, | ||
171 | - backgroundColor: 'gray', | ||
172 | - height: width, | ||
173 | - }, | ||
174 | - tagContainer: { | ||
175 | - width: 88, | ||
176 | - height: 25, | ||
177 | - alignItems: 'center', | ||
178 | - flexDirection: 'column', | ||
179 | - }, | ||
180 | - tagText: { | ||
181 | - backgroundColor: 'transparent', | ||
182 | - color: 'white', | ||
183 | - fontSize: 15, | ||
184 | - textAlign: 'center', | ||
185 | - paddingTop: 5, | ||
186 | - paddingRight: 20, | ||
187 | - }, | ||
188 | - titleText: { | ||
189 | - backgroundColor: 'white', | ||
190 | - color: 'black', | ||
191 | - fontSize: 22, | ||
192 | - marginLeft: 16, | ||
193 | - width: width -32, | ||
194 | - marginTop: 20, | ||
195 | - }, | ||
196 | - contentText: { | ||
197 | - backgroundColor: 'white', | ||
198 | - color: 'gray', | ||
199 | - fontSize: 14, | ||
200 | - marginLeft: 16, | ||
201 | - width: width - 32, | ||
202 | - lineHeight: 25, | ||
203 | - }, | ||
204 | - likeButton: { | ||
205 | - position: 'absolute', | ||
206 | - width: 17, | ||
207 | - height: 16, | ||
208 | - left: width - 100, | ||
209 | - top:14, | ||
210 | - }, | ||
211 | - shareButton: { | ||
212 | - position: 'absolute', | ||
213 | - width: 44, | ||
214 | - height: 44, | ||
215 | - left: width - 60, | ||
216 | - top:0, | ||
217 | - }, | ||
218 | - toolContainer: { | ||
219 | - flexDirection: 'row', | ||
220 | - height: 45, | ||
221 | - width:width, | ||
222 | - alignItems: 'center', | ||
223 | - marginTop: 5, | ||
224 | - }, | ||
225 | - iconThumb: { | ||
226 | - marginLeft: 16, | ||
227 | - height: 12, | ||
228 | - width:20, | ||
229 | - }, | ||
230 | - text: { | ||
231 | - marginLeft: 5, | ||
232 | - fontSize: 12, | ||
233 | - color: 'gray' | ||
234 | - }, | ||
235 | -}); |
@@ -13,7 +13,7 @@ import { | @@ -13,7 +13,7 @@ import { | ||
13 | } from 'react-native'; | 13 | } from 'react-native'; |
14 | 14 | ||
15 | import {Map} from 'immutable'; | 15 | import {Map} from 'immutable'; |
16 | -import ListCell from './ListCell'; | 16 | +import ListCell from '../../guang/components/list/ListCell'; |
17 | import LoadingIndicator from '../../common/components/LoadingIndicator'; | 17 | import LoadingIndicator from '../../common/components/LoadingIndicator'; |
18 | import LoadMoreIndicator from '../../common/components/LoadMoreIndicator'; | 18 | import LoadMoreIndicator from '../../common/components/LoadMoreIndicator'; |
19 | 19 |
2.47 KB
5.49 KB
2.61 KB
5.48 KB
js/mineGuang/image/dapei_icon@2x.png
deleted
100755 → 0
2.59 KB
js/mineGuang/image/dapei_icon@3x.png
deleted
100755 → 0
5.59 KB
js/mineGuang/image/huati_icon@2x.png
deleted
100755 → 0
2.6 KB
js/mineGuang/image/huati_icon@3x.png
deleted
100755 → 0
5.48 KB
js/mineGuang/image/sc_icon@2x.png
deleted
100755 → 0
1.36 KB
js/mineGuang/image/sc_icon@3x.png
deleted
100755 → 0
1.89 KB
3.61 KB
4.2 KB
3.62 KB
4.17 KB
js/mineGuang/image/time_icon@2x.png
deleted
100644 → 0
1.24 KB
js/mineGuang/image/time_icon@3x.png
deleted
100644 → 0
1.37 KB
js/mineGuang/image/wsc_icon@2x.png
deleted
100755 → 0
1.36 KB
js/mineGuang/image/wsc_icon@3x.png
deleted
100755 → 0
1.89 KB
2.63 KB
5.51 KB
2.68 KB
3.66 KB
-
Please register or login to post a comment