import React from "react";
import { Row, Col ,Message} from "antd";
import API from "@/api";
import {getCookie} from "@/util"
import {
    backgroundOptions,
    curStatuOptions,
    nationOptions,
    politicsOptions,
    marriageOptions,
    accountCharacterOptions
} from "@/data";
import "./preview.scss";

export default class Admin extends React.Component {
    constructor(props) {
        super(props);
        this.initState();
    }

    state = {
        department: "", //应聘岗位
        name: "", //姓名
        sallary: "", //期望薪资
        idPhoto: "", //证件照
        lifePhoto: "", //生活照
        personalInfo: {
            curStatus: 0, //目前状态
            sex: 1, //性别[1:男,0:女]
            nation: 0, //民族
            belief: "", //宗教信仰
            healthy: "", //健康状况
            diseases: "", //重大疾病史
            nativePlace: "", //籍贯
            politics: 0, //政治面貌
            marriage: 0, //婚姻状况
            registration: "", //户口所在地
            accountCharacter: 0, //户口性质
            address: "", //家庭详细住址
            dateOfBirth: null, //出生日期
            height: null, //身高
            foreign: "", //外语及程度
            skillCertificate: "", //技能证书
            skillType: "", //职称及类别
            fristWork: null //首次参加工作时间
        },
        identity: "", //身份证号
        phone: "", //手机号码
        urgentPhone: "", //紧急联系人[姓名_电话_关系]
        email: "", //个人邮箱
        eduExperience: [
            {
                education: 0
            }
        ], //教育经历
        workExperience: {}, //工作经历
        plan: "", //三年内职业规划
        description: "", //自我评价
        agree: true,
        npProvince: "北京市", //籍贯-省
        npCity: 0, //籍贯-市
        loading: false
    };

    async initState() {
        let id = this.props.match.params.id
        let username = getCookie('username')
        let yyuid = getCookie('yyuid')

        if (!(username && yyuid)) {
            Message.error("请先用多玩YY登录")
            return;
        }
        try {
            let { data } = await API.user.preview({ id:id,userId: getCookie('username')});
            if(!data) Message.error("该用户不存在")
            let assginData = {};
            for (let i in data) {
                if (data[i] && this.state.hasOwnProperty(i)) {
                    //工作经验
                    if (
                        i === "workExperience" ||
                        i === "eduExperience" ||
                        i === "personalInfo"
                    ) {
                        try {
                            let info = JSON.parse(data[i]);
                            assginData[i] = info;

                            if (i === "personalInfo" && info.nativePlace) {
                                let arr = info.nativePlace.split("-");
                                assginData["npProvince"] = arr[0];
                                assginData["npCity"] = arr[1];
                            }
                        } catch (error) {
                            break;
                        }
                    } else {
                        assginData[i] = data[i];
                    }
                }
            }

            this.setState(Object.assign(this.state, assginData));
        } catch (error) {
            Message.error(error);
        }
    }

