mobile / YH_RNComponent · Commits

Go to a project

Authored by 于良
Commit eb3ba0fb9bb43d08452c4cd8e6e943f09eb4def2 1 parent a024265b

详情页评论优化 review by 盖剑秋

Inline Side-by-side
Showing 4 changed files with 83 additions and 107 deletions
@@ -108,7 +108,7 @@ class SubjectPostContainer extends Component { @@ -108,7 +108,7 @@ class SubjectPostContainer extends Component {
108 108
109 onEndReached() { 109 onEndReached() {
110 let item = this.props.subject.items.get(this.sid); 110 let item = this.props.subject.items.get(this.sid);
111 - if (item.commentReachEnd) { 111 + if (item.isCommentsFetching || item.commentReachEnd) {
112 return; 112 return;
113 } 113 }
114 this.props.actions.requestPostComments(this.sid, item.id, item.lastedTime); 114 this.props.actions.requestPostComments(this.sid, item.id, item.lastedTime);
@@ -13,7 +13,7 @@ import { @@ -13,7 +13,7 @@ import {
13 ActionSheetIOS, 13 ActionSheetIOS,
14 Alert, 14 Alert,
15 } from 'react-native'; 15 } from 'react-native';
16 -import timeago from 'timeago.js'; 16 +import timeago from '../../utils/timeago';
17 import HomeService from '../../services/HomeService'; 17 import HomeService from '../../services/HomeService';
18 import SlicedImage from '../../../common/components/SlicedImage'; 18 import SlicedImage from '../../../common/components/SlicedImage';
19 19
@@ -45,6 +45,8 @@ const { @@ -45,6 +45,8 @@ const {
45 SUBJECT_CLEAN, 45 SUBJECT_CLEAN,
46 } = require('../../constants/actionTypes').default; 46 } = require('../../constants/actionTypes').default;
47 47
  48 +const LIMIT = 10;
  49 +
48 export function subjectClean(sid) { 50 export function subjectClean(sid) {
49 return { 51 return {
50 type: SUBJECT_CLEAN, 52 type: SUBJECT_CLEAN,
@@ -194,14 +196,17 @@ export function onRightPressed(sid) { @@ -194,14 +196,17 @@ export function onRightPressed(sid) {
194 } 196 }
195 197
196 export function prepareShareData(sid, postId) { 198 export function prepareShareData(sid, postId) {
197 - return dispatch => { 199 + return (dispatch, getState) => {
  200 + let {app} = getState();
198 let params = { 201 let params = {
199 postsId: postId, 202 postsId: postId,
200 - appType: 1, 203 + appType: app.container,
201 }; 204 };
202 - new PostingService().getShareUrl(params).then(json => { 205 + new PostingService().getShareUrl(params)
  206 + .then(json => {
203 dispatch(shareDataPrepared(sid, json)); 207 dispatch(shareDataPrepared(sid, json));
204 - }).catch(error => { 208 + })
  209 + .catch(error => {
205 210
206 }); 211 });
207 } 212 }
@@ -216,7 +221,7 @@ export function shareDataPrepared(sid, json) { @@ -216,7 +221,7 @@ export function shareDataPrepared(sid, json) {
216 221
217 export function onRight(sid) { 222 export function onRight(sid) {
218 return { 223 return {
219 - type:'SUBJECT_DO_NOTHING', 224 + type:SUBJECT_DO_NOTHING,
220 payload:sid, 225 payload:sid,
221 } 226 }
222 } 227 }
@@ -224,7 +229,7 @@ export function onRight(sid) { @@ -224,7 +229,7 @@ export function onRight(sid) {
224 export function doShare(sid,shareInfo) { 229 export function doShare(sid,shareInfo) {
225 NativeModules.YH_CommunityHelper.showShare(shareInfo); 230 NativeModules.YH_CommunityHelper.showShare(shareInfo);
226 return { 231 return {
227 - type:'SUBJECT_DO_NOTHING', 232 + type:SUBJECT_DO_NOTHING,
228 payload: sid, 233 payload: sid,
229 } 234 }
230 } 235 }
@@ -242,7 +247,7 @@ export function doDelete(sid,postsId, forumCode) { @@ -242,7 +247,7 @@ export function doDelete(sid,postsId, forumCode) {
242 }) 247 })
243 }}]); 248 }}]);
244 return { 249 return {
245 - type:'SUBJECT_DO_NOTHING', 250 + type:SUBJECT_DO_NOTHING,
246 payload:sid, 251 payload:sid,
247 } 252 }
248 } 253 }
@@ -255,49 +260,12 @@ export function doReport(sid, params) { @@ -255,49 +260,12 @@ export function doReport(sid, params) {
255 }); 260 });
256 261
257 return { 262 return {
258 - type:'SUBJECT_DO_NOTHING', 263 + type:SUBJECT_DO_NOTHING,
259 payload:sid, 264 payload:sid,
260 } 265 }
261 } 266 }
262 267
263 -export function contentSuccess(sid,json) {  
264 - return dispatch => {  
265 - let largeImages = [];  
266 - let index=0;  
267 - for (var i = 0; i < json.blocks.length; i++) {  
268 - let item = json.blocks[i];  
269 - if (item.templateKey == 'image') {  
270 - let urlStr = item.contentData||'';  
271 - let imgWidth = 640;  
272 - let imgHeight = imgWidth;  
273 - let sizeStr = item.size || '';  
274 - if (sizeStr.length) {  
275 - let ary=sizeStr.split('x');  
276 - let w = parseInt(ary[0]);  
277 - let h = parseInt(ary[1]);  
278 - if (w&&h) {  
279 - imgHeight = parseInt(imgWidth/w*h);  
280 - }  
281 - }  
282 - let newSrc = urlStr;  
283 - if (urlStr.indexOf('imageView') === -1) {  
284 - newSrc = urlStr + '?imageView2/' + '1' + '/w/' + imgWidth + '/h/' + imgHeight;  
285 - } else {  
286 - newSrc = urlStr.replace('{mode}', '1')  
287 - .replace('{width}', imgWidth)  
288 - .replace('{height}', imgHeight);  
289 - }  
290 - largeImages.push(newSrc);  
291 - json.blocks[i].index=index;  
292 - index++;  
293 - }  
294 - }  
295 - json.largeImages = largeImages;  
296 - dispatch(contentRequestSuccess(sid,json));  
297 - }  
298 -}  
299 -  
300 -export function requestPostContent(sid,postsId) { 268 +export function requestPostContent(sid, postsId) {
301 return (dispatch, getState) => { 269 return (dispatch, getState) => {
302 dispatch(doRequestContent(sid)); 270 dispatch(doRequestContent(sid));
303 let {user} = getState(); 271 let {user} = getState();
@@ -307,12 +275,12 @@ export function requestPostContent(sid,postsId) { @@ -307,12 +275,12 @@ export function requestPostContent(sid,postsId) {
307 .then(json => { 275 .then(json => {
308 let payload = parsePostContent(json); 276 let payload = parsePostContent(json);
309 payload.LZ = uid == payload.authorInfo.uid; 277 payload.LZ = uid == payload.authorInfo.uid;
310 - dispatch(contentSuccess(sid,payload)); 278 + dispatch(contentRequestSuccess(sid, payload));
311 }) 279 })
312 .catch(error => { 280 .catch(error => {
313 Actions.pop(); 281 Actions.pop();
314 - Alert.alert('提示','帖子不存在或已被删除！');  
315 - dispatch(contentRequestFailure(sid,error)); 282 + Alert.alert('提示', '帖子不存在或已被删除！');
  283 + dispatch(contentRequestFailure(sid, error));
316 }); 284 });
317 } 285 }
318 } 286 }
@@ -443,21 +411,30 @@ function getImageSizeFromStr(sizeStr, defaultWidth=320, defaultHeight=320) { @@ -443,21 +411,30 @@ function getImageSizeFromStr(sizeStr, defaultWidth=320, defaultHeight=320) {
443 } 411 }
444 } 412 }
445 413
446 -export function requestPostComments(sid, postsId, lastedTime) {  
447 - return dispatch => { 414 +export function requestPostComments(sid, postsId, lastedTime=0) {
  415 + return (dispatch, getState) => {
  416 + let {subject} = getState();
  417 + let item = subject.items.get(sid);
  418 + if (!item) {
  419 + return;
  420 + }
  421 +
448 dispatch(doRequestComments(sid)); 422 dispatch(doRequestComments(sid));
449 let params = { 423 let params = {
450 postsId, 424 postsId,
451 lastedTime, 425 lastedTime,
452 - limit: 10, 426 + limit: LIMIT,
453 }; 427 };
454 new PostingService().getPostComments(params) 428 new PostingService().getPostComments(params)
455 .then(json => { 429 .then(json => {
456 - dispatch(commentsRequestSuccess(sid,json));  
457 - 430 + let payload = parseComments(json);
  431 + let oldList = item.commentList.toJS();
  432 + let list = [...oldList, ...payload.list];
  433 + payload.list = list;
  434 + dispatch(commentsRequestSuccess(sid, payload));
458 }) 435 })
459 .catch(error => { 436 .catch(error => {
460 - dispatch(commentsRequestFailure(sid,error)); 437 + dispatch(commentsRequestFailure(sid, error));
461 }); 438 });
462 } 439 }
463 } 440 }
@@ -470,43 +447,55 @@ export function doRequestComments(sid) { @@ -470,43 +447,55 @@ export function doRequestComments(sid) {
470 } 447 }
471 448
472 export function commentsRequestSuccess(sid,json) { 449 export function commentsRequestSuccess(sid,json) {
473 - let {list} = json; 450 + return {
  451 + type: SUBJECT_COMMENTS_SUCCESS,
  452 + payload: {sid, json},
  453 + };
  454 +}
  455 +
  456 +function parseComments(json) {
  457 + let {lastedTime, list, total} = json;
474 let newList = []; 458 let newList = [];
475 - list && list.map((obj,i)=> {  
476 - let {createTime, reply, replyTo, blocks,postInfo,id} = obj;  
477 - let timeagoStr = timeago().format(createTime, 'zh_CN'); 459 + list && list.map((obj, i)=> {
  460 + let {createTime, reply, replyTo, blocks, postInfo, id} = obj;
  461 + let timeagoStr = timeago(createTime);
478 let newBlocks = []; 462 let newBlocks = [];
479 blocks && blocks.map((blockItem, i) => { 463 blocks && blocks.map((blockItem, i) => {
480 - let {commentId,contentData,templateKey,orderBy} = blockItem; 464 + let {commentId, contentData, templateKey, orderBy} = blockItem;
481 let newItem = { 465 let newItem = {
482 - "contentData": contentData||'',  
483 - "order": orderBy||'',  
484 - "templateKey": templateKey||'', 466 + "contentData": contentData || '',
  467 + "order": orderBy || 0,
  468 + "templateKey": templateKey || '',
485 }; 469 };
486 newBlocks.push(newItem); 470 newBlocks.push(newItem);
487 }) 471 })
488 - if (replyTo) {  
489 - let nickName = replyTo.nickName||'';  
490 - replyTo.nickName = nickName;  
491 - }  
492 - let newObj={  
493 - commentId: id||'',  
494 - cidTo: reply.uid||'',  
495 - timeago: timeagoStr||'',  
496 - headIcon: reply.headIcon||'',  
497 - nickName: reply.nickName||'',  
498 - LZ:(postInfo.authorUid == reply.uid),  
499 - blocks: newBlocks||[],  
500 - replyTo,  
501 - } 472 +
  473 + let newObj = {
  474 + commentId: id || 0,
  475 + cidTo: reply && reply.uid || 0,
  476 + timeago: timeagoStr || '',
  477 + headIcon: reply && reply.headIcon || '',
  478 + nickName: reply && reply.nickName || '',
  479 + LZ: (postInfo.authorUid == reply.uid),
  480 + blocks: newBlocks,
  481 + replyTo: {
  482 + uid: replyTo && replyTo.uid || 0,
  483 + nickName: replyTo && replyTo.nickName || '',
  484 + headIcon: replyTo && replyTo.headIcon || '',
  485 + signature: replyTo && replyTo.signature || '',
  486 + bgPic: replyTo && replyTo.bgPic || '',
  487 + },
  488 + };
502 newList.push(newObj); 489 newList.push(newObj);
503 }) 490 })
504 491
505 - json.list = newList; 492 + let endReached = newList.length < LIMIT;
506 return { 493 return {
507 - type: SUBJECT_COMMENTS_SUCCESS,  
508 - payload: {sid,json},  
509 - } 494 + lastedTime,
  495 + list: newList,
  496 + endReached,
  497 + total,
  498 + };
510 } 499 }
511 500
512 function createFakeComment() { 501 function createFakeComment() {
@@ -19,7 +19,6 @@ let item = new (Record({ @@ -19,7 +19,6 @@ let item = new (Record({
19 headIcon: '', 19 headIcon: '',
20 nickName: '', 20 nickName: '',
21 uid: 0, 21 uid: 0,
22 - url: ''  
23 })), 22 })),
24 blocks: List(),// contentData order templateKey 23 blocks: List(),// contentData order templateKey
25 browse: 0, 24 browse: 0,
@@ -32,7 +31,7 @@ let item = new (Record({ @@ -32,7 +31,7 @@ let item = new (Record({
32 isIndexTop: false, 31 isIndexTop: false,
33 postsTitle: '', 32 postsTitle: '',
34 praise: 0, 33 praise: 0,
35 - hasPraise:'N', 34 + hasPraise: 'N',
36 revieweState: 0, 35 revieweState: 0,
37 praiseUsers: List(),//headIcon nickName uid 36 praiseUsers: List(),//headIcon nickName uid
38 shareGoods: new(Record({ 37 shareGoods: new(Record({
@@ -40,12 +39,10 @@ let item = new (Record({ @@ -40,12 +39,10 @@ let item = new (Record({
40 productUrl: '', 39 productUrl: '',
41 salesPrice: 0, 40 salesPrice: 0,
42 goodsImage: '', 41 goodsImage: '',
43 - productId:'', 42 + productId: 0,
44 })), 43 })),
45 LZ: false,//楼主 44 LZ: false,//楼主
46 lastedTime: 0, 45 lastedTime: 0,
47 - totalPages: 0,  
48 - currentPage: 0,  
49 commentCount: 0, 46 commentCount: 0,
50 commentList: List(),// 47 commentList: List(),//
51 48
@@ -59,7 +56,7 @@ let item = new (Record({ @@ -59,7 +56,7 @@ let item = new (Record({
59 largeImages:[], 56 largeImages:[],
60 shareUrl: '', 57 shareUrl: '',
61 defaultShareImage: '', 58 defaultShareImage: '',
62 - commentReachEnd:false, 59 + commentReachEnd: false,
63 })); 60 }));
64 61
65 let InitialState = Record({ 62 let InitialState = Record({
@@ -104,25 +104,15 @@ export default function postingReducer(state = initialState, action) { @@ -104,25 +104,15 @@ export default function postingReducer(state = initialState, action) {
104 } 104 }
105 break; 105 break;
106 case SUBJECT_COMMENTS_SUCCESS:{ 106 case SUBJECT_COMMENTS_SUCCESS:{
107 -  
108 - let {sid,json} = action.payload;  
109 - 107 + let {sid, json} = action.payload;
110 let item = state.items.get(sid); 108 let item = state.items.get(sid);
111 - let {lastedTime, total, list, pageSize} = json;  
112 - let tailCount = (total%pageSize)>0?1:0;  
113 - let totalPages = total/pageSize + tailCount;  
114 -  
115 - let existedAry = item.commentList.toJS();  
116 - let nextData = [...existedAry,...list];  
117 - let page = item.currentPage;  
118 - page++;  
119 - let endReached = list.length<10;  
120 - item = item.set('commentList',Immutable.fromJS(nextData))  
121 - .set('lastedTime',lastedTime)  
122 - .set('totalPages',totalPages)  
123 - .set('currentPage',page)  
124 - .set('commentCount',total)  
125 - .set('commentReachEnd',endReached); 109 + let {lastedTime, list, endReached, total} = json;
  110 + item = item.set('isCommentsFetching', false)
  111 + .set('commentsError', null)
  112 + .set('commentList', Immutable.fromJS(list))
  113 + .set('lastedTime', lastedTime)
  114 + .set('commentCount', total)
  115 + .set('commentReachEnd', endReached);
126 let nextState = state.setIn(['items', sid], item); 116 let nextState = state.setIn(['items', sid], item);
127 return nextState; 117 return nextState;
128 } 118 }