From 4bdedaf1703013cb0d742d65717c351c1c42812e Mon Sep 17 00:00:00 2001
From: xuwenyang <xuwenyang2005@126.com>
Date: Sat, 9 Nov 2019 17:06:37 +0800
Subject: [PATCH] =?UTF-8?q?=E6=8F=90=E9=86=92=20=E8=AF=84=E8=AE=BA?=
 =?UTF-8?q?=E5=92=8Cok=E7=BB=B7=E5=B1=95=E7=A4=BA=E5=A4=B4=E5=83=8F=20?=
 =?UTF-8?q?=E7=82=B9=E5=87=BB=E5=A4=B4=E5=83=8F=E8=BF=9B=E5=85=A5=E5=AF=B9?=
 =?UTF-8?q?=E6=96=B9=E7=94=A8=E6=88=B7=E8=AF=A6=E6=83=85=E9=A1=B5=20?=
 =?UTF-8?q?=E7=82=B9=E5=87=BB=E5=85=B6=E4=BB=96=E5=8C=BA=E5=9F=9F=E8=BF=9B?=
 =?UTF-8?q?=E5=85=A5=E6=97=A5=E8=AE=B0=E8=AF=A6=E6=83=85=E9=A1=B5?=
MIME-Version: 1.0
Content-Type: text/plain; charset=UTF-8
Content-Transfer-Encoding: 8bit

---
 src/component/notification/notification.js    | 66 +++++++++++++------
 .../notification/notificationList.js          | 38 +++++++++--
 src/component/userIcon.js                     |  3 +-
 src/page/NotificationPage.js                  |  9 ---
 4 files changed, 79 insertions(+), 37 deletions(-)

diff --git a/src/component/notification/notification.js b/src/component/notification/notification.js
index a6970cd..619bbde 100644
--- a/src/component/notification/notification.js
+++ b/src/component/notification/notification.js
@@ -2,21 +2,11 @@ import React, {Component} from 'react';
 import {Image, StyleSheet, Text, View, TouchableOpacity} from 'react-native';
 import Ionicons from 'react-native-vector-icons/Ionicons';
 
+import UserIcon from '../userIcon';
 import Touchable from '../touchable';
 import Color from '../../style/color';
 
 