    render() {
        return (
            <div className="page-preview">
                <div className="mod-photo">
                    <div className="img-wrap">
                        <img src={this.state.idPhoto} alt="" />
                    </div>
                </div>
                <div className="mod-normal">
                    <h2 className="mod-title">应聘信息</h2>
                    <Row>
                        <Col span={10}>
                            <b>应聘岗位</b>：{this.state.department}
                        </Col>
                        <Col span={10} offset={4}>
                            <b>期望薪资</b>：{this.state.sallary}
                        </Col>
                    </Row>
                    <Row>
                        <Col span={10}>
                            <b>目前状态</b>：
                            {curStatuOptions[this.state.personalInfo.curStatus]}
                        </Col>
                    </Row>
                </div>
                <div className="mod-normal">
                    <h2 className="mod-title">基本信息</h2>
                    <Row>
                        <Col span={10}>
                            <b>姓名</b>：{this.state.name}
                        </Col>
                        <Col span={10} offset={4}>
                            <b>性别</b>：
                            {this.state.personalInfo.sex === 1 ? "男" : "女"}
                        </Col>
                    </Row>
                    <Row>
                        <Col span={10}>
                            <b>民族</b>：
                            {nationOptions[this.state.personalInfo.nation]}
                        </Col>
                        <Col span={10} offset={4}>
                            <b>宗教信仰</b>：{this.state.personalInfo.belief||"--"}
                        </Col>
                    </Row>
                    <Row>
                        <Col span={10}>
                            <b>健康状况</b>：{this.state.personalInfo.healthy}
                        </Col>
                        <Col span={10} offset={4}>
                            <b>重大疾病史</b>：
                            {this.state.personalInfo.diseases}
                        </Col>
                    </Row>
                    <Row>
                        <Col span={10}>
                            <b>籍贯省市</b>：
                            {this.state.personalInfo.nativePlace}
                        </Col>
                        <Col span={10} offset={4}>
                            <b>政治面貌</b>：
                            {politicsOptions[this.state.personalInfo.politics]}
                        </Col>
                    </Row>
                    <Row>
                        <Col span={10}>
                            <b>身份证号</b>：{this.state.identity}
                        </Col>
                        <Col span={10} offset={4}>
                            <b>婚姻状况</b>：
                            {marriageOptions[this.state.personalInfo.marriage]}
                        </Col>
                    </Row>
                    <Row>
                        <Col span={10}>
                            <b>户口所在地</b>：
                            {this.state.personalInfo.registration}
                        </Col>
                        <Col span={10} offset={4}>
                            <b>户口性质</b>：
                            {
                                accountCharacterOptions[
                                    this.state.personalInfo.accountCharacter
                                ]
                            }
                        </Col>
                    </Row>
                    <Row>
                        <Col span={10}>
                            <b>家庭详细住址</b>：
                            {this.state.personalInfo.address}
                        </Col>
                        <Col span={10} offset={4}>
                            <b>出生日期</b>：
                            {this.state.personalInfo.dateOfBirth||"--"}
                        </Col>
                    </Row>
                    <Row>
                        <Col span={10}>
                            <b>身高</b>：
                            {this.state.personalInfo.height || "--"}
                        </Col>
                        <Col span={10} offset={4}>
                            <b>外语及程度</b>：{this.state.personalInfo.foreign || "--"}
                        </Col>
                    </Row>
                    <Row>
                        <Col span={10}>
                            <b>技能证书</b>：
                            {this.state.personalInfo.skillCertificate || "--"} 
                        </Col>
                        <Col span={10} offset={4}>
                            <b>职称及类别</b>：
                            {this.state.personalInfo.skillType || "--"}
                        </Col>
                    </Row>
                    <Row>
                        <Col span={10}>
                            <b>首次参加工作时间</b>：
                            {this.state.personalInfo.fristWork || "--"}
                        </Col>
                    </Row>
                    <h2 className="mod-title">通讯信息</h2>
                    <Row>
                        <Col span={10}>
                            <b>手机号码</b>：{this.state.phone}
                        </Col>
                        <Col span={10} offset={4}>
                            <b>其他联系人号码/关系</b>：{this.state.urgentPhone || "--"}
                        </Col>
                    </Row>
                    <Row>
                        <Col span={10}>
                            <b>个人邮箱</b>：{this.state.email}
                        </Col>
                    </Row>
                </div>
                <div className="mod-normal">
                    <h2 className="mod-title">教育经历</h2>
                    {this.state.eduExperience.map((item,index) => {
                        return (
                            <div key={index}>
                                <Row>
                                    <Col span={10}>
                                        <b>起止日期</b>：{item.startDate} 至 {item.endDate}
                                    </Col>
                                    <Col span={10} offset={4}>
                                        <b>毕业学校</b>：{item.school}
                                    </Col>
                                </Row>
                                <Row>
                                    <Col span={10}>
                                        <b>学历</b>：{backgroundOptions[item.education]}
                                    </Col>
                                    <Col span={10} offset={4}>
                                        <b>专业名称</b>：{item.major}
                                    </Col>
                                </Row>
                                <Row>
                                    <Col span={10}>
                                        <b>毕业时间/学制</b>：{item.educationBg}
                                    </Col>
                                </Row>
                            </div>
                        );
                    })}
                </div>
                <div className="mod-normal">
                    <h2 className="mod-title">工作经历</h2>
                    <Row>
                        <Col span={10}>
                            <b>起止日期</b>：
                            {this.state.workExperience.startDate} 至  {this.state.workExperience.endDate}
                        </Col>
                        <Col span={10} offset={4}>
                            <b>任职公司</b>：{this.state.workExperience.company|| "--"}
                        </Col>
                    </Row>
                    <Row>
                        <Col span={10}>
                            <b>职位</b>：{this.state.workExperience.position|| "--"}
                        </Col>
                        <Col span={10} offset={4}>
                            <b>税前月薪</b>：{this.state.workExperience.sally|| "--"}
                        </Col>
                    </Row>
                    <Row>
                        <Col span={10}>
                            <b>离职原因</b>：
                            {this.state.workExperience.reason || "--"}
                        </Col>
                        <Col span={10} offset={4}>
                            <b>证明人及电话</b>：
                            {this.state.workExperience.witness}-
                            {this.state.workExperience.witnessPhone}
                        </Col>
                    </Row>
                </div>
                <div className="mod-normal">
                    <h2 className="mod-title">自我描述</h2>
                    <Row>
                        <b>三年内职业规划</b>：
                        <div>{this.state.plan}</div>
                    </Row>
                    <Row>
                        <b>工作业绩与自我评价</b>：
                        <div>{this.state.description}</div>
                    </Row>
                </div>
                <div className="mod-normal">
                    <h2 className="mod-title">其他</h2>
                    <Row>
                        <b>生活照</b>：
                        <div className="life-photo"><img src={this.state.lifePhoto} alt="" /></div>
                    </Row>
                </div>
            </div>
        );
    }
}
