myEvents.js
4.27 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
/**
* Created by Cassie on 2018/03/21
*/
import React, { Component } from 'react';
import {
StyleSheet,
ScrollView,
View,
Text,
TouchableOpacity,
Image,
TextInput,
ActivityIndicator,
Keyboard,
} from 'react-native';
import {width,height,zoomW,zoomH} from '../../utils/getSize';
import {getHeaderPadding,xnToast,MD5} from "../../utils/utils";
import xnService from "../../service/AppService";
import md5 from 'md5';
import { NavigationActions } from 'react-navigation';
const bgImg = require('../../img/bgImg.png');
const logo = require('../../img/logo.png');
const phone = require('../../img/phone.png');
const pwd = require('../../img/pwd.png');
const bitmap = require('../../img/bitmap.png');
const phoneRule = /^1[3456789]\d{9}$/;
export default class myEvents extends Component {
static navigationOptions = ({navigation,screenProps}) => ({
headerTitle:'我的事件',
headerLeft:(
<TouchableOpacity style={styles.backWrap} onPress={() => navigation.goBack()}>
<Image source={require('../../img/back_gray.png')} resizeMode="contain" />
</TouchableOpacity>
),
headerRight:(
<View></View>
)
});
constructor(props){
super(props);
this.state = {
itemList:['1','1','1','1','1','1']
};
};
renderItem = (item,index) => {
return (
<View style={{marginTop:index==0?35:10,paddingLeft:15/zoomW,paddingRight:15/zoomW,paddingBottom:13/zoomH,borderBottomWidth:1,borderBottomColor:'#e5e5e5'}}>
<Text style={{color:'#0c50ba',fontSize:13}}>车站事件</Text>
<Text style={{color:'#343434',fontSize:13,marginTop:5/zoomH,marginBottom:10/zoomH}}>事件描述,事件描述,事件描述,事件描述</Text>
<Image style={{width:99/zoomW,height:138/zoomH,backgroundColor:'red',marginBottom:5/zoomH}} resizeMode='cover'/>
<Text style={{color:'#4e7fcc',fontSize:12,marginBottom:3/zoomH}}>1号线徐家汇站台</Text>
<Text style={{color:'#a0a0a0',fontSize:12}}>2018-04-18 11:00-14:00</Text>
<Image style={{marginLeft:8/zoomW}} source={require('../../img/arrowTop.png')} resizeMode='contain'></Image>
<View style={{backgroundColor:'#efefef',width:'100%',padding:7}}>
<Text style={{color:'#104caa',fontSize:12}}>处理意见：<Text style={{color:'#3b3b3b',fontSize:12}}>这里是处理意见</Text></Text>
</View>
</View>
)
}
render(){
return(
<ScrollView style={styles.background} bounces={false}>
<Image style={{width:'100%',height:195/zoomH}} source={require('../../img/myEventsBanner.png')} resizeMode='cover'></Image>
<View style={{position:'absolute',right:14/zoomW,top:136/zoomH,backgroundColor:'#f1f1f1',width:80/zoomW,height:80/zoomW,borderRadius:4,alignItems:'center',justifyContent:'center'}}>
<Image style={{width:74/zoomW,height:74/zoomW}} defaultSource={require('../../img/defultIcon.png')} resizeMode='cover'></Image>
</View>
<Text style={{backgroundColor:'transparent',color:'white',position:'absolute',right:109/zoomW,top:162/zoomH,fontFamily:'PingFangSC-Medium',fontSize:18}}>昵称</Text>
{this.state.itemList.length==0&&<View style={{flexDirection:'row',width:'100%',height:20,justifyContent:'center',alignItems:'flex-start',marginTop:65/zoomH,paddingLeft:15/zoomW,paddingRight:15/zoomW}}>
<View style={{flex:1,height:2/zoomW,backgroundColor:'#d8d8d8',marginRight:14/zoomW}}></View>
<View style={{width:4/zoomW,height:4/zoomW,backgroundColor:'#d8d8d8'}}></View>
<View style={{flex:1,height:2/zoomW,backgroundColor:'#d8d8d8',marginLeft:14/zoomW}}></View>
</View>}
{this.state.itemList.length != 0 && this.state.itemList.map((v, i) => this.renderItem(v, i))}
</ScrollView>
);
}
}
const styles = StyleSheet.create({
backWrap: {
justifyContent: 'center',
paddingLeft: 18.5/zoomW,
paddingRight: 18.5/zoomW,
height: 44/zoomH,
},
background:{
flex:1,
backgroundColor:'#fff',
},
});