API tools faq
paste
Advertisement
enkf

Untitled

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