edited
This commit is contained in:
114
app/containers/Settings/language.js
Executable file
114
app/containers/Settings/language.js
Executable file
@@ -0,0 +1,114 @@
|
||||
import React, { Component } from "react";
|
||||
import {
|
||||
Platform,
|
||||
StyleSheet,
|
||||
Text,
|
||||
View,
|
||||
SafeAreaView,
|
||||
Picker,
|
||||
TouchableOpacity,
|
||||
TouchableHighlight,
|
||||
} from "react-native";
|
||||
import RadioForm, {RadioButton, RadioButtonInput, RadioButtonLabel} from 'react-native-simple-radio-button';
|
||||
import Size from "../../config/size";
|
||||
import Icon from "react-native-vector-icons/dist/Ionicons";
|
||||
import { observer, inject } from "mobx-react/native";
|
||||
import { observable } from "mobx";
|
||||
import DrawerNavigationHeader from "../../components/Public/drawerNavigationHeader";
|
||||
import AsyncStorageHelper from "../../config/asyncStorageHelper";
|
||||
import { scale, verticalScale, moderateScale } from "react-native-size-matters";
|
||||
import { width, height } from "../../config/screen";
|
||||
import language from "../../config/language";
|
||||
import theme from "../../config/colors";
|
||||
const asyncStorageHelper = new AsyncStorageHelper();
|
||||
const size = new Size();
|
||||
var radio_language = [
|
||||
{label: 'English', value: 'english'},
|
||||
{label: 'Chinese', value: 'chinese' }
|
||||
];
|
||||
@inject(["menuStore"], ["userStore"])
|
||||
@observer
|
||||
export default class Language extends Component {
|
||||
//language = 'english'
|
||||
static navigationOptions = {
|
||||
drawerLabel: "Settings",
|
||||
swipeEnabled: false,
|
||||
tabBarLabel: language.en.setting,
|
||||
};
|
||||
state = { language: "chinese",
|
||||
initial:0
|
||||
};
|
||||
constructor(props) {
|
||||
super(props);
|
||||
this.store = this.props.menuStore;
|
||||
this.userStore = this.props.userStore;
|
||||
}
|
||||
|
||||
componentWillMount() {
|
||||
this.setState({ language: this.userStore.languageSelection });
|
||||
if(this.userStore.languageSelection == 'chinese'){
|
||||
this.setState({initial:1})
|
||||
}else if (this.userStore.languageSelection == 'english'){
|
||||
this.setState({initial:0})
|
||||
}
|
||||
console.log(this.state.language);
|
||||
}
|
||||
|
||||
updateUser(language) {
|
||||
this.userStore.saveLanguage(language);
|
||||
this.setState({ language: language });
|
||||
}
|
||||
backAction() {
|
||||
console.log('back')
|
||||
this.props.navigation.goBack();
|
||||
}
|
||||
|
||||
render() {
|
||||
return (
|
||||
<SafeAreaView style={{ backgroundColor: theme.mainColor, flex: 1 }}>
|
||||
<View style={styles.container}>
|
||||
|
||||
<Icon
|
||||
onPress={() => {this.backAction()}}
|
||||
name="ios-arrow-back-outline"
|
||||
size={size.getSize(40)}
|
||||
color={"black"}
|
||||
/>
|
||||
|
||||
{/* <Picker
|
||||
selectedValue={this.state.language}
|
||||
style={{ height: 50, width: 100 }}
|
||||
onValueChange={(itemValue, itemIndex) => {
|
||||
this.updateUser(itemValue);
|
||||
}}
|
||||
>
|
||||
<Picker.Item label="中文" value="chinese" />
|
||||
<Picker.Item label="English" value="english" />
|
||||
</Picker> */}
|
||||
<RadioForm
|
||||
style = {{paddingTop: verticalScale(50),}}
|
||||
radio_props={radio_language}
|
||||
initial={this.state.initial}
|
||||
onPress={(value) => {this.updateUser(value)}}/>
|
||||
</View>
|
||||
</SafeAreaView>
|
||||
);
|
||||
}
|
||||
}
|
||||
|
||||
const styles = StyleSheet.create({
|
||||
container: {
|
||||
flex: 1,
|
||||
backgroundColor: "white"
|
||||
},
|
||||
flatViewContainer: {
|
||||
height: "100%",
|
||||
width: "100%",
|
||||
alignItems: "center",
|
||||
marginTop: 20
|
||||
},
|
||||
textView: {
|
||||
marginLeft: scale(15),
|
||||
marginBottom: scale(5)
|
||||
}
|
||||
});
|
||||
193
app/containers/Settings/myCoupons.js
Executable file
193
app/containers/Settings/myCoupons.js
Executable file
@@ -0,0 +1,193 @@
|
||||
import React, { Component } from "react";
|
||||
import {
|
||||
Platform,
|
||||
StyleSheet,
|
||||
View,
|
||||
ScrollView,
|
||||
TouchableOpacity,
|
||||
SafeAreaView,
|
||||
Image
|
||||
} from "react-native";
|
||||
import Text from "react-native-text";
|
||||
import { observer, inject } from "mobx-react/native";
|
||||
import { scale, verticalScale, moderateScale } from "react-native-size-matters";
|
||||
import Log from "../../config/log";
|
||||
import theme from "../../config/colors";
|
||||
import Size from "../../config/size";
|
||||
import { Fonts } from "../../config/fonts";
|
||||
import Icon2 from "react-native-vector-icons/dist/MaterialCommunityIcons";
|
||||
import Loader from "../../components/Public/loader";
|
||||
import moment from "moment";
|
||||
import Toast, { DURATION } from "react-native-easy-toast";
|
||||
import Header from "../../components/Public/header";
|
||||
import CardView from "react-native-cardview";
|
||||
import { width, height } from "../../config/screen";
|
||||
const log = new Log();
|
||||
const size = new Size();
|
||||
@inject(["menuStore"], ["userStore"])
|
||||
@observer
|
||||
class MyCoupons extends Component {
|
||||
constructor(props) {
|
||||
super(props);
|
||||
this.store = this.props.menuStore;
|
||||
this.userStore = this.props.userStore;
|
||||
}
|
||||
|
||||
back() {
|
||||
this.props.navigation.goBack();
|
||||
}
|
||||
exiryDate(item) {
|
||||
if (item.hasOwnProperty("expiry")) {
|
||||
var nowDatemoment = moment(this.store.coupons.data.timestamp);
|
||||
var nowDate = nowDatemoment.toDate();
|
||||
var expiryDatemoment = moment(item.expiry);
|
||||
var expiryDate = expiryDatemoment.toDate();
|
||||
if (nowDate < expiryDate) {
|
||||
return item.expiry;
|
||||
} else {
|
||||
return item.expiry + "(" + this.userStore.text.expired + ")";
|
||||
}
|
||||
} else {
|
||||
return "N/A";
|
||||
}
|
||||
}
|
||||
checking(item) {
|
||||
if (item.used) {
|
||||
return this.userStore.text.used;
|
||||
} else {
|
||||
if (item.hasOwnProperty("expiry")) {
|
||||
var nowDatemoment = moment(this.store.coupons.data.timestamp);
|
||||
var nowDate = nowDatemoment.toDate();
|
||||
var expiryDatemoment = moment(item.expiry);
|
||||
var expiryDate = expiryDatemoment.toDate();
|
||||
if (nowDate < expiryDate) {
|
||||
return this.userStore.text.canuse;
|
||||
} else {
|
||||
return this.userStore.text.cannotuse;
|
||||
}
|
||||
} else {
|
||||
return this.userStore.text.canuse;
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
renderCoupons() {
|
||||
return this.store.coupons.data.content.map((item, index, array) => {
|
||||
return (
|
||||
<CardView
|
||||
cardElevation={5}
|
||||
cardMaxElevation={5}
|
||||
cornerRadius={5}
|
||||
style={{
|
||||
marginBottom: 20,
|
||||
marginTop: 20,
|
||||
marginLeft: 25,
|
||||
marginRight: 25,
|
||||
backgroundColor: theme.mainColor
|
||||
}}
|
||||
>
|
||||
<Text
|
||||
style={{
|
||||
fontSize: 30,
|
||||
fontFamily: Fonts.century,
|
||||
color: "white",
|
||||
paddingLeft: 10
|
||||
}}
|
||||
>
|
||||
Coupon
|
||||
</Text>
|
||||
<View
|
||||
style={{
|
||||
flexDirection: "row",
|
||||
justifyContent: "space-between",
|
||||
marginTop: 10
|
||||
}}
|
||||
>
|
||||
<Image
|
||||
style={{
|
||||
height: scale(70),
|
||||
width: scale(70),
|
||||
tintColor: "white",
|
||||
marginLeft: 10
|
||||
}}
|
||||
source={require("../../images/appicon.png")}
|
||||
/>
|
||||
<View style={{ alignItems: "flex-end" }}>
|
||||
<Text
|
||||
style={{
|
||||
fontSize: 15,
|
||||
fontFamily: Fonts.century,
|
||||
color: "white",
|
||||
paddingRight: 10
|
||||
}}
|
||||
>
|
||||
{item.id}
|
||||
</Text>
|
||||
|
||||
<Text
|
||||
style={{
|
||||
fontSize: 15,
|
||||
fontFamily: Fonts.century,
|
||||
color: "white",
|
||||
paddingRight: 10,
|
||||
paddingTop: 10
|
||||
}}
|
||||
>
|
||||
{this.checking(item)}
|
||||
</Text>
|
||||
</View>
|
||||
</View>
|
||||
<View style={{ alignItems: "flex-end",paddingRight:10,marginTop:10,marginBottom:5 }}>
|
||||
<Text style={{ color: "white", fontSize: 15 }}>
|
||||
{this.userStore.text.expireDate + ": " + this.exiryDate(item)}
|
||||
</Text>
|
||||
</View>
|
||||
</CardView>
|
||||
);
|
||||
});
|
||||
}
|
||||
|
||||
navigatieAction(page) {
|
||||
this.props.navigation.navigate(page);
|
||||
}
|
||||
|
||||
render() {
|
||||
log.firebaseClass("MyCoupons");
|
||||
return (
|
||||
<SafeAreaView
|
||||
style={{ flex: 1, backgroundColor: theme.mainColor, width: width }}
|
||||
>
|
||||
<Loader loading={this.userStore.loading} />
|
||||
<View style={{ height: verticalScale(40) }}>
|
||||
<Icon2
|
||||
name="chevron-left"
|
||||
size={size.getSize(40)}
|
||||
color={"white"}
|
||||
style={{ marginLeft: 10 }}
|
||||
onPress={() => this.props.navigation.goBack()}
|
||||
/>
|
||||
</View>
|
||||
|
||||
<ScrollView
|
||||
style={{
|
||||
width: width,
|
||||
backgroundColor: "white"
|
||||
}}
|
||||
>
|
||||
<View
|
||||
style={{
|
||||
backgroundColor: "white",
|
||||
width: width,
|
||||
marginTop: 25
|
||||
}}
|
||||
>
|
||||
{this.renderCoupons()}
|
||||
</View>
|
||||
</ScrollView>
|
||||
<Toast ref="toast" />
|
||||
</SafeAreaView>
|
||||
);
|
||||
}
|
||||
}
|
||||
|
||||
export default MyCoupons;
|
||||
15
app/containers/Settings/notificationSetting.js
Executable file
15
app/containers/Settings/notificationSetting.js
Executable file
@@ -0,0 +1,15 @@
|
||||
import React, { Component } from 'react';
|
||||
import Header from '../../components/Public/header'
|
||||
class NotificationSetting extends Component {
|
||||
render() {
|
||||
return (
|
||||
<View>
|
||||
<Header title={'Notification Preferences'} navigation={this.props.navigation} />
|
||||
|
||||
|
||||
</View>
|
||||
);
|
||||
}
|
||||
}
|
||||
|
||||
export default NotificationSetting;
|
||||
446
app/containers/Settings/settingInside.js
Executable file
446
app/containers/Settings/settingInside.js
Executable file
@@ -0,0 +1,446 @@
|
||||
import React, { Component } from "react";
|
||||
import {
|
||||
Platform,
|
||||
StyleSheet,
|
||||
View,
|
||||
TouchableOpacity,
|
||||
SafeAreaView,
|
||||
ScrollView,
|
||||
Image,
|
||||
Linking,
|
||||
Alert,
|
||||
Share
|
||||
} from "react-native";
|
||||
import Text from "react-native-text";
|
||||
import { observable } from "mobx";
|
||||
import { observer, inject } from "mobx-react/native";
|
||||
import { scale, verticalScale, moderateScale } from "react-native-size-matters";
|
||||
import Size from "../../config/size";
|
||||
import Icon from "react-native-vector-icons/dist/Ionicons";
|
||||
import Icon2 from "react-native-vector-icons/dist/MaterialCommunityIcons";
|
||||
import { width, height } from "../../config/screen";
|
||||
import theme from "../../config/colors";
|
||||
import { Fonts } from "../../config/fonts";
|
||||
import DrawerNavigationHeader from "../../components/Public/drawerNavigationHeader";
|
||||
import PopupDialog, { SlideAnimation } from "react-native-popup-dialog";
|
||||
import language from "../../config/language";
|
||||
const size = new Size();
|
||||
const slideAnimation = new SlideAnimation({
|
||||
slideFrom: "bottom"
|
||||
});
|
||||
|
||||
@inject(["menuStore"], ["userStore"])
|
||||
@observer
|
||||
export default class SettingInside extends Component {
|
||||
@observable
|
||||
items = [
|
||||
{
|
||||
icon: require("../../images/settinglang.png"),
|
||||
popup: true,
|
||||
screen: "language",
|
||||
id: 0
|
||||
},
|
||||
|
||||
{
|
||||
icon: require("../../images/settingnotification.png"),
|
||||
screen: "NotificationSetting",
|
||||
popup: true,
|
||||
id: 1
|
||||
},
|
||||
{
|
||||
icon: require("../../images/settinghowtouse.png"),
|
||||
popup: true,
|
||||
id: 2
|
||||
},
|
||||
|
||||
{
|
||||
icon: require("../../images/settinglogout.png"),
|
||||
popup: true,
|
||||
id: 3
|
||||
}
|
||||
];
|
||||
@observable
|
||||
lang = false;
|
||||
constructor(props) {
|
||||
super(props);
|
||||
this.store = this.props.menuStore;
|
||||
this.userStore = this.props.userStore;
|
||||
}
|
||||
|
||||
static navigationOptions = {
|
||||
drawerLabel: "Settings",
|
||||
swipeEnabled: false,
|
||||
tabBarLabel: language.en.setting
|
||||
};
|
||||
|
||||
getTitle(id) {
|
||||
switch (id) {
|
||||
case 0:
|
||||
return this.props.userStore.text.language;
|
||||
break;
|
||||
case 1:
|
||||
return this.props.userStore.text.notification;
|
||||
break;
|
||||
case 2:
|
||||
return this.props.userStore.text.howtouse;
|
||||
break;
|
||||
case 3:
|
||||
return this.props.userStore.text.logout;
|
||||
break;
|
||||
}
|
||||
}
|
||||
|
||||
componentWillMount() {
|
||||
if (this.userStore.languageSelection == "english") {
|
||||
this.lang = false;
|
||||
} else {
|
||||
this.lang = true;
|
||||
}
|
||||
}
|
||||
|
||||
languageText() {
|
||||
if (this.userStore.languageSelection == "english") {
|
||||
return "English";
|
||||
} else {
|
||||
return "繁體中文";
|
||||
}
|
||||
}
|
||||
|
||||
languageView(id) {
|
||||
if (id == 0) {
|
||||
return (
|
||||
<View style={{ justifyContent: "center" }}>
|
||||
<Text
|
||||
style={{
|
||||
fontSize: 15,
|
||||
marginRight: scale(30),
|
||||
color: theme.coolGrey,
|
||||
fontWeight: "bold",
|
||||
fontFamily: Fonts.century
|
||||
}}
|
||||
>
|
||||
{this.languageText()}
|
||||
</Text>
|
||||
</View>
|
||||
);
|
||||
} else {
|
||||
return <View />;
|
||||
}
|
||||
}
|
||||
|
||||
onPressAction(index) {
|
||||
if (this.items[index].popup) {
|
||||
switch (index) {
|
||||
case 0:
|
||||
this.languagePagePopUp();
|
||||
break;
|
||||
case 1:
|
||||
Linking.openURL("app-settings:");
|
||||
break;
|
||||
case 2:
|
||||
this.props.navigation.navigate("Tutorial", { data: "setting" });
|
||||
break;
|
||||
case 3:
|
||||
this.logoutAlert();
|
||||
break;
|
||||
}
|
||||
} else {
|
||||
console.log(this.items[index].screen);
|
||||
this.props.navigation.navigate(this.items[index].screen);
|
||||
}
|
||||
}
|
||||
|
||||
logoutAlert() {
|
||||
Alert.alert(
|
||||
"Logout",
|
||||
"Are you sure to Logout?",
|
||||
[
|
||||
{
|
||||
text: "Cancel",
|
||||
onPress: () => console.log("Cancel Pressed"),
|
||||
style: "cancel"
|
||||
},
|
||||
{ text: "Sure", onPress: () => this.logoutAction() }
|
||||
],
|
||||
{ cancelable: false }
|
||||
);
|
||||
}
|
||||
|
||||
referYourFriender() {
|
||||
Share.share({
|
||||
message: "Hello,Come to join Hangry, this is my refer code: ",
|
||||
title: "Hangry no more"
|
||||
});
|
||||
}
|
||||
|
||||
logoutAction() {
|
||||
this.userStore.logoutPost(this, false);
|
||||
}
|
||||
navigatieAction(page) {
|
||||
this.props.navigation.navigate(page);
|
||||
}
|
||||
|
||||
renderItems() {
|
||||
return this.items.map((item, index, array) => {
|
||||
if (item.id == 3 && !this.userStore.logined) {
|
||||
return null;
|
||||
} else {
|
||||
if (item.id == 1 && Platform.OS !== 'ios') {
|
||||
return null;
|
||||
}else{
|
||||
return (
|
||||
<TouchableOpacity
|
||||
style={{ marginBottom: 20, marginLeft: 25, paddingRight: 25 }}
|
||||
onPress={() => this.onPressAction(index)}
|
||||
>
|
||||
<View
|
||||
style={{
|
||||
flexDirection: "row",
|
||||
alignItems: "center",
|
||||
justifyContent: "space-between"
|
||||
}}
|
||||
>
|
||||
<View
|
||||
style={{
|
||||
flexDirection: "row",
|
||||
justifyContent: "center",
|
||||
alignItems: "center"
|
||||
}}
|
||||
>
|
||||
<Image source={item.icon} />
|
||||
<Text
|
||||
style={{
|
||||
fontSize: 15,
|
||||
marginLeft: 10,
|
||||
color: theme.coolGrey,
|
||||
fontWeight: "bold",
|
||||
fontFamily: Fonts.century
|
||||
}}
|
||||
>
|
||||
{this.getTitle(item.id)}
|
||||
</Text>
|
||||
</View>
|
||||
<View style={{ flexDirection: "row" }}>
|
||||
{this.languageView(item.id)}
|
||||
<Icon
|
||||
name={"ios-arrow-forward"}
|
||||
size={size.getSize(35)}
|
||||
color={theme.coolGrey}
|
||||
/>
|
||||
</View>
|
||||
</View>
|
||||
<View
|
||||
style={{
|
||||
backgroundColor: theme.inputBgc,
|
||||
flex: 1,
|
||||
marginTop: 5,
|
||||
marginLeft: 40,
|
||||
height: 1
|
||||
}}
|
||||
/>
|
||||
</TouchableOpacity>
|
||||
);
|
||||
}
|
||||
}
|
||||
});
|
||||
}
|
||||
|
||||
languagePagePopUp() {
|
||||
this.popupDialog.show();
|
||||
}
|
||||
|
||||
languagePageDismiss() {
|
||||
this.popupDialog.dismiss();
|
||||
}
|
||||
|
||||
updateUser() {
|
||||
if (this.lang) {
|
||||
this.userStore.saveLanguage("chinese");
|
||||
this.popupDialog.dismiss();
|
||||
} else {
|
||||
this.userStore.saveLanguage("english");
|
||||
this.popupDialog.dismiss();
|
||||
}
|
||||
}
|
||||
|
||||
languagePageDismissedCallBack() {
|
||||
console.log("dismiss dialog");
|
||||
if (this.userStore.languageSelection == "english") {
|
||||
this.lang = false;
|
||||
} else {
|
||||
this.lang = true;
|
||||
}
|
||||
}
|
||||
|
||||
selectIcon(lang) {
|
||||
if (!lang) {
|
||||
if (!this.lang) {
|
||||
return (
|
||||
<Icon2
|
||||
name={"checkbox-blank-circle"}
|
||||
size={size.getSize(35)}
|
||||
color={theme.mainColor}
|
||||
/>
|
||||
);
|
||||
} else {
|
||||
return (
|
||||
<Icon2
|
||||
name={"checkbox-blank-circle-outline"}
|
||||
size={size.getSize(35)}
|
||||
color={theme.mainColor}
|
||||
/>
|
||||
);
|
||||
}
|
||||
} else {
|
||||
if (!this.lang) {
|
||||
return (
|
||||
<Icon2
|
||||
name={"checkbox-blank-circle-outline"}
|
||||
size={size.getSize(35)}
|
||||
color={theme.mainColor}
|
||||
/>
|
||||
);
|
||||
} else {
|
||||
return (
|
||||
<Icon2
|
||||
name={"checkbox-blank-circle"}
|
||||
size={size.getSize(35)}
|
||||
color={theme.mainColor}
|
||||
/>
|
||||
);
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
render() {
|
||||
return (
|
||||
<SafeAreaView style={styles.container}>
|
||||
<View style={{ height: verticalScale(40) }}>
|
||||
<Icon2
|
||||
name="chevron-left"
|
||||
size={size.getSize(40)}
|
||||
color={"white"}
|
||||
style={{ marginLeft: 10 }}
|
||||
onPress={() => this.props.navigation.goBack()}
|
||||
/>
|
||||
</View>
|
||||
<ScrollView style={{ backgroundColor: "white" }}>
|
||||
<View
|
||||
style={{
|
||||
backgroundColor: "white",
|
||||
width: width,
|
||||
marginTop: 25
|
||||
}}
|
||||
>
|
||||
{this.renderItems()}
|
||||
<View style={{ flex: 1, alignItems: "flex-end", paddingRight: 25 }}>
|
||||
<Text
|
||||
style={{
|
||||
fontFamily: Fonts.century,
|
||||
color: theme.coolGrey,
|
||||
fontSize: 10
|
||||
}}
|
||||
>
|
||||
{"Ver 4.4 28 - 3 - 2019"}
|
||||
</Text>
|
||||
</View>
|
||||
</View>
|
||||
</ScrollView>
|
||||
<PopupDialog
|
||||
ref={popupDialog => {
|
||||
this.popupDialog = popupDialog;
|
||||
}}
|
||||
dialogAnimation={slideAnimation}
|
||||
height={height / 4}
|
||||
width={width - scale(60)}
|
||||
onDismissed={() => this.languagePageDismissedCallBack()}
|
||||
>
|
||||
<View style={{ flex: 1, justifyContent: "space-between" }}>
|
||||
<View style={{ flex: 4, paddingTop: 5 }}>
|
||||
<Text
|
||||
style={{
|
||||
paddingLeft: 5,
|
||||
fontSize: 15,
|
||||
color: theme.coolGrey,
|
||||
fontWeight: "bold",
|
||||
fontFamily: Fonts.century
|
||||
}}
|
||||
>
|
||||
{this.userStore.text.slectLang}
|
||||
</Text>
|
||||
<TouchableOpacity
|
||||
style={{
|
||||
flexDirection: "row",
|
||||
justifyContent: "space-between",
|
||||
alignItems: "center"
|
||||
}}
|
||||
onPress={() => (this.lang = false)}
|
||||
>
|
||||
<Text
|
||||
style={{
|
||||
paddingLeft: 5,
|
||||
fontSize: 15,
|
||||
color: theme.coolGrey,
|
||||
fontWeight: "bold",
|
||||
fontFamily: Fonts.century
|
||||
}}
|
||||
>
|
||||
English
|
||||
</Text>
|
||||
{this.selectIcon(false)}
|
||||
</TouchableOpacity>
|
||||
<TouchableOpacity
|
||||
style={{
|
||||
flexDirection: "row",
|
||||
justifyContent: "space-between",
|
||||
alignItems: "center"
|
||||
}}
|
||||
onPress={() => (this.lang = true)}
|
||||
>
|
||||
<Text
|
||||
style={{
|
||||
paddingLeft: 5,
|
||||
fontSize: 15,
|
||||
color: theme.coolGrey,
|
||||
fontWeight: "bold",
|
||||
fontFamily: Fonts.century
|
||||
}}
|
||||
>
|
||||
繁體中文
|
||||
</Text>
|
||||
{this.selectIcon(true)}
|
||||
</TouchableOpacity>
|
||||
</View>
|
||||
<TouchableOpacity
|
||||
onPress={() => this.updateUser()}
|
||||
style={{
|
||||
backgroundColor: theme.mainColor,
|
||||
flex: 1,
|
||||
justifyContent: "center",
|
||||
alignItems: "center"
|
||||
}}
|
||||
>
|
||||
<Text
|
||||
style={{
|
||||
fontSize: 15,
|
||||
color: "white",
|
||||
fontWeight: "bold",
|
||||
fontFamily: Fonts.century
|
||||
}}
|
||||
>
|
||||
OK
|
||||
</Text>
|
||||
</TouchableOpacity>
|
||||
</View>
|
||||
</PopupDialog>
|
||||
</SafeAreaView>
|
||||
);
|
||||
}
|
||||
}
|
||||
|
||||
const styles = StyleSheet.create({
|
||||
container: {
|
||||
flex: 1,
|
||||
backgroundColor: theme.mainColor
|
||||
}
|
||||
});
|
||||
269
app/containers/Settings/settings.js
Executable file
269
app/containers/Settings/settings.js
Executable file
@@ -0,0 +1,269 @@
|
||||
import React, { Component } from "react";
|
||||
import {
|
||||
Platform,
|
||||
StyleSheet,
|
||||
View,
|
||||
TouchableOpacity,
|
||||
SafeAreaView,
|
||||
ScrollView,
|
||||
Image,
|
||||
Linking,
|
||||
Alert,
|
||||
Share
|
||||
} from "react-native";
|
||||
import Text from "react-native-text";
|
||||
import { observable } from "mobx";
|
||||
import Loader from '../../components/Public/loader'
|
||||
import { observer, inject } from "mobx-react/native";
|
||||
import { scale, verticalScale, moderateScale } from "react-native-size-matters";
|
||||
import Size from "../../config/size";
|
||||
import Icon from "react-native-vector-icons/dist/Ionicons";
|
||||
import { width, height } from "../../config/screen";
|
||||
import theme from "../../config/colors";
|
||||
import { Fonts } from "../../config/fonts";
|
||||
import DrawerNavigationHeader from "../../components/Public/drawerNavigationHeader";
|
||||
import language from "../../config/language";
|
||||
const size = new Size();
|
||||
|
||||
@inject(["menuStore"], ["userStore"])
|
||||
@observer
|
||||
export default class Settings extends Component {
|
||||
@observable
|
||||
items = [
|
||||
{
|
||||
icon: require("../../images/settingrefer.png"),
|
||||
popup: true,
|
||||
id: 0
|
||||
},
|
||||
{
|
||||
icon: require("../../images/promo.png"),
|
||||
screen:'myCoupons',
|
||||
popup: true,
|
||||
id: 1
|
||||
},
|
||||
{
|
||||
icon: require("../../images/settingsetting.png"),
|
||||
screen: "SettingInside",
|
||||
popup: false,
|
||||
id: 2
|
||||
},
|
||||
{
|
||||
icon: require("../../images/settingt_c.png"),
|
||||
popup: true,
|
||||
id: 3
|
||||
},
|
||||
|
||||
{
|
||||
icon: require("../../images/settingprivacy.png"),
|
||||
popup: true,
|
||||
id: 4
|
||||
},
|
||||
|
||||
{
|
||||
icon: require("../../images/settingcontact.png"),
|
||||
popup: true,
|
||||
id: 5
|
||||
}
|
||||
];
|
||||
|
||||
constructor(props) {
|
||||
super(props);
|
||||
this.store = this.props.menuStore;
|
||||
this.userStore = this.props.userStore;
|
||||
}
|
||||
|
||||
static navigationOptions = {
|
||||
drawerLabel: "Settings",
|
||||
swipeEnabled: false,
|
||||
tabBarLabel: language.en.setting
|
||||
};
|
||||
getTitle(id) {
|
||||
switch (id) {
|
||||
case 0:
|
||||
return this.props.userStore.text.referYourFriends;
|
||||
break;
|
||||
case 1:
|
||||
return this.props.userStore.text.myCoupons;
|
||||
case 2:
|
||||
return this.props.userStore.text.setting;
|
||||
break;
|
||||
case 3:
|
||||
return this.props.userStore.text.termandconditions;
|
||||
break;
|
||||
case 4:
|
||||
return this.props.userStore.text.privacy;
|
||||
break;
|
||||
case 5:
|
||||
return this.props.userStore.text.contactUs;
|
||||
break;
|
||||
}
|
||||
}
|
||||
|
||||
onPressAction(index) {
|
||||
if (this.items[index].popup) {
|
||||
switch (index) {
|
||||
case 0:
|
||||
this.referYourFriender();
|
||||
break;
|
||||
case 1:
|
||||
this.store.userCoupon(this,this.userStore.userData.data.token,true)
|
||||
break;
|
||||
case 3:
|
||||
Linking.openURL("https://www.hangryfood.co/terms-and-conditions");
|
||||
break;
|
||||
case 4:
|
||||
Linking.openURL("https://www.hangryfood.co/privacy-statement");
|
||||
break;
|
||||
case 5:
|
||||
Linking.openURL("mailto:support@hangryfood.co?subject=&body=");
|
||||
break;
|
||||
}
|
||||
} else {
|
||||
// console.log(this.items[index].screen);
|
||||
this.props.navigation.navigate(this.items[index].screen);
|
||||
}
|
||||
}
|
||||
|
||||
logoutAlert() {
|
||||
Alert.alert(
|
||||
"Logout",
|
||||
"Are you sure to Logout?",
|
||||
[
|
||||
{
|
||||
text: "Cancel",
|
||||
onPress: () => console.log("Cancel Pressed"),
|
||||
style: "cancel"
|
||||
},
|
||||
{ text: "Sure", onPress: () => this.logoutAction() }
|
||||
],
|
||||
{ cancelable: false }
|
||||
);
|
||||
}
|
||||
|
||||
referYourFriender() {
|
||||
//const link = Platform.OS === 'ios' ? 'itms://itunes.apple.com/us/app/apple-store/1439173696?mt=8' : '';
|
||||
var sharemessage = ""
|
||||
if (this.userStore.language == 'english'){
|
||||
sharemessage = this.store.sharemessage[0].contentEn
|
||||
}else{
|
||||
sharemessage = this.store.sharemessage[0].content
|
||||
}
|
||||
const link = "http://onelink.to/mh4dh2"
|
||||
Share.share({
|
||||
message: sharemessage+link,
|
||||
title: "Hangry no more"
|
||||
});
|
||||
}
|
||||
|
||||
logoutAction() {
|
||||
this.userStore.logoutPost(this);
|
||||
}
|
||||
navigatieAction(page) {
|
||||
this.props.navigation.navigate(page);
|
||||
}
|
||||
|
||||
renderItems() {
|
||||
return this.items.map((item, index, array) => {
|
||||
if (item.id == 1 && !this.userStore.logined) {
|
||||
return null;
|
||||
} else {
|
||||
return (
|
||||
<TouchableOpacity
|
||||
style={{ marginBottom: 20, marginLeft: 25, paddingRight: 25 }}
|
||||
onPress={() => this.onPressAction(index)}
|
||||
>
|
||||
<View
|
||||
style={{
|
||||
flexDirection: "row",
|
||||
alignItems: "center",
|
||||
justifyContent: "space-between"
|
||||
}}
|
||||
>
|
||||
<View
|
||||
style={{
|
||||
flexDirection: "row",
|
||||
justifyContent: "center",
|
||||
alignItems: "center"
|
||||
}}
|
||||
>
|
||||
<Image source={item.icon} />
|
||||
<Text
|
||||
style={{
|
||||
fontSize: 15,
|
||||
marginLeft: 10,
|
||||
color: theme.coolGrey,
|
||||
fontWeight: "bold",
|
||||
fontFamily: Fonts.century
|
||||
}}
|
||||
>
|
||||
{this.getTitle(item.id)}
|
||||
</Text>
|
||||
</View>
|
||||
<View>
|
||||
<Icon
|
||||
name={"ios-arrow-forward"}
|
||||
size={size.getSize(35)}
|
||||
color={theme.coolGrey}
|
||||
/>
|
||||
</View>
|
||||
</View>
|
||||
<View
|
||||
style={{
|
||||
backgroundColor: theme.inputBgc,
|
||||
flex: 1,
|
||||
marginTop: 5,
|
||||
marginLeft: 40,
|
||||
height: 1
|
||||
}}
|
||||
/>
|
||||
</TouchableOpacity>
|
||||
);
|
||||
}
|
||||
});
|
||||
}
|
||||
|
||||
render() {
|
||||
return (
|
||||
<SafeAreaView style={styles.container}>
|
||||
<Loader loading = {this.store.loading}/>
|
||||
<View style={{ height: verticalScale(40) }} />
|
||||
<ScrollView style={{ backgroundColor: "white" }}>
|
||||
<View
|
||||
style={{
|
||||
backgroundColor: "white",
|
||||
width: width,
|
||||
marginTop: 25
|
||||
}}
|
||||
>
|
||||
{this.renderItems()}
|
||||
<View style={{ flex: 1, alignItems: "flex-end", paddingRight: 25 }}>
|
||||
<Text
|
||||
style={{
|
||||
fontFamily: Fonts.century,
|
||||
color: theme.coolGrey,
|
||||
fontSize: 11
|
||||
}}
|
||||
>
|
||||
follow us on
|
||||
</Text>
|
||||
<View style={{ flexDirection: "row", paddingTop: 10 }}>
|
||||
<Image source={require("../../images/settingfb.png")} />
|
||||
<Image
|
||||
source={require("../../images/settingig.png")}
|
||||
style={{ marginLeft: 5 }}
|
||||
/>
|
||||
</View>
|
||||
</View>
|
||||
</View>
|
||||
</ScrollView>
|
||||
</SafeAreaView>
|
||||
);
|
||||
}
|
||||
}
|
||||
|
||||
const styles = StyleSheet.create({
|
||||
container: {
|
||||
flex: 1,
|
||||
backgroundColor: theme.mainColor
|
||||
}
|
||||
});
|
||||
Reference in New Issue
Block a user