GeneralInfor.js 6.61 KB
Newer Older
1 2 3 4 5 6
import React, {useState} from 'react';
import {
  View,
  Text,
  TouchableOpacity,
  StyleSheet,
Giang Tran committed
7
  Alert,
Giang Tran committed
8 9 10
  KeyboardAvoidingView,
  ScrollView,
  Platform,
Giang Tran committed
11 12
  TouchableWithoutFeedback,
  Keyboard,
13 14
} from 'react-native';
import R from '../../../../assets/R';
Giang Tran committed
15 16 17 18
import PickerDate from '../../../../components/Picker/PickerDate';
import TextMulti from '../../../../components/Input/TextMulti';
import {connect} from 'react-redux';
import {showLoading, hideLoading} from '../../../../actions/loadingAction';
Giang Tran committed
19
import {saveUserToRedux} from '../../../../actions/users';
Giang Tran committed
20 21
import AppText from '../../../../components/AppText';
import I18n from '../../../../helper/i18/i18n';
22
import TextField from '../../../../components/Input/TextField';
Giang Tran committed
23 24 25 26 27
import {
  getFontXD,
  HEIGHTXD,
  WIDTHXD,
  renderStatus,
Giang Tran committed
28
  checkFormatArray,
Giang Tran committed
29
} from '../../../../Config/Functions';
Giang Tran committed
30
import {updateInforUser} from '../../../../apis/Functions/users';
31 32

const GeneralInfor = (props) => {
Giang Tran committed
33 34
  const [phone, setPhone] = useState(props.user.phone);
  const [address, setAddress] = useState(props.user.address);
35

Giang Tran committed
36
  const onClick = async () => {
37
    const titles = [I18n.t('Phone').toLowerCase(), I18n.t('Address').toLowerCase()];
Giang Tran committed
38 39 40 41 42 43 44 45 46 47 48 49 50
    const index = checkFormatArray([phone, address]);
    if (index === true) {
      props.showLoading();
      const res = await updateInforUser({
        uid: props.user.uid,
        platform: Platform.OS,
        phone,
        address,
      });
      props.hideLoading();
      if (res.data.code == 200) {
        setTimeout(() => {
          props.saveUserToRedux(res.data.data);
Giang Tran committed
51
          Alert.alert(I18n.t('Notification'), res.data.message);
Giang Tran committed
52 53 54 55
          props.navigation.popToTop();
        }, 500);
      } else {
        setTimeout(() => {
Giang Tran committed
56
          Alert.alert(I18n.t('Notification'), res.data.message);
Giang Tran committed
57 58 59
        }, 500);
      }
    } else {
Giang Tran committed
60 61 62 63
      Alert.alert(
        I18n.t('Notification'),
        I18n.t('Please_fill_in') + titles[index],
      );
Giang Tran committed
64 65 66 67
    }
  };

  const renderMale = () => {
68 69
    if (props.user.gender == 1) return I18n.t('Female');
    return I18n.t('Male2');
Giang Tran committed
70
  };
Giang Tran committed
71

72
  return (
Giang Tran committed
73 74 75
    <KeyboardAvoidingView
      behavior={Platform.Os === 'ios' ? 'padding' : 'height'}
      style={{flex: 1}}
Giang Tran committed
76
      keyboardVerticalOffset={-500}>
Giang Tran committed
77 78 79
      <TouchableWithoutFeedback onPress={Keyboard.dismiss}>
        <ScrollView style={{flex: 1}} showsVerticalScrollIndicator={false}>
          <View style={styles.container}>
Giang Tran committed
80 81
            <View style={styles.wrapItem}>
              <View style={styles.wrapLeft}>
Giang Tran committed
82
                <AppText i18nKey={'Fullname'} style={styles.txtTitle}></AppText>
Giang Tran committed
83 84 85 86 87 88 89 90 91 92 93 94 95 96 97
              </View>
              <View style={styles.wrapRight}>
                <Text style={styles.txtTitle}>{props.user.fullname}</Text>
              </View>
            </View>
            <View style={styles.wrapItem}>
              <View style={styles.wrapLeft}>
                <Text style={styles.txtTitle}>Email</Text>
              </View>
              <View style={styles.wrapRight}>
                <Text style={styles.txtTitle}>{props.user.email}</Text>
              </View>
            </View>
            <View style={styles.wrapItem}>
              <View style={styles.wrapLeft}>
Giang Tran committed
98
                <AppText i18nKey={'Birth'} style={styles.txtTitle}></AppText>
Giang Tran committed
99 100 101 102 103 104 105
              </View>
              <View style={styles.wrapRight}>
                <Text style={styles.txtTitle}>{props.user.birthday}</Text>
              </View>
            </View>
            <View style={styles.wrapItem}>
              <View style={styles.wrapLeft}>
Giang Tran committed
106
                <AppText i18nKey={'Male'} style={styles.txtTitle}></AppText>
Giang Tran committed
107 108 109 110 111 112 113
              </View>
              <View style={styles.wrapRight}>
                <Text style={styles.txtTitle}>{renderMale()}</Text>
              </View>
            </View>
            <View style={styles.wrapItem}>
              <View style={styles.wrapLeft}>
Giang Tran committed
114
                <AppText i18nKey={'Status'} style={styles.txtTitle}></AppText>
Giang Tran committed
115 116 117 118 119 120 121
              </View>
              <View style={styles.wrapRight}>
                <Text style={styles.txtTitle}>
                  {' '}
                  {renderStatus(props.user.status)}
                </Text>
              </View>
Giang Tran committed
122
            </View>
123

Giang Tran committed
124
            <TextField
Giang Tran committed
125
              title={I18n.t('Phone')}
Giang Tran committed
126 127
              value={phone}
              onChangeText={(val) => setPhone(val)}
Giang Tran committed
128
            />
129

Giang Tran committed
130
            <TextMulti
Giang Tran committed
131 132
              onChangeText={(val) => setAddress(val)}
              value={address}
Giang Tran committed
133
              title={I18n.t('Address')}
Giang Tran committed
134
            />
Giang Tran committed
135

Giang Tran committed
136 137
            <View style={{height: 40}} />
            <View style={{justifyContent: 'center', alignItems: 'center'}}>
Giang Tran committed
138
              <TouchableOpacity onPress={onClick} style={styles.btn}>
Giang Tran committed
139 140
                <AppText i18nKey={'Update'} style={styles.txtBtn}>
                </AppText>
Giang Tran committed
141
              </TouchableOpacity>
Giang Tran committed
142
            </View>
Giang Tran committed
143
          </View>
Giang Tran committed
144 145
        </ScrollView>
      </TouchableWithoutFeedback>
Giang Tran committed
146
    </KeyboardAvoidingView>
147 148 149 150 151 152 153 154 155
  );
};

