提醒增加删除功能

This commit is contained in:
mx1700 2019-07-28 20:50:26 +08:00
parent 84c9144140
commit b22c1b454d
2 changed files with 33 additions and 4 deletions

View file

@ -1,5 +1,5 @@
import React, {Component} from 'react'; import React, {Component} from 'react';
import {Image, StyleSheet, Text, View} from 'react-native'; import {Image, StyleSheet, Text, View, TouchableOpacity} from 'react-native';
import Ionicons from 'react-native-vector-icons/Ionicons'; import Ionicons from 'react-native-vector-icons/Ionicons';
import Touchable from '../touchable'; import Touchable from '../touchable';
@ -19,6 +19,10 @@ function unique(array) {
export default class Notification extends Component { export default class Notification extends Component {
_onDeletePress(msg) {
this.props.onDeletePress && this.props.onDeletePress(msg)
}
render() { render() {
let msg = this.props.msg; let msg = this.props.msg;
if(msg && msg.type) { if(msg && msg.type) {
@ -35,6 +39,14 @@ export default class Notification extends Component {
return null; return null;
} }
renderDeleteButton(msg) {
return this.props.showDelete ? (
<TouchableOpacity onPress={() => this._onDeletePress(msg)}>
<Ionicons name="md-close" size={16} style={localStyle.delete} color={Color.inactiveText} />
</TouchableOpacity>
) : null;
}
renderComment(msg) { renderComment(msg) {
const users = unique(msg.list.map(it => it.content.author.name)).join('、'); const users = unique(msg.list.map(it => it.content.author.name)).join('、');
const body = `${users} 回复了你`; const body = `${users} 回复了你`;
@ -44,6 +56,7 @@ export default class Notification extends Component {
<View style={localStyle.container}> <View style={localStyle.container}>
<Ionicons name="ios-text" size={16} style={localStyle.icon} color={Color.light} /> <Ionicons name="ios-text" size={16} style={localStyle.icon} color={Color.light} />
<Text style={localStyle.text}>{body}</Text> <Text style={localStyle.text}>{body}</Text>
{this.renderDeleteButton(msg)}
</View> </View>
</Touchable> </Touchable>
) )
@ -57,6 +70,7 @@ export default class Notification extends Component {
<View style={localStyle.container}> <View style={localStyle.container}>
<Ionicons name="ios-heart" size={16} style={localStyle.icon} color='#d9534f' /> <Ionicons name="ios-heart" size={16} style={localStyle.icon} color='#d9534f' />
<Text key={msg.link_id} style={localStyle.text}>{body}</Text> <Text key={msg.link_id} style={localStyle.text}>{body}</Text>
{this.renderDeleteButton(msg)}
</View> </View>
</Touchable> </Touchable>
) )
@ -76,10 +90,13 @@ export default class Notification extends Component {
style={localStyle.icon2} style={localStyle.icon2}
/> />
<Text style={localStyle.text}>{body}</Text> <Text style={localStyle.text}>{body}</Text>
{this.renderDeleteButton(msg)}
</View> </View>
</Touchable> </Touchable>
) )
} }
} }
const localStyle = StyleSheet.create({ const localStyle = StyleSheet.create({
@ -104,4 +121,8 @@ const localStyle = StyleSheet.create({
marginRight: 10, marginRight: 10,
marginTop: 4, marginTop: 4,
}, },
delete: {
lineHeight: 20,
paddingHorizontal: 8,
}
}); });

View file

@ -179,6 +179,12 @@ export default class NotificationList extends Component {
} }
} }
_onDeletePress(msg) {
if(this.props.isSetRead) {
this._setRead(msg);
}
}
render() { render() {
let hasData = this.state.notifications && this.state.notifications.length > 0; let hasData = this.state.notifications && this.state.notifications.length > 0;
return hasData ? ( return hasData ? (
@ -192,10 +198,12 @@ export default class NotificationList extends Component {
renderItem={({item}) => { renderItem={({item}) => {
return ( return (
<Notification msg={item} <Notification msg={item}
onCommentPress={this._onCommentPress.bind(this)} onCommentPress={this._onCommentPress.bind(this)}
onFollowPress={this._onFollowPress.bind(this)} onFollowPress={this._onFollowPress.bind(this)}
onLikePress={this._onLikePress.bind(this)} onLikePress={this._onLikePress.bind(this)}
></Notification> onDeletePress={this._onDeletePress.bind(this)}
showDelete={this.props.isSetRead}
/>
); );
}} }}