From a593225741a5567d902b79b249d5744411669b2a Mon Sep 17 00:00:00 2001 From: xuwenyang Date: Tue, 21 May 2019 02:50:53 +0800 Subject: [PATCH] =?UTF-8?q?1.=20=E6=8F=90=E9=86=92=E5=8E=86=E5=8F=B2?= =?UTF-8?q?=E5=88=97=E8=A1=A8=E5=88=9D=E6=AD=A5=E6=88=90=E5=BD=A2?= MIME-Version: 1.0 Content-Type: text/plain; charset=UTF-8 Content-Transfer-Encoding: 8bit --- src/component/notification/notification.js | 40 +++++++++++ .../notification/notificationList.js | 66 +++++++++++++++++ src/page/NotificationHistoryPage.js | 41 +++++++++++ src/page/NotificationPage.js | 71 +++++++++++++------ src/page/_list.js | 1 + src/util/api.js | 13 +++- 6 files changed, 208 insertions(+), 24 deletions(-) create mode 100644 src/component/notification/notification.js create mode 100644 src/component/notification/notificationList.js create mode 100644 src/page/NotificationHistoryPage.js diff --git a/src/component/notification/notification.js b/src/component/notification/notification.js new file mode 100644 index 0000000..81def5a --- /dev/null +++ b/src/component/notification/notification.js @@ -0,0 +1,40 @@ +import React, {Component} from 'react'; +import {StyleSheet, Text, View} from 'react-native'; +import Ionicons from 'react-native-vector-icons/Ionicons'; + +import Touchable from '../touchable'; +import Color from '../../style/color' + + +export default class Notification extends Component { + + render() { + return ( + {}}> + + + {'XXX 回复了你|关注了你'} + + + ); + } +} + +const localStyle = StyleSheet.create({ + container: { + padding: 20, + borderColor: Color.line, + borderBottomWidth: StyleSheet.hairlineWidth, + flexDirection: 'row' + }, + icon: { + marginRight: 10, + marginTop: 1, + lineHeight: 20 + }, + text: { + flex: 1, + lineHeight: 20 + } +}); \ No newline at end of file diff --git a/src/component/notification/notificationList.js b/src/component/notification/notificationList.js new file mode 100644 index 0000000..b7d11f9 --- /dev/null +++ b/src/component/notification/notificationList.js @@ -0,0 +1,66 @@ +import React, {Component} from 'react'; +import {StyleSheet, Text, View, FlatList, InteractionManager} from 'react-native'; + +import Api from '../../util/api'; +import Notification from './notification'; + + +export default class NotificationList extends Component { + + constructor(props) { + super(props); + + this.state = { + notifications: [], + refreshing: false + }; + } + + componentDidMount(){ + InteractionManager.runAfterInteractions(() => { + this.refresh(); + }); + } + + refresh() { + this.setState({refreshing: true}); + Api.getMessagesHistory() + .then(notifications => { + console.log('notifications:', notifications); + + this.setState({ + notifications + }); + + }).done(() => { + this.setState({refreshing: false}); + }); + } + + render() { + let hasData = this.state.notifications && this.state.notifications.length > 0; + return hasData ? ( + { + return item.id ? item.id.toString() : index + }} + + renderItem={({item}) => { + return ( + + ); + }} + + refreshing={this.state.refreshing} + onRefresh={this.refresh.bind(this)} + + /> + ) : null; + } +} + +const localStyle = StyleSheet.create({ + +}); \ No newline at end of file diff --git a/src/page/NotificationHistoryPage.js b/src/page/NotificationHistoryPage.js new file mode 100644 index 0000000..627c4bd --- /dev/null +++ b/src/page/NotificationHistoryPage.js @@ -0,0 +1,41 @@ +import React, {Component} from 'react'; +import {Platform, StyleSheet, Text, View} from 'react-native'; +import {Navigation} from 'react-native-navigation'; + +import Color from '../style/color'; +import {Icon} from '../style/icon'; + +import NotificationList from '../component/notification/notificationList'; + + +export default class NotificationHistoryPage extends Component { + + constructor(props) { + super(props); + Navigation.events().bindComponent(this); + } + + static options(passProps) { + return { + topBar: { + title: { + text: '提醒历史' + } + } + }; + } + + render() { + return ( + + + + ); + } +} + +const localStyle = StyleSheet.create({ + container: { + flex: 1 + } +}); diff --git a/src/page/NotificationPage.js b/src/page/NotificationPage.js index d4dfac7..0b6897e 100644 --- a/src/page/NotificationPage.js +++ b/src/page/NotificationPage.js @@ -1,33 +1,62 @@ import React, {Component} from 'react'; import {Platform, StyleSheet, Text, View} from 'react-native'; +import {Button} from 'react-native-elements' +import {Navigation} from 'react-native-navigation'; + +import Color from '../style/color' +import {Icon} from '../style/icon' -export default class NotifyPage extends Component { +export default class NotificationPage extends Component { + + constructor(props) { + super(props); + Navigation.events().bindComponent(this); + } + + static options(passProps) { + return { + topBar: { + title: { + text: '提醒' + }, + rightButtons: [{ + id: 'history', + icon: Icon.navButtonTime, + + color: '#aaa' // android + }] + } + }; + } + + navigationButtonPressed({buttonId}) { + Navigation.push(this.props.componentId, { + component: { + name: 'NotificationHistory' + } + }); + } render() { return ( - - Notify Page ! - + + 没有内容 +