customer / shanghai-railway-rnapp

/**
 * Created by tdzl2003 on 12/18/16.
 */
import React, {Component, PropTypes} from "react";
import {
    Dimensions,
    Image,
    ScrollView,
    StyleSheet,
    Text,
    TouchableOpacity,
    View,
    Platform,
    StatusBar,
    NativeModules,
    ActivityIndicator,
    DeviceEventEmitter,
    Alert
} from "react-native";
import {zoomW,zoomH} from '../../utils/getSize';
import xnService from "../../service/AppService";
import {xnToast} from "../../utils/utils"
function isIphoneX() {
    let dimen = Dimensions.get('window');
    return (
        Platform.OS === 'ios' &&
        !Platform.isPad &&
        !Platform.isTVOS &&
        (dimen.height === 812 || dimen.width === 812)
    );
}

var ImagePicker = require('react-native-image-picker');
var options = {
    title: '选择头像',
    storageOptions: {
        skipBackup: true,
        path: 'images',
        waitUntilSaved:true
    },
    cancelButtonTitle:'取消',
    takePhotoButtonTitle:'拍照',
    chooseFromLibraryButtonTitle:'选择相册',
    quality:1,
    noData:true,
    maxWidth: 200,
    maxHeight: 200

};

export default class Info extends Component {
    static navigationOptions = ({navigation}) => ({
        headerTitle:'个人信息',
        headerLeft:(
            <TouchableOpacity style={styles.backWrap} onPress={() => navigation.goBack()}>
                <Image source={require('../../img/back_gray.png')} resizeMode="contain" />
            </TouchableOpacity>
        ),
        headerRight:(
            <View></View>
        )
    });


    constructor(){
        super()
        this.state = {
            loading:false,
            avatar:global.user.avatar?{uri:global.user.avatar}:global.user.politicalStatus == 1?require('../../img/defultPartyIcon.png'):require('../../img/personAvatar.png'),
            nickName:global.user.nickName?global.user.nickName:global.user.mobilePhone,
            age:global.user.age!==undefined?global.user.age:'',
            gender:global.user.gender?global.user.gender:'-',
            education:global.user.education?global.user.education:'-',
            occupation:global.user.occupation?global.user.occupation:'-',
            isPartyMember:global.user.isPartyMember!=undefined?global.user.isPartyMember?'是':'否':'-',
            politicalName:'',
            partyName:global.user.partyName?global.user.partyName:'',
            volunteerName: global.user.volunteerName?global.user.volunteerName:'',
            employeeNumber:global.user.isEmployee?global.user.employeeNumber:'-',
            tempEmployeeNumber: ''
        };

    }

    componentWillMount(){
        if(global.user.politicalStatus != undefined) {
            if(global.user.politicalStatus == 1) {
                this.setState({
                    politicalName: '中共党员',
                });
            } else if(global.user.politicalStatus == 2) {
                this.setState({
                    politicalName: '群众',
                });
            } else if(global.user.politicalStatus == 3) {
                this.setState({
                    politicalName: '共青团员',
                });
            } else if(global.user.politicalStatus == 4) {
                this.setState({
                    politicalName: '民主党派',
                });
            }
        } else {
            this.setState({
                politicalName: '-',
            });
        }
    }

    componentDidMount(){


    }

