var AuthContact = React.createClass({
    mixins: [FormMixin],
    shouldUpdate: false,
    getInitialState() {
        return {
          registrantType: 'none',
          idType: '1',
          idCode: '',
          idImg: '',
          userRegion: '1',
          orgIdType: '1',
          orgIdCode: '',
          orgIdImg: '',
          posting: 'none' 
        }
    },
    handleId(id){
        if(!id) return id;
        var y = (id.slice(6,8)|0)  >= 35? '19':'20';
        var ret = id.slice(0,6) + y +id.slice(6);
        return ret; 
    },
    getParam() {
      let ret = {
          registrantType: {'none':1,'block':2}[this.state.registrantType],
          idType: this.state.idType,
          idCode: (this.state.registrantType === 'none' &&  this.state.idType === '1')? this.handleId(this.state.id) :  this.state.idCode,
          idImg: this.state.idImg,
          userRegion: this.state.userRegion
      };
      if(this.state.registrantType==='block'){
        ret.orgType = this.state.orgType,
        ret.orgIdType = this.state.orgIdType,
        ret.orgIdCode = this.state.orgIdCode,
        ret.orgIdImg = this.state.orgIdImg
      }
      return ret;
    },
    handleSubmit(e) {
        this.state.posting = 'block';
        this.forceUpdate();
        api.uploadRegistrant(this.state.id, this.getParam(), function(code, data) {
            switch(code) {
            case '1000':
                this.props.onFinish();
                break;
            case '2501':
                logout();
                break;
            default:
                this.state.value = data;
                this.forceUpdate();
            }
        }.bind(this));
    },
    render() {      
            
            return (
                <div>
                    <div style={{display: (this.state.status || this.state.description)? 'block':'none'}} className="status-content">
                      <p style={{display: this.state.status? 'block':'none'}}><label>状态：</label>{this.state.status}</p>
                      <p style={{display: this.state.description? 'block':'none'}}><label>原因：</label>{this.state.description}</p>
                    </div>
                    <table className="formtable" border="0">
                        <tbody>
                        <tr align="center">
                          <td colSpan="2">{this.props.children}</td>
                        </tr>
                        <tr>
                          <td colSpan="2" height="16"></td>
                        </tr>
                        <tr>
                          <td>认证方式：</td>
                          <td>
                            <label><input {...this.linkState({
                                name: 'registrantType',
                                type: 'radio',
                                value: 'none'
                            })}/>个人认证</label>
                            <label><input {...this.linkState({
                                name: 'registrantType',
                                type: 'radio',
                                value: 'block'
                            })}/>企业认证</label>
                          </td>
                        </tr>
                        <tr>
                          <td>注册人姓名：</td>
                          <td>{this.state.name}</td>
                        </tr>
                        <tr>
                          <td>证件类型：</td>
                          <td>
                            <label><input {...this.linkState({
                                name: 'idType',
                                type: 'radio',
                                value: '1'
                            })}/>身份证</label>
                            <label><input {...this.linkState({
                                name: 'idType',
                                type: 'radio',
                                value: '3'
                            })}/>护照</label>
                            <label><input {...this.linkState({
                                name: 'idType',
                                type: 'radio',
                                value: '6'
                            })}/>港澳居民来往内地通行证</label>
                            <label><input {...this.linkState({
                                name: 'idType',
                                type: 'radio',
                                value: '12'
                            })}/>台湾居民来往大陆通行证</label>
                            <label><input {...this.linkState({
                                name: 'idType',
                                type: 'radio',
                                value: '13'
                            })}/>外国人永久居留身份证</label>
                            <label><input {...this.linkState({
                                name: 'idType',
                                type: 'radio',
                                value: '28'
                            })}/>港澳居民居住证</label>
                            <label><input {...this.linkState({
                                name: 'idType',
                                type: 'radio',
                                value: '29'
                            })}/>台湾居民居住证</label>
                          </td>
                        </tr>
                        <tr>
                          <td>证件号码：</td>
                          <td>
                            <label style={{display: (this.state.registrantType === 'none' &&  this.state.idType === '1')? 'block':'none'}}>{this.handleId(this.state.id)}</label>
                            <input style={{display: (this.state.registrantType === 'block' || this.state.idType != '1')? 'block':'none'}} {...this.linkState({
                                type: 'text',
                                name: 'idCode',
                                size: '32',
                                maxLength: '18'
                            })}/>
                          </td>
                        </tr>
                        <tr style={{display: this.state.registrantType}}>
                          <td>企业名称：</td>
                          <td>{this.state.org}</td>
                        </tr>
                        <tr style={{display: this.state.registrantType}}>
                          <td>企业类型：</td>
                          <td>
                            <label><input {...this.linkState({
                                name: 'orgType',
                                type: 'radio',
                                value: '1'
                            })}/>个体</label>
                            <label><input {...this.linkState({
                                name: 'orgType',
                                type: 'radio',
                                value: '2'
                            })}/>工商</label>
                          </td>
                        </tr>
                        <tr style={{display: this.state.registrantType}}>
                          <td>组织证明证件类型：</td>
                          <td>
                            <SelectOrgIdType className="sel" {...this.linkState({name: 'orgIdType'})} />&nbsp;&nbsp;请选择合适的证件类型
                          </td>
                        </tr>
                        <tr style={{display: this.state.registrantType}}>
                          <td>组织证明证件号码：</td>
                          <td>
                            <input {...this.linkState({
                                type: 'text',
                                name: 'orgIdCode',
                                size: '32',
                                maxLength: '32'
                            })}/>
                          </td>
                        </tr>
                        <tr>
                          <td>用户类型：</td>
                          <td>
                            <label><input {...this.linkState({
                                name: 'userRegion',
                                type: 'radio',
                                checked: 'checked',
                                value: '1'
                            })}/>国内用户</label>
                            <label><input {...this.linkState({
                                name: 'userRegion',
                                type: 'radio',
                                value: '2'
                            })}/>国外用户</label>
                          </td>
                        </tr>
                        <tr>
                          <td>联系人证件图片：</td>
                          <td>
                            <input {...this.linkState({
                                name: "idImg",
                                type: "file",
                                accept: "image/png,image/jpeg,image/bmp"
                            })}/><em className="red block"></em>
                          <label className="block">要求原始图片大小介于5k-5m之间，格式为jpg、bmp或png</label>
                          </td>
                        </tr>
                        <tr style={{display: this.state.registrantType}}>
                          <td>组织证件图片：</td>
                          <td>
                            <input {...this.linkState({
                                name: "orgIdImg",
                                type: "file",
                                accept: "image/png,image/jpeg,image/bmp"
                            })}/><em className="red block"></em>
                          <label className="block">要求原始图片大小介于5k-5m之间，格式为jpg、bmp或png</label>
                          </td>
                        </tr>
                        <tr>
                          <td colSpan="2" height="16"></td>
                        </tr>
                        <tr align="center">
                          <td colSpan="2"><input type="button" value="提交" onClick={this.handleSubmit} /></td>
                        </tr>
                        </tbody>
                    </table>      
                  <OpResult content={this.state.value} />
                </div>
            );
    }
});

