notification.js
3.49 KB
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
38
39
40
41
42
43
44
45
46
47
48
49
50
51
52
53
54
55
56
57
58
59
60
61
62
63
64
65
66
67
68
69
70
71
72
73
74
75
76
77
78
79
80
81
82
83
84
85
86
87
88
89
90
91
92
93
94
95
96
97
98
99
100
101
102
103
104
105
106
107
108
109
110
111
112
/**
* Created by Cassie on 2018/05/14
* 通知人员
*/
import React, { Component } from 'react';
import {
StyleSheet,
View,
Image,
ScrollView,
Text,
TextInput,
TouchableOpacity,
InteractionManager
} from 'react-native';
import {StackNavigator} from 'react-navigation';
import ScrollableTabView,{DefaultTabBar} from 'react-native-scrollable-tab-view';
import {width,height,zoomW,zoomH} from '../../utils/getSize';
import {xnToast,xnBorderWidth} from '../../utils/utils';
import NotificationList from './notificationList';
const back = require('../../img/returnB.png');
const search = require('../../img/search.png');
const allDel = require('../../img/allDel.png');
const bread = require('../../img/bread.png');
const avatar = require('../../img/avatar.png');
const addTarget = require('../../img/addTarget.png');
const withdraw = require('../../img/withdraw.png');
export default class Notifications extends Component {
static navigationOptions = ({ navigation, screenProps }) => ({
title: "通知人员",
headerLeft:(<View style={{display:'flex',flexDirection:'row'}} >
<TouchableOpacity style={styles.topIcon} onPress={navigation.state.params?navigation.state.params.back:null}>
<Image source={back} style={{width:(16/zoomH),height:(16/zoomH)}} resizeMode="contain" />
</TouchableOpacity>
</View>),
headerRight:(
<View></View>)
});
constructor(props) {
super(props);
this.state = {
sheetList: [1, 2, 3],
unconfirmedList:[1,1],
confirmedList:[2,1,1,1,1,1,1,1,1,1],
};
}
componentDidMount(){
this.props.navigation.setParams({
addNotice:() => {
InteractionManager.runAfterInteractions(() => {this.props.navigation.navigate('AddNotice');})
},
back:()=>{
this.props.navigation.goBack();
}
});
};
render(){
return(
<View style={styles.background}>
<View style = {{height:xnBorderWidth()}}></View>
<View style = {{height:(10/zoomW),backgroundColor:'#ffffff'}}></View>
<ScrollableTabView renderTabBar={() => <DefaultTabBar style={styles.tabStyle}/>}
tabBarUnderlineStyle={styles.tabBarLine}
tabBarActiveTextColor="#000000"
tabBarInactiveTextColor="#000000"
tabBarTextStyle={{fontSize:14}}
>
<NotificationList tabLabel='1人未确认' unconfirmedList={this.state.unconfirmedList} navigation={this.props.navigation} />
<NotificationList tabLabel='23人已确认' confirmedList={this.state.confirmedList} navigation={this.props.navigation} />
</ScrollableTabView>
</View>
);
}
}
const styles = StyleSheet.create({
topIcon:{
paddingLeft:(10/zoomW),
paddingRight:(10/zoomW),
height:'100%',
display:'flex',
alignItems:'center'
},
background:{
width:'100%',
height:'100%',
backgroundColor:'#ececf1',
},
tabStyle:{
height:(40/zoomH),
backgroundColor:'#ffffff',
elevation:0
},
tabBarLine:{
width:(40/zoomW),
backgroundColor:'#00BE3C',
height:3,
borderRadius:8,
left:'20%',
},
})