const styles = StyleSheet.create({
  container: {
    flex: 1,
    paddingHorizontal: 10,
    paddingVertical: 10,
  },
Giang Tran committed
156 157 158 159
  wrapItem: {
    flexDirection: 'row',
    marginVertical: 5,
  },
160 161 162 163 164 165 166 167 168 169 170 171 172 173 174 175 176 177 178 179 180
  customTxt: {
    height: HEIGHTXD(110),
    color: 'black',
    borderRadius: 7,
    borderWidth: 0.7,
    borderColor: '#DBDBDB',
    fontSize: getFontXD(42),
    paddingVertical: 5,
    paddingHorizontal: 10,
    backgroundColor: 'white',
    shadowColor: '#AFA9A9',
    shadowOffset: {
      width: 0,
      height: 1,
    },
    shadowOpacity: 0.25,
    shadowRadius: 1.84,
    elevation: 1,
    marginTop: 50,
    marginBottom: 20,
  },
Giang Tran committed
181 182 183 184 185 186
  wrapLeft: {
    flex: 1,
  },
  wrapRight: {
    flex: 2,
  },
187 188 189
  status: {
    flexDirection: 'row',
    justifyContent: 'space-between',
Giang Tran committed
190
    marginVertical: 10,
191 192 193 194 195
    alignItems: 'center',
  },
  footer: {
    justifyContent: 'center',
    alignItems: 'center',
Giang Tran committed
196
    marginBottom: 30,
197 198
  },
  btn: {
Giang Tran committed
199
    width: 180,
200
    height: HEIGHTXD(120),
Giang Tran committed
201
    borderRadius: 10,
202 203 204 205 206 207 208 209 210 211 212 213 214 215 216 217 218 219 220 221 222 223 224
    backgroundColor: '#1C6AF6',
    justifyContent: 'center',
    alignItems: 'center',
  },
  txtBtn: {
    color: R.colors.white,
    fontSize: getFontXD(52),
    textTransform: 'uppercase',
  },
  customAdd: {
    borderWidth: 1,
    borderColor: '#929292',
    paddingHorizontal: 5,
    borderRadius: 5,
    marginRight: 10,
  },
  txtTitle: {
    fontSize: getFontXD(42),
    color: R.colors.color777,
    marginBottom: 5,

    paddingTop: 5,
  },
Giang Tran committed
225 226 227 228 229 230 231
  row: {
    height: HEIGHTXD(109),
    width: '100%',
    justifyContent: 'space-between',
    marginVertical: 5,
    width: 250,
  },
232 233
});

Giang Tran committed
234 235 236 237 238
const mapStateToProps = (state) => {
  return {
    user: state.userReducer,
  };
};
Giang Tran committed
239 240 241 242 243
export default connect(mapStateToProps, {
  showLoading,
  saveUserToRedux,
  hideLoading,
})(GeneralInfor);