Commit 08710027 by Giang Tran

add feedback

parent 8f843cc6
import React from 'react'; import React from 'react';
import {Alert} from 'react-native';
import FeedbackView from './FeedbackView'; import FeedbackView from './FeedbackView';
import {connect} from 'react-redux';
import {sendFeedBack} from '../../apis/Functions/General';
import {showLoading, hideLoading} from '../../actions/loadingAction';
import I18n from '../../helper/i18/i18n';
import {useNavigation} from '@react-navigation/native';
const Feedback = (props) => { const Feedback = (props) => {
return <FeedbackView />; const naviation = useNavigation();
const onClickSend = async (star_rate, imageAdd, txtInput) => {
console.log(star_rate, imageAdd, txtInput);
props.showLoading();
const res = await sendFeedBack(
createFormData(imageAdd, {
star_rate,
platform: Platform.OS,
message: txtInput,
}),
);
console.log('upload avatar', res);
props.hideLoading();
if (res?.status == 200 && res.data) {
if (res.data.code == 200) {
naviation.goBack();
setTimeout(() => {
Alert.alert(I18n.t('Notification'), res.data.message);
}, 500);
} else {
setTimeout(() => {
Alert.alert(I18n.t('Notification'), res.data.message);
}, 500);
}
} else {
setTimeout(() => {
Alert.alert(I18n.t('Notification'), 'upload fail');
}, 500);
}
};
const createFormData = (photo, body) => {
const data = new FormData();
if (photo) {
data.append('image_attach_file', {
name: 'sign_img.jpg',
type: 'image/jpg',
uri: Platform.OS === 'android' ? photo : photo.replace('file://', ''),
});
}
Object.keys(body).forEach((key) => {
data.append(key, body[key]);
});
return data;
};
return <FeedbackView onClickSend={onClickSend} />;
}; };
export default Feedback; const mapStateToProps = (state) => {
return {
user: state.userReducer,
};
};
export default connect(mapStateToProps, {showLoading, hideLoading})(Feedback);
...@@ -14,52 +14,30 @@ import { ...@@ -14,52 +14,30 @@ import {
Keyboard, Keyboard,
} from 'react-native'; } from 'react-native';
import HeaderBack from '../../components/Header/HeaderBack'; import HeaderBack from '../../components/Header/HeaderBack';
import RadioForm, {
RadioButton,
RadioButtonInput,
RadioButtonLabel,
} from 'react-native-simple-radio-button';
import PickerImg from '../../components/Picker/PickerImg'; import PickerImg from '../../components/Picker/PickerImg';
import {HEIGHTXD, WIDTHXD, getFontXD} from '../../Config/Functions';
import R from '../../assets/R'; import R from '../../assets/R';
import Button from '../../components/Button'; import Button from '../../components/Button';
import I18n from '../../helper/i18/i18n'; import I18n from '../../helper/i18/i18n';
import AppText from '../../components/AppText'; import AppText from '../../components/AppText';
import {Rating, AirbnbRating} from 'react-native-ratings'; import {Rating, AirbnbRating} from 'react-native-ratings';
const radio_props = [
{label: I18n.t('VeryBad'), value: 0},
{label: I18n.t('Bad'), value: 1},
{label: I18n.t('Normal'), value: 2},
{label: I18n.t('Good'), value: 3},
{label: I18n.t('VeryGood'), value: 4},
];
const FeedbackView = (props) => { const FeedbackView = (props) => {
const [isSelected, setIsSelected] = useState('');
const [txtInput, setTxtInput] = useState(''); const [txtInput, setTxtInput] = useState('');
const [imageAdd, setImageAdd] = useState([]); const [imageAdd, setImageAdd] = useState('');
const [star_rate, setStarRate] = useState(5);
const onPress = (value) => { const onPress = (value) => {
setIsSelected(value); setIsSelected(value);
// console.log('hellooo'); // console.log('hellooo');
}; };
const onClickImages = (images) => { const onClickImages = (image) => {
// const images = imageAdd.map((e) => e.path); console.log(image);
setImageAdd(images); setImageAdd(image);
};
const onClickClose = (index) => {
console.log('index---', index);
const temp = imageAdd.filter((e, i) => {
if (i != index) return e;
});
setImageAdd(temp);
}; };
const ratingCompleted = (rating) => { const ratingCompleted = (rating) => {
console.log('Rating is: ' + rating); setStarRate(rating);
}; };
return ( return (
<KeyboardAvoidingView <KeyboardAvoidingView
...@@ -72,6 +50,7 @@ const FeedbackView = (props) => { ...@@ -72,6 +50,7 @@ const FeedbackView = (props) => {
<View style={styles.container}> <View style={styles.container}>
<AppText style={styles.txt} i18nKey={'FeedBackDCV'} /> <AppText style={styles.txt} i18nKey={'FeedBackDCV'} />
<Rating <Rating
startingValue={star_rate}
onFinishRating={ratingCompleted} onFinishRating={ratingCompleted}
style={{paddingVertical: 10}} style={{paddingVertical: 10}}
/> />
...@@ -90,48 +69,18 @@ const FeedbackView = (props) => { ...@@ -90,48 +69,18 @@ const FeedbackView = (props) => {
}} }}
/> />
<View style={styles.picker}> <View style={styles.picker}>
{imageAdd.length > 0 ? ( <PickerImg
<ScrollView showsHorizontalScrollIndicator={false} horizontal> image={imageAdd}
{imageAdd.map((e, index) => ( title={''}
<View key={index} style={styles.imageButton}> onClickImage={onClickImages}
<ImageBackground
imageStyle={{
width: WIDTHXD(330),
height: HEIGHTXD(250),
borderRadius: 5,
}}
style={{
width: WIDTHXD(330),
height: HEIGHTXD(250),
}}
source={{uri: e}}>
<TouchableOpacity
style={{
flexDirection: 'row',
justifyContent: 'flex-end',
marginTop: -10,
marginRight: -10,
}}
onPress={() => onClickClose(index)}>
<Image
style={{height: 20, width: 20}}
source={R.images.iconClose}
/> />
</TouchableOpacity>
</ImageBackground>
</View>
))}
</ScrollView>
) : (
<PickerImg title={''} onClickImage={onClickImages} />
)}
</View> </View>
</View> </View>
</View> </View>
<View style={styles.containerBtn}> <View style={styles.containerBtn}>
<Button <Button
onClick={() => console.log('hello')} onClick={() => props.onClickSend(star_rate, imageAdd, txtInput)}
title={I18n.t('SendFeedback')} title={I18n.t('SendFeedback')}
/> />
</View> </View>
......
import {PostLogin, GetData, PostData} from '../helpers'; import {PostLogin, GetData, PostData, PostFormData} from '../helpers';
import url from '../url'; import url from '../url';
...@@ -6,3 +6,8 @@ export const getImagesHome = async (body) => ...@@ -6,3 +6,8 @@ export const getImagesHome = async (body) =>
GetData(url.urlGetImagesHome, body) GetData(url.urlGetImagesHome, body)
.then((res) => res) .then((res) => res)
.catch((err) => err); .catch((err) => err);
export const sendFeedBack = async (body) =>
PostFormData(url.urlFeedback, body)
.then((res) => res)
.catch((err) => err);
...@@ -50,4 +50,6 @@ export default { ...@@ -50,4 +50,6 @@ export default {
urlChangeAvatar: root + 'api/v1/customers/update-avatar', urlChangeAvatar: root + 'api/v1/customers/update-avatar',
urlUploadImage: root + 'api/v1/uploads/upload-image', urlUploadImage: root + 'api/v1/uploads/upload-image',
urlFeedback: root + 'api/v1/customers/send-feedback',
}; };
...@@ -24,22 +24,15 @@ const options = { ...@@ -24,22 +24,15 @@ const options = {
}; };
const PickerImg = (props) => { const PickerImg = (props) => {
const {title, height, width, onClickImage} = props; const {title, height, width, onClickImage, image} = props;
const [imgPicker, setImgPicker] = useState();
const [isModalVisible, setModalVisible] = useState(false); const [isModalVisible, setModalVisible] = useState(false);
const [urlImg, setUrlImg] = useState('');
// const [imgPicker, setImgPicker] = useState('');
const onchoosGalery = () => { const onchoosGalery = () => {
ImagePicker.openPicker({ ImagePicker.openPicker({
mediaType: 'photo', mediaType: 'photo',
multiple: true, }).then((image) => {
}).then((images) => {
setModalVisible(false); setModalVisible(false);
onClickImage(image.path);
const temp = images.map((e) => e.path);
onClickImage(temp);
}); });
}; };
...@@ -48,8 +41,7 @@ const PickerImg = (props) => { ...@@ -48,8 +41,7 @@ const PickerImg = (props) => {
mediaType: 'photo', mediaType: 'photo',
}).then((image) => { }).then((image) => {
setModalVisible(false); setModalVisible(false);
onClickImage(image.path);
onClickImage(image[0].path);
}); });
}; };
...@@ -58,9 +50,13 @@ const PickerImg = (props) => { ...@@ -58,9 +50,13 @@ const PickerImg = (props) => {
onPress={() => setModalVisible(true)} onPress={() => setModalVisible(true)}
style={{marginTop: 10, width: WIDTHXD(480)}}> style={{marginTop: 10, width: WIDTHXD(480)}}>
<Text style={styles.txt}>{title}</Text> <Text style={styles.txt}>{title}</Text>
{image ? (
<Image style={styles.container} source={{uri: image}} />
) : (
<View style={styles.container}> <View style={styles.container}>
<Icon name={'plus'} size={40} color={'#DBDBDB'} /> <Icon name={'plus'} size={40} color={'#DBDBDB'} />
</View> </View>
)}
<Modal <Modal
isVisible={isModalVisible} isVisible={isModalVisible}
...@@ -150,4 +146,4 @@ const styles = StyleSheet.create({ ...@@ -150,4 +146,4 @@ const styles = StyleSheet.create({
}, },
}); });
export default React.memo(PickerImg); export default PickerImg;
Markdown is supported
0% or
You are about to add 0 people to the discussion. Proceed with caution.
Finish editing this message first!
Please register or to comment