    check(select){

        if (select==0){
            //更新头像
            ImagePicker.showImagePicker(options, (response) => {
                console.log('Response = ', response);

                if (response.didCancel) {
                    console.log('用户取消了选择！');
                }
                else if (response.error) {
                    xnToast('相册访问失败,请重新尝试或检查是否开启相册权限');
                }
                else {

                    let fileName = response.fileName ? response.fileName : response.uri.substring(response.uri.lastIndexOf('/')+1);
                    xnService.getAccess({name:fileName}).then((data) => {
                        if(data.message){
                            xnToast(data.message);
                            return;
                        }
                        if(data.errors.length > 0) {
                            xnToast(data.errors[0].message);
                        }else{
                            NativeModules.BlueToolManage.simpleUpload(data.accessKeyId,data.accessKeySecret,data.securityToken,data.info.endpoint,data.info.bucket,fileName,response.path || response.uri).then((res) => {
                                let extension = res.substring(res.lastIndexOf('.')+1).toLowerCase();
                                let params = {
                                    userId: global.user.id,
                                    avatar: res,
                                };
                                this.setState({
                                    loading:true
                                });
                                xnService.undateAvatar(params).then((data) => {
                                    this.setState({
                                        loading: false
                                    });
                                    if (data.message) {
                                        xnToast(data.message);
                                        return;
                                    }
                                    if (data.errors.length > 0) {
                                        xnToast(data.errors[0].message);
                                    } else {
                                        global.user.avatar = res;
                                        DeviceEventEmitter.emit('updateAvatar');
                                        this.setState({
                                            avatar:global.user.avatar?{uri:global.user.avatar}:require('../../img/personAvatar.png')
                                        })
                                    }
                                })
                            })
                        }
                    })

                }
            });
        }else if (select == 1) {
            //更新昵称
            this.props.navigation.navigate('ChangeUserInfo',{title:'修改昵称',defultValue:this.state.nickName || '',type:'nickName',callback:()=>{
                this.setState({
                    nickName:global.user.nickName,
                });
                DeviceEventEmitter.emit('updateAvatar');

            }});

        }else if (select == 2) {
            //更新性别
            let itemList=['男','女'];
            this.props.navigation.navigate('ChooseUserInfo',{title:'修改性别',defultValue:this.state.gender,itemList:itemList,type:'gender',callback:()=>{
                this.setState({
                    gender:global.user.gender,
                })
            }});
        }else if (select == 3) {
            //更新年龄
            this.props.navigation.navigate('ChangeUserInfo',{title:'修改年龄',defultValue:this.state.age,type:'age',callback:()=>{
                this.setState({
                    age:global.user.age,
                })
            }});
        }else if (select == 4) {
            //更新学历
            let itemList = ['小学','初中','中专/高中','专科/本科','硕士研究生','博士研究生'];
            this.props.navigation.navigate('ChooseUserInfo',{title:'设置学历',defultValue:this.state.education,itemList:itemList,type:'education',callback:()=>{
                this.setState({
                    education:global.user.education,
                })
            }});

        }else if (select == 5) {
            //更新职业
            let itemList = ['公务员','事业单位职工','公司职员','退休人员','自由职业者','学生','其他'];
            this.props.navigation.navigate('ChooseUserInfo',{title:'设置职业',defultValue:this.state.occupation,itemList:itemList,type:'occupation',callback:()=>{
                this.setState({
                    occupation:global.user.occupation,

                })
            }});

        }else if (select == 6) {
            //更新政治面貌
            let itemList = ['中共党员','群众','共青团员','民主党派'];
            this.props.navigation.navigate('ChooseUserInfo',{title:'政治面貌',defultValue:this.state.politicalName,itemList:itemList,type:'partyMember',callback:()=>{
                if(global.user.politicalStatus == 1) {
                    this.setState({
                        politicalName: '中共党员',
                    });
                } else if(global.user.politicalStatus == 2) {
                    this.setState({
                        politicalName: '群众',
                    });
                } else if(global.user.politicalStatus == 3) {
                    this.setState({
                        politicalName: '共青团员',
                    });
                } else if(global.user.politicalStatus == 4) {
                    this.setState({
                        politicalName: '民主党派',
                    });
                }
            }});
        }else if (select == 7) {
            //更新员工认证
            this.props.navigation.navigate('IOSScan',{callBack:this.callBackBarcode});
        }else if (select == 8) {
            //更新活动一
            this.props.navigation.navigate('ChooseActivityAttribute',{title:'平安地铁先锋行',defultValue:this.state.partyName,callback:()=>{
                this.setState({
                    partyName:global.user.partyName,
                })
            }});
        }else if (select == 9) {
            //更新活动二
            this.props.navigation.navigate('chooseVolunteerActivity',{title:'上海市平安志愿者',defultValue:this.state.volunteerName,callback:()=>{
                this.setState({
                    volunteerName:global.user.volunteerName,
                })
            }});
        }
    }