-function unique(array) {
-    let n = [];
-    for(let i=0; i<array.length; i++) {
-        if(n.indexOf(array[i]) == -1) {
-            n.push(array[i])
-        };
-    }
-    
-    return n;
-}
-
 export default class Notification extends Component {
 
     _onDeletePress(msg) {
@@ -47,14 +37,43 @@ export default class Notification extends Component {
     }
 
     renderComment(msg) {
-        const users = unique(msg.list.map(it => it.content.author.name)).join('、');
-        const body = `${users} 回复了你`;
+        const max = 5;
+        const formatMsg = {};
+
+        let key = null;
+        for (let i=0; i<msg.list.length; i++) {
+            key = msg.list[i].link_user_id;
+            if (!formatMsg[key]) {
+                formatMsg[key] = {
+                    userId: msg.list[i].content.author.id,
+                    userIcon: msg.list[i].link_user_icon,
+                    userName: msg.list[i].content.author.name,
+                };
+            }
+        }
 
         return (
             <Touchable key={msg.link_id} onPress={() => this.props.onCommentPress(msg)}>
                 <View style={localStyle.container}>
                     <Ionicons name="ios-text" size={16} style={localStyle.icon} color={Color.light} />
-                    <Text style={localStyle.text}>{body}</Text>
+                    {
+                        Object.keys(formatMsg).map((it, index) => {
+                            if (index >= max) {
+                                return null;
+                            }
+
+                            return (
+                                <UserIcon key={formatMsg[it].userId || index}
+                                    iconUrl={formatMsg[it].userIcon}
+                                    width={24} height={24}
+                                    onPress={() => this.props.onUserIconPress(formatMsg[it])}
+                                />
+                            );
+                        })
+                    }
+                    <Text style={localStyle.text}>
+                        {Object.keys(formatMsg).length > max ? '等' : ''}回复了你
+                    </Text>
                     {this.renderDeleteButton(msg)}
                 </View>
             </Touchable>
@@ -76,7 +95,11 @@ export default class Notification extends Component {
     }
 
     renderLike(msg) {
-        const body = `${msg.content.user.name} 给了你一个OK绷`;
+        const userData = {
+            userId: msg.content.user.id,
+            userIcon: msg.link_user_icon,
+            userName: msg.content.user.name,
+        }
 
         return (
             <Touchable key={msg.link_id} onPress={() => this.props.onLikePress(msg)}>
@@ -88,7 +111,12 @@ export default class Notification extends Component {
                         }
                         style={localStyle.icon2}
                     />
-                    <Text style={localStyle.text}>{body}</Text>
+                    <UserIcon
+                        iconUrl={userData.userIcon}
+                        width={24} height={24}
+                        onPress={() => this.props.onUserIconPress(userData)}
+                    />
+                    <Text style={localStyle.text}>给了你一个OK绷</Text>
                     {this.renderDeleteButton(msg)}
                 </View>
             </Touchable>
@@ -108,17 +136,17 @@ const localStyle = StyleSheet.create({
     icon: {
         marginRight: 10,
         marginTop: 1,
-        lineHeight: 20
+        lineHeight: 28
     },
     text: {
         flex: 1,
-        lineHeight: 20
+        lineHeight: 28
     },
     icon2: {
         width: 15,
         height: 15,
         marginRight: 10,
-        marginTop: 4,
+        marginTop: 7,
     },
     delete: {
         lineHeight: 20,
diff --git a/src/component/notification/notificationList.js b/src/component/notification/notificationList.js
index bec7903..74cb574 100644
--- a/src/component/notification/notificationList.js
+++ b/src/component/notification/notificationList.js
@@ -107,6 +107,29 @@ export default class NotificationList extends Component {
         }
     }
 
+    _onUserIconPress(msg) {
+        Navigation.push(this.props.componentId, {
+            component: {
+                name: 'User',
+                options: {
+                    bottomTabs: {
+                        visible: false,
+
+                        // hide bottom tab for android
+                        drawBehind: true,
+                        animate: true
+                    }
+                },
+                passProps: {
+                    user: {
+                        id: msg.userId,
+                        name: msg.userName,
+                    }
+                }
+            }
+        });
+    }
+
     _onCommentPress(msg) {
         Navigation.push(this.props.componentId, {
             component: {
@@ -160,7 +183,7 @@ export default class NotificationList extends Component {
     _onLikePress(msg) {
         Navigation.push(this.props.componentId, {
             component: {
-                name: 'User',
+                name: 'DiaryDetail',
                 options: {
                     bottomTabs: {
                         visible: false,
@@ -171,7 +194,7 @@ export default class NotificationList extends Component {
                     }
                 },
                 passProps: {
-                    user: msg.content.user
+                    diaryId: msg.content.dairy_id
                 }
             }
         });
@@ -200,11 +223,12 @@ export default class NotificationList extends Component {
                 renderItem={({item}) => {
                     return (
                         <Notification msg={item}
-                                      onCommentPress={this._onCommentPress.bind(this)}
-                                      onFollowPress={this._onFollowPress.bind(this)}
-                                      onLikePress={this._onLikePress.bind(this)}
-                                      onDeletePress={this._onDeletePress.bind(this)}
-                                      showDelete={this.props.isSetRead}
+                              onUserIconPress={this._onUserIconPress.bind(this)}
+                              onCommentPress={this._onCommentPress.bind(this)}
+                              onFollowPress={this._onFollowPress.bind(this)}
+                              onLikePress={this._onLikePress.bind(this)}
+                              onDeletePress={this._onDeletePress.bind(this)}
+                              showDelete={this.props.isSetRead}
                         />
                     );
                 }}
diff --git a/src/component/userIcon.js b/src/component/userIcon.js
index feb6a69..7753a9a 100644
--- a/src/component/userIcon.js
+++ b/src/component/userIcon.js
@@ -24,8 +24,7 @@ export default class UserIcon extends Component {
 
     render() {
         return (
-            <Avatar rounded
-                containerStyle={localStyle.container}
+            <Avatar rounded containerStyle={localStyle.container}
                 width={this.props.width || 40}
                 height={this.props.height || 40}
                 source={{uri: this.state.iconUrl}}
diff --git a/src/page/NotificationPage.js b/src/page/NotificationPage.js
index 29d59ce..c643a5b 100644
--- a/src/page/NotificationPage.js
+++ b/src/page/NotificationPage.js
@@ -40,15 +40,6 @@ export default class NotificationPage extends Component {
     constructor(props) {
         super(props);
         Navigation.events().bindComponent(this);
-
-        // const ds = new ListView.DataSource({
-        //     rowHasChanged: (r1, r2) => r1 !== r2
-        // });
-        // this.state = ({
-        //     messages: [],
-        //     messagesDataSource: ds,
-        //     refreshing: true,
-        // });
     }
 
     navigationButtonPressed({buttonId}) {