Authored by 张丽霞

逛列表cell通用兼容,review by 盖剑秋

@@ -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);
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