    // 扫描
    callBackBarcode=(barcode) => {
        // console.log(barcode,'---------------------------');
        if(this.state.tempEmployeeNumber === barcode.split('-')[0]) {
            return;
        }
        let _this = this;
        let code = barcode.split('-')[0];
        this.setState({
            tempEmployeeNumber: code,
            loading: true,
        });
        xnService.updateUserCompany({ userId: global.user.id, userCode: code }).then((data) => {
            _this.setState({
                loading: false,
            });
            if(data.code != '0') {
                Alert.alert(
                    '认证失败',
                    '员工编号无效！',
                    [
                        { text: '确定', onPress: () =>  _this.setState({ tempEmployeeNumber: '' })},
                    ],
                    { cancelable: false },
                )
            } else {
                _this.setState({
                    employeeNumber: code,
                });
            }
        });
    };


    row(v,i){
        return (
            <TouchableOpacity style={[styles.row,{marginTop: (i === 0 || i === 6) ? 10 : 0, borderBottomWidth: (i === 5 || i === 7 || i === 9) ? 0 : 1}]} key={i}
                              onPress={()=>{this.check(i)}}>
                <Text style={[styles.title,{fontSize:(i===8||i===9) ? 14 : 16}]}>{v.name}</Text>
                {v.img&&<Image style={styles.img} defaultSource={global.user.politicalStatus == 1?require('../../img/defultPartyIcon.png'):require('../../img/personAvatar.png')} source={v.img} resizeMode={'cover'}/>}
                <Text style={styles.text}>{v.text}</Text>
                <Image style={styles.icon} source={require('../../img/arrow_right.png')} resizeMode={'contain'}/>
            </TouchableOpacity>
        )
    }

    render(){

        return(
            <View style={styles.bg}>
                <StatusBar barStyle={'default'}/>
                <ScrollView >
                    {this.row({name:'头像',img:this.state.avatar},0)}
                    {this.row({name:'昵称',text:this.state.nickName},1)}
                    {this.row({name:'性别',text:this.state.gender=='M'?'男':this.state.gender=='-'?'-':'女'},2)}
                    {this.row({name:'年龄',text:this.state.age},3)}
                    {this.row({name:'学历',text:this.state.education},4)}
                    {this.row({name:'职业',text:this.state.occupation},5)}
                    {this.row({name:'政治面貌',text:this.state.politicalName},6)}
                    {this.row({name:'员工认证',text:this.state.employeeNumber},7)}
                    <View style={[styles.row,{marginTop:10,borderBottomWidth:1}]}>
                        <Text style={[styles.title,{fontSize:16}]}>所属类别</Text>
                    </View>
                    {this.row({name:'平安地铁先锋行',text:this.state.partyName},8)}
                    {this.row({name:'上海市平安志愿者',text:this.state.volunteerName},9)}
                </ScrollView>
                {this.state.loading && <View style={styles.loadingBg}>
                    <ActivityIndicator size="large" />
                </View>}
            </View>
        )
    }
}
const styles = StyleSheet.create({
    backWrap: {
        justifyContent: 'center',
        paddingLeft: 18.5/zoomW,
        paddingRight: 18.5/zoomW,
        height: 44/zoomH,
    },
    back: {
        width: 8.5/zoomW,
        height: 15/zoomH,
    },
    bg:{
        flex:1,
        backgroundColor:'#f6f6f6',
    },
    row:{
        height:44/zoomH,
        flexDirection:'row',
        paddingHorizontal:15/zoomW,
        alignItems:'center',
        borderBottomColor:'#dddddd',
        backgroundColor:'white'
    },
    title:{
        color:'#4b4b4b',
        flex:1
    },
    text:{
        color:'#8c8c8c',
        fontSize:14,
        marginRight:14/zoomW
    },
    img:{
        width:31/zoomW,
        height:31/zoomW,
        borderRadius:31/zoomW/2,
    },
    loadingBg:{
        width:'100%',
        height:'100%',
        position:'absolute',
        display:'flex',
        alignItems:'center',
        justifyContent:'center'
    },
});