API tools faq
paste
Advertisement
enkf

Untitled

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