API tools faq
paste
Advertisement
enkf

Untitled

enkf
Jan 16th, 2020
114
0
Never
Add comment
Not a member of Pastebin yet? Sign Up, it unlocks many cool features!
text 10.09 KB | None | 0 0
raw download clone embed print report
  1. import React from 'react';
  2. import {
  3. StyleSheet,
  4. View,
  5. Text,
  6. TextInput,
  7. TouchableOpacity,
  8. BackHandler,
  9. Image,
  10. ScrollView,
  11. ActivityIndicator,
  12. FlatList
  13. } from 'react-native';
  14. import {
  15. Container,
  16. Header,
  17. Card,
  18. CardItem,
  19. Button,
  20. Left,
  21. Right,
  22. Body,
  23. Thumbnail,
  24. Icon,
  25. } from 'native-base';
  26. import { withNavigation } from 'react-navigation';
  27.  
  28. class Home extends React.Component {
  29.  
  30. constructor(props) {
  31. super(props);
  32. this.state = {
  33. isLoading: false,
  34. id: '',
  35. card_member:'',
  36. member_code: '',
  37. referral_code: '',
  38. name: '',
  39. place: '',
  40. date_of_birth: '',
  41. religion: '',
  42. address:'',
  43. phone_number: '',
  44. phone_home: '',
  45. phone_office: '',
  46. image: '',
  47. email: '',
  48. password: ''
  49.  
  50.  
  51. };
  52. }
  53.  
  54. static navigationOptions = {
  55. // title: 'Booking',
  56. headerStyle: {
  57. headerTintColor: '#E91E63',
  58. },
  59. headerTitleStyle: {
  60. fontWeight: 'bold',
  61. },
  62. };
  63. ComponentWillMount() {
  64. BackHandler.addEventListener('hardwareBackPress', () => {
  65. if (!this.onMainScreen()) {
  66. this.goBack();
  67. return true;
  68. }
  69. return false;
  70. });
  71. }
  72.  
  73. componentDidMount(){
  74. return fetch('http://192.168.56.1/vzuu/public/api/members')
  75. .then((response) => response.json())
  76. .then((responseJson) => {
  77.  
  78. this.setState({
  79. isLoading: false,
  80. dataSource: responseJson.movies,
  81. name: this.state.name,
  82. phone_number: this.state.phone_number,
  83. image: this.state.image
  84. }, function(){
  85.  
  86. });
  87.  
  88. })
  89. .catch((error) =>{
  90. console.error(error);
  91. });
  92. }
  93.  
  94.  
  95.  
  96. render() {
  97. if(this.state.isLoading){
  98. return(
  99. <View style={{flex: 1, padding: 20}}>
  100. <ActivityIndicator/>
  101. </View>
  102. )
  103. }
  104. return (
  105. <Container>
  106. <View>
  107. <Header style={{ backgroundColor: '#E91E63' }} />
  108. <ScrollView>
  109. <View style={{ flex: 1, alignItems: 'center' }}>
  110. <Text style={{ fontSize: 16 }}>{this.state.curTime}</Text>
  111. </View>
  112. <CardItem>
  113. <View style={{ marginHorizontal: 10 }}></View>
  114. <Left>
  115. <Thumbnail
  116. style={{ width: 80, height: 80 }}
  117. source={require('../asset/images/man-user.png')}
  118. />
  119. <Body>
  120. <Text>Nama</Text>
  121. <Text note>Telp</Text>
  122. <Text>Jumlah Point</Text>
  123. </Body>
  124. </Left>
  125. </CardItem>
  126. <View
  127. style={{
  128. flexDirection: 'row',
  129. flexWrap: 'wrap',
  130. marginHorizontal: 50,
  131. marginTop: 50,
  132. }}></View>
  133. <View
  134. style={{
  135. flexDirection: 'row',
  136. flexWrap: 'wrap',
  137. marginHorizontal: 18,
  138. marginTop: 18,
  139. }}>
  140. <View
  141. style={{
  142. justifyContent: 'space-between',
  143. flexDirection: 'row',
  144. width: '100%',
  145. marginBottom: 18,
  146. }}>
  147. <View>
  148. <TouchableOpacity onPress={() => this.props.navigation.navigate('treatment')}>
  149. <View
  150. style={{
  151. width: 100,
  152. height: 100,
  153. borderWidth: 1,
  154. borderColor: '#EFEFEF',
  155. borderRadius: 18,
  156. }}>
  157. <Image
  158. source={require('../asset/images/color/service.png')}
  159. style={{ height: 80, width: 100, flex: 1 }}
  160. />
  161. </View>
  162. <Text
  163. style={{
  164. fontSize: 12,
  165. fontWeight: 'bold',
  166. textAlign: 'center',
  167. color: '#E91E63',
  168. }}>
  169. Treatment
  170. </Text>
  171. </TouchableOpacity>
  172. </View>
  173. <View>
  174. <TouchableOpacity onPress={() => this.props.navigation.navigate('booking')}>
  175. <View
  176. style={{
  177. width: 100,
  178. height: 100,
  179. borderWidth: 1,
  180. borderColor: '#EFEFEF',
  181. borderRadius: 18,
  182. }}>
  183. <Image
  184. source={require('../asset/images/color/booking.png')}
  185. style={{ height: 80, width: 100, flex: 1 }}
  186. />
  187. </View>
  188. <Text
  189. style={{
  190. fontSize: 12,
  191. fontWeight: 'bold',
  192. textAlign: 'center',
  193. color: '#E91E63',
  194. }}>
  195. Booking
  196. </Text>
  197. </TouchableOpacity>
  198. </View>
  199. <View>
  200. <TouchableOpacity onPress={() => this.props.navigation.navigate('promotion')}>
  201. <View
  202. style={{
  203. width: 100,
  204. height: 100,
  205. borderWidth: 1,
  206. borderColor: '#EFEFEF',
  207. borderRadius: 18,
  208. }}>
  209. <Image
  210. source={require('../asset/images/color/promo.png')}
  211. style={{ height: 80, width: 100, flex: 1 }}
  212. />
  213. </View>
  214. <Text
  215. style={{
  216. fontSize: 12,
  217. fontWeight: 'bold',
  218. textAlign: 'center',
  219. color: '#E91E63',
  220. }}>
  221. Promotion
  222. </Text>
  223. </TouchableOpacity>
  224. </View>
  225. </View>
  226. </View>
  227.  
  228. <View
  229. style={{
  230. flexDirection: 'row',
  231. flexWrap: 'wrap',
  232. marginHorizontal: 18,
  233. marginTop: 18,
  234. }}>
  235. <View
  236. style={{
  237. justifyContent: 'space-between',
  238. flexDirection: 'row',
  239. width: '100%',
  240. marginBottom: 18,
  241. }}>
  242. <View>
  243. <TouchableOpacity onPress={() => this.props.navigation.navigate('point')}>
  244. <View
  245. style={{
  246. width: 100,
  247. height: 100,
  248. borderWidth: 1,
  249. borderColor: '#EFEFEF',
  250. borderRadius: 18,
  251. }}>
  252. <Image
  253. source={require('../asset/images/color/point.png')}
  254. style={{ height: 80, width: 100, flex: 1 }}
  255. />
  256. </View>
  257. <Text
  258. style={{
  259. fontSize: 12,
  260. fontWeight: 'bold',
  261. textAlign: 'center',
  262. color: '#E91E63',
  263. }}>
  264. Point
  265. </Text>
  266. </TouchableOpacity>
  267. </View>
  268. <View>
  269. <TouchableOpacity>
  270. <View
  271. style={{
  272. width: 100,
  273. height: 100,
  274. borderWidth: 1,
  275. borderColor: '#EFEFEF',
  276. borderRadius: 18,
  277. }}>
  278. <Image
  279. source={require('../asset/images/color/spin.png')}
  280. style={{ height: 80, width: 100, flex: 1 }}
  281. />
  282. </View>
  283. <Text
  284. style={{
  285. fontSize: 12,
  286. fontWeight: 'bold',
  287. textAlign: 'center',
  288. color: '#E91E63',
  289. }}>
  290. Spin
  291. </Text>
  292. </TouchableOpacity>
  293. </View>
  294. <View>
  295. <TouchableOpacity onPress={() => this.props.navigation.navigate('contact')}>
  296. <View
  297. style={{
  298. width: 100,
  299. height: 100,
  300. borderWidth: 1,
  301. borderColor: '#EFEFEF',
  302. borderRadius: 18,
  303. }}>
  304. <Image
  305. source={require('../asset/images/color/contact.png')}
  306. style={{ height: 80, width: 100, flex: 1 }}
  307. />
  308. </View>
  309. <Text
  310. style={{
  311. fontSize: 12,
  312. fontWeight: 'bold',
  313. textAlign: 'center',
  314. color: '#E91E63',
  315. }}>
  316. Contact
  317. </Text>
  318. </TouchableOpacity>
  319. </View>
  320. </View>
  321. </View>
  322. </ScrollView>
  323. </View>
  324. </Container>
  325. );
  326. }
  327. }
  328.  
  329.  
  330. export default withNavigation(Home);
  331. const styles = StyleSheet.create({
  332. container: {
  333. flex: 1,
  334. justifyContent: 'center',
  335. alignItems: 'center',
  336. },
  337. });
Advertisement
Add Comment
Please, Sign In to add comment
Advertisement
Public Pastes
Advertisement
We use cookies for various purposes including analytics. By continuing to use Pastebin, you agree to our use of cookies as described in the Cookies Policy.  OK, I Understand
Not a member of Pastebin yet?
Sign Up, it unlocks many cool features!