-
Notifications
You must be signed in to change notification settings - Fork 0
Commit
This commit does not belong to any branch on this repository, and may belong to a fork outside of the repository.
- Loading branch information
admin
committed
Jan 14, 2023
1 parent
768ecf8
commit 23624c6
Showing
6 changed files
with
280 additions
and
20 deletions.
There are no files selected for viewing
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
| Original file line number | Diff line number | Diff line change |
|---|---|---|
| @@ -0,0 +1,162 @@ | ||
| import AsyncStorage from "@react-native-async-storage/async-storage"; | ||
| import { Base_Url } from "../../constants/const"; | ||
| import React, { useEffect, useState } from "react"; | ||
| import { StyleSheet, Text, TextInput, TouchableOpacity, View } from "react-native"; | ||
| import Ionicons from 'react-native-vector-icons/Ionicons' | ||
| import axios from "axios"; | ||
| import DropDownPicker from 'react-native-dropdown-picker'; | ||
| import Loading from "../../components/loading/index"; | ||
| import { useNavigation } from "@react-navigation/native"; | ||
|
|
||
| const SuggestScreen = () => { | ||
| const [open, setOpen] = useState(false); | ||
| const [value, setValue] = useState(null); | ||
| const [items, setItems] = useState([]); | ||
| const [input, setInput] = useState(''); | ||
| const [loading, setLoading] = useState(false); | ||
| const navigation = useNavigation(); | ||
|
|
||
| const getAllCity = async () => { | ||
| const tokenNew = await AsyncStorage.getItem('storage_Key'); | ||
| try { | ||
| const response = await axios.get(`${Base_Url}/v1/city/getAllCity`, { | ||
| headers: { | ||
| Authorization: `Bearer ${tokenNew}`, | ||
| }, | ||
| }); | ||
|
|
||
| const tmp = []; | ||
| response.data.map((item) => { | ||
| tmp.push({ | ||
| label: item.name, | ||
| value: item.cityId | ||
| }) | ||
| }) | ||
| setItems(tmp) | ||
| } catch (error) { } | ||
| }; | ||
|
|
||
| const suggest = async () => { | ||
| try { | ||
|
|
||
| setLoading(true) | ||
| const tokenNew = await AsyncStorage.getItem('storage_Key'); | ||
| const obj = { | ||
| price: input, | ||
| place: String(value) | ||
| }; | ||
|
|
||
| console.log('obj', obj) | ||
| const response = await axios.post( | ||
| 'http://10.0.2.2:8080/v1/tour/getTourForOptionPerson', | ||
| obj, { | ||
| headers: { | ||
| Authorization: `Bearer ${tokenNew}`, | ||
| }, | ||
| }, | ||
| ); | ||
| console.log('responseeee', response.data); | ||
| setTimeout(() => { | ||
| setLoading(false) | ||
| navigation.navigate('SuggestScreenDetail' as never, {item: response.data} as never) | ||
| }, 1000) | ||
| } catch (error) { | ||
| setLoading(false) | ||
| } | ||
| } | ||
|
|
||
| useEffect(() => { | ||
| getAllCity(); | ||
| }, []) | ||
|
|
||
|
|
||
| return ( | ||
| <View style={styles.container}> | ||
| <View style={styles.containerHeader}> | ||
| <Ionicons name='chevron-back-outline' size={20} onPress= {() => navigation.goBack()} /> | ||
| <Text style={styles.colorHeader}>Xem gợi ý</Text> | ||
| <Text /> | ||
| </View> | ||
|
|
||
| {loading && ( | ||
| <Loading /> | ||
| )} | ||
|
|
||
| <View style={styles.containerContent}> | ||
| <View style={styles.viewDropdown}> | ||
| <Text style={styles.titlePlace}>Chọn địa điểm bạn muốn đến </Text> | ||
| <DropDownPicker | ||
| open={open} | ||
| value={value} | ||
| items={items} | ||
| setOpen={setOpen} | ||
| setValue={setValue} | ||
| setItems={setItems} | ||
| style={styles.dropdown} | ||
| dropDownContainerStyle={styles.dropdown} | ||
| placeholderStyle={{ color: '#989898' }} | ||
| placeholder={'Địa điểm'} | ||
| /> | ||
| </View> | ||
| <View style={styles.viewDropdown}> | ||
| <Text style={styles.titlePlace}>Nhập tầm giá bạn muốn đi </Text> | ||
| <TextInput style={styles.input} placeholder='Giá' placeholderTextColor={'black'} value={input} onChangeText={(text) => setInput(text)} /> | ||
| </View> | ||
|
|
||
|
|
||
| </View> | ||
| <View style={styles.containerClick}> | ||
| <TouchableOpacity style={styles.blockClick} onPress={() => suggest()}> | ||
| <Text style={styles.white}>Xem gợi ý</Text> | ||
| </TouchableOpacity> | ||
| </View> | ||
| </View> | ||
| ) | ||
| } | ||
|
|
||
| const styles = StyleSheet.create({ | ||
| container: { | ||
| width: '100%', height: '100%', | ||
| }, | ||
| containerHeader: { | ||
| width: '100%', | ||
| height: 60, flexDirection: 'row', | ||
| backgroundColor: 'white', | ||
| justifyContent: 'space-between', | ||
| alignItems: 'center', | ||
| paddingHorizontal: 10 | ||
| }, | ||
| colorHeader: { | ||
| color: 'black', | ||
| fontSize: 14 | ||
| }, | ||
| containerContent: { | ||
| width: '100%', | ||
| height: '100%', | ||
| marginTop: 20 | ||
| }, | ||
| viewDropdown: { width: '100%', paddingHorizontal: 12, marginTop: 15, marginBottom: 10 }, | ||
| dropdown: { | ||
| // minHeight:20, | ||
| borderColor: '#989898', | ||
| zIndex: 1 | ||
| }, | ||
| titlePlace: { | ||
| color: 'black', | ||
| marginBottom: 15 | ||
| }, | ||
| input: { | ||
| borderWidth: 1, | ||
| borderColor: '#989898', | ||
| borderRadius: 9, | ||
| paddingLeft: 9, | ||
| color: 'black', | ||
| backgroundColor: 'white' | ||
| }, | ||
| containerClick: { position: 'absolute', bottom: 30, left: 0, right: 0, zIndex: 99, paddingHorizontal: 10, width: '100%', height: 45 }, | ||
| blockClick: { width: '100%', height: '100%', borderRadius: 9, justifyContent: 'center', alignItems: 'center', backgroundColor: '#FF5F24' }, | ||
| white: { color: 'white' } | ||
|
|
||
| }) | ||
|
|
||
| export default SuggestScreen; |
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
| Original file line number | Diff line number | Diff line change |
|---|---|---|
| @@ -0,0 +1,74 @@ | ||
| import React from "react"; | ||
| import { FlatList, Image, StyleSheet, Text, TouchableOpacity, View } from "react-native"; | ||
| import Ionicons from 'react-native-vector-icons/Ionicons' | ||
| import { useNavigation } from "@react-navigation/native"; | ||
|
|
||
| const SuggestScreenDetail = ({ route }) => { | ||
| const { item } = route.params; | ||
| const navigation = useNavigation(); | ||
|
|
||
| return ( | ||
| <View style={styles.container}> | ||
| <View style={styles.containerHeader}> | ||
| <Ionicons name='chevron-back-outline' size={20} onPress= {() => navigation.goBack()} /> | ||
| <Text style={styles.colorHeader}>Xem gợi ý</Text> | ||
| <Text /> | ||
| </View> | ||
|
|
||
| <View style={styles.contentContainer}> | ||
|
|
||
| <FlatList data={item} renderItem={( itemData) => { | ||
| const itemVert = itemData.item; | ||
| const regex = /(<([^>]+)>)/gi; | ||
| const result = itemVert?.item.description?.replace(regex, ''); | ||
| console.log('item vr', itemVert) | ||
| return ( | ||
| <TouchableOpacity style={styles.containerList} onPress={() => navigation.navigate('RecentScheduleDetailV2' as never, {item:itemData} as never)}> | ||
| <View style={styles.listLeft}> | ||
| <Image source={{ uri: itemVert.item.thumbnail[0].url }} style={styles.fullWidth} /> | ||
| </View> | ||
| <View style={styles.listRight}> | ||
| <Text style={styles.colorHeader}>{itemVert.item.tour_name}</Text> | ||
| <Text numberOfLines={2}>{result}</Text> | ||
| <Text>{itemData.item.nameCIty}</Text> | ||
| </View> | ||
|
|
||
| </TouchableOpacity> | ||
| ) | ||
| }} /> | ||
|
|
||
| </View> | ||
| </View> | ||
| ) | ||
| } | ||
|
|
||
| const styles = StyleSheet.create({ | ||
| container: { | ||
| flex: 1, | ||
| }, | ||
| containerHeader: { | ||
| width: '100%', | ||
| height: 60, flexDirection: 'row', | ||
| backgroundColor: 'white', | ||
| justifyContent: 'space-between', | ||
| alignItems: 'center', | ||
| paddingHorizontal: 10 | ||
| }, | ||
| colorHeader: { | ||
| color: 'black', | ||
| fontSize: 14 | ||
| }, | ||
|
|
||
| contentContainer: { | ||
| width: '100%', | ||
| height: '100%', | ||
| marginTop: 10, | ||
| paddingHorizontal: 10 | ||
| }, | ||
| containerList: { width: '100%', height: 150, backgroundColor: 'white', flexDirection: 'row', borderRadius: 9, marginTop: 20 }, | ||
| listLeft: { width: '30%', height: '100%' }, | ||
| listRight: { width: '70%', height: '100%', flexDirection: 'column', justifyContent: 'space-evenly', paddingHorizontal: 15 }, | ||
| fullWidth: { width: '100%', height: '100%', borderRadius: 9 } | ||
| }) | ||
|
|
||
| export default SuggestScreenDetail |
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters