<%@ page language="java" contentType="text/html; charset=UTF-8"
	pageEncoding="UTF-8"%>
<!-- <div class="alert x-alert-warning">
					<h3>温馨提示：</h3>
					<ul class="x-menu text-muted">
						<li>请填写您的企业资料和管理员信息，其中带<span class="x-text-inverse">&nbsp;*&nbsp;</span>的输入项必须填写
						</li>
						<li>填写完成请点击下一步，待工作人员审核您的注册信息后，将会以邮件形式通知您审核结果</li>
						<li>如有疑问，欢迎致电客服热线：400-830-1818，感谢您对优软科技产品的关注</li>
					</ul>
				</div> -->
<div class="x-form-wrap">
	<form class="form-horizontal x-form" novalidate>
		<!-- 分组1-企业信息 Start -->
		<div class="x-form-set-wrap">
			<div class="x-form-set-header">
				<h4>企业注册信息</h4>
			</div>
			<input type="hidden" name="pageToken" value="${pageToken}">
			<div class="x-form-set">
				<div class="form-group">
					<label class="control-label col-sm-2 x-required">企业名称：</label>
					<div class="col-sm-5">
						<input type="text" class="form-control x-input" name="name"
							required placeholder="填写营业执照上的企业名称" x-help-by="name_help" x-error-text="请填写正确的企业名称，2~99个字符"
							x-error-by="name_err"  x-minlength="2" x-maxlength="99" />
					</div>
					<div class="x-input-addon col-sm-5">
						<div id="name_help" class="x-text-help" style="display: none">
							<i class="glyphicon glyphicon-ok x-icon-left"></i>
						</div>
						<div id="name_err" class="x-text-error" style="display: none">请填写正确的企业名称，2~99个字符</div>
					</div>
				</div>
				<div class="form-group">
					<label class="control-label col-sm-2 x-required">企业简称：</label>
					<div class="col-sm-5">
						<input type="text" class="form-control x-input" name="shortName"
							required placeholder="请填写正确的企业名称，2~40个字符" x-error-text="请填写正确的企业名称，2~40个字符"
							   x-help-by="shortName_help" x-error-by="shortName_err" x-maxlength="40" x-minlength="2">
					</div>
					<div class="x-input-addon col-sm-5">
						<div id="shortName_help" class="x-text-help" style="display: none">
							<i class="glyphicon glyphicon-ok x-icon-left"></i>
						</div>
						<div id="shortName_err" class="x-text-error" style="display: none">请填写正确的企业简称，2~40个字符</div>
					</div>
				</div>
				<div class="form-group">
					<label class="control-label col-sm-2 x-required">营业执照：</label>
					<div class="col-sm-5">
						<a class="btn btn-block x-btn x-btn-blank x-input-file-wrap"><i
							class="glyphicon glyphicon-picture x-icon-left"></i>点击上传营业执照扫描件（≤5M的图片或PDF）<input
							type="file" id="businessImage" class="x-input" name="file"
							required x-error-text="请上传营业执照扫描件（≤5M的图片或PDF）"
							x-error-by="file_error" x-help-by="file_help"
							arias-preview="businessImagePreview"
							arias-file-info="businessImageTip"></a>
						<div id="businessImagePreview" class="help-block"
							style="display: none">
							<div class="x-image">
								<a href="javascript:void(0);" class="thumbnail x-btn-image">
									<img /> <span>预览</span>
								</a>
							</div>
						</div>
						<p id="businessImageTip" class="help-block alert x-alert-warning"
							style="display: none">
							<i class="glyphicon glyphicon-saved x-icon-left"></i><span></span>
						</p>
					</div>
					<div class="x-input-addon col-sm-5">
						<div id="file_help" class="x-text-help" style="display: none">
							<i class="glyphicon glyphicon-ok x-icon-left"></i>
						</div>
						<!-- <div class="x-text-help" id="file_help">
							<i class="glyphicon glyphicon-question-sign x-icon-left"></i>什么是营业执照？<a
								class="x-btn-image x-text-link" href="javascript:void(0);"
								data-src="static/img/demo/yyzz.png">查看范例</a>
						</div> -->
						<div id="file_error" class="x-text-error" style="display: none"></div>
					</div>
				</div>
				<!-- TODO:考虑可以不用填营业执照号 -->
				<div class="form-group">
					<label class="control-label col-sm-2 x-required">营业执照号：</label>
					<div class="col-sm-5">
						<input type="text" class="form-control x-input"
							name="businessCode" required placeholder="填写营业执照上的注册号"
							x-help-by="businessCode_help" x-error-by="businessCode_err"
							c-error-text="请填写营业执照上的注册号" x-maxlength="60" x-pattern="^[A-Za-z0-9]+$">
					</div>
					<div class="x-input-addon col-sm-5">
						<div id="businessCode_help" class="x-text-help" style="display: none">
							<i class="glyphicon glyphicon-ok x-icon-left"></i>
						</div>
						<div id="businessCode_err" class="x-text-error"
							style="display: none">请填写营业执照上的注册号
						</div>
					</div>
				</div>
				<div class="form-group hidden">
					<label class="control-label col-sm-2">注册地区：</label>
					<div class="col-sm-5">
						<label class="radio-inline"> <input type="radio"
							name="area" value="中国大陆" checked> 中国大陆
						</label> <label class="radio-inline"> <input type="radio"
							name="area" value="中国香港"> 中国香港
						</label> <label class="radio-inline"> <input type="radio"
							name="area" value="中国台湾"> 中国台湾
						</label> <label class="radio-inline"> <input type="radio"
							name="area" value="其他"> 其他
						</label>
					</div>
					<div class="x-input-addon col-sm-5">
						<div class="x-text-error" style="display: none"></div>
					</div>
				</div>
				<div class="form-group">
					<label class="control-label col-sm-2">企业地址：</label>
					<div class="col-sm-5 dropdown x-has-feedback-left">
						<input type="text" id="address"
							class="form-control x-input x-addr-box dropdown-toggle"
							name="address" readonly placeholder="填写总部所在地详细地址"
							data-toggle="dropdown" aria-haspopup="true" aria-expanded="false">
						<span
							class="glyphicon glyphicon-map-marker x-form-control-feedback-left"></span>
						<div class="dropdown-menu x-union-menu" aria-labelledby="address">
							<div class="x-union-header">
								<div>省份</div>
								<div>城市</div>
								<div>县区</div>
								<div class="x-item-ext">详细地址</div>
							</div>
							<div class="x-union-list">
								<ul class="list-unstyled">
								</ul>
								<ul class="list-unstyled">
								</ul>
								<ul class="list-unstyled">
								</ul>
								<div class="x-item-ext">
									<div class="form-group">
										<div class="col-sm-12">
											<textarea id="street" name="street" rows="4"
												class="form-control x-input" placeholder="xx路xx大厦xx栋xx楼xx室"></textarea>
										</div>
									</div>
									<div class="text-right">
										<a class="btn btn-sm x-btn x-btn-primary x-btn-ok">确定</a> <a
											class="btn btn-sm x-btn x-btn-blank x-btn-cancel">取消</a>
									</div>
								</div>
							</div>
						</div>
					</div>
					<div class="x-input-addon col-sm-5">
						<div class="x-text-error" style="display: none"></div>
					</div>
				</div>
				<!-- <div class="form-group">
					<label class="control-label col-sm-2">所属行业：</label>
					<div class="col-sm-5">
						<label class="radio-inline"> <input type="radio"
							name="industry" value="make" checked> 制造型
						</label> <label class="radio-inline"> <input type="radio"
							name="industry" value="trade"> 贸易型
						</label>
					</div>
					<div class="x-input-addon col-sm-5">
						<div class="x-text-info"></div>
						<div class="x-text-error" style="display: none"></div>
					</div>
				</div> -->
				<div class="form-group">
					<label class="control-label col-sm-2">官网地址：</label>
					<div class="col-sm-5 x-has-feedback-left">
						<input type="text" class="form-control x-input" name="url"
							id="url" placeholder="www.example.com" style="padding-left: 55px">
						<span class="x-form-control-feedback-left x-text-bold"
							style="width: 65px">http://</span>
					</div>
					<div class="x-input-addon col-sm-5">
						<div class="x-text-error" style="display: none"></div>
					</div>
				</div>
			</div>
		</div>
		<!-- 分组2-管理员信息 Start -->
		<div class="x-form-set-wrap">
			<div class="x-form-set-header">
				<h4>绑定管理员</h4>
			</div>
			<div class="x-form-set">
				<div class="form-group">
					<label class="control-label col-sm-2 x-required">姓名：</label>
					<div class="col-sm-5">
						<input type="text" class="form-control x-input" name="adminName"
							required placeholder="例如：张三" x-maxlength="20"
							x-error-by="adminName_err" x-help-by="adminName_help" x-minlength="2" x-error="请填写管理员姓名，不超过20个字">
					</div>
					<div class="x-input-addon col-sm-5">
						<div id="adminName_help" class="x-text-help" style="display: none">
							<i class="glyphicon glyphicon-ok x-icon-left"></i>
						</div>
						<div id="adminName_err" class="x-text-error" style="display: none">请填写正确的管理员姓名，2~20个字符</div>
					</div>
				</div>
				<div class="form-group">
					<label class="control-label col-sm-2 x-required">手机号：</label>
					<div class="col-sm-5">
						<input type="text" class="form-control x-input" name="adminTel"
							required placeholder="例如：15818181818" x-pattern="^[\d-]{8,}$"
							x-error-by="adminTel_err" x-help-by="adminTel_help" x-error-text="请填写正确的手机号">
					</div>
					<div class="x-input-addon col-sm-5">
						<div id="adminTel_help" class="x-text-help" style="display: none">
							<i class="glyphicon glyphicon-ok x-icon-left"></i>
						</div>
						<div id="adminTel_err" class="x-text-error" style="display: none">请填写正确的手机号</div>
					</div>
				</div>
				<div class="form-group">
					<label class="control-label col-sm-2 x-required">邮箱：</label>
					<div class="col-sm-5">
						<input type="text" class="form-control x-input" name="adminEmail"
							required placeholder="例如：zhangsan@example.com" x-error-text="请填写正确的邮箱地址"
							x-pattern="^\w+([-+.]\w+)*@\w+([-.]\w+)*\.\w+([-.]\w+)*$"
							x-help-by="adminEmail_help" x-error-by="adminEmail_err">
					</div>
					<div class="x-input-addon col-sm-5">
						<div id="adminEmail_help" class="x-text-help" style="display: none">
							<i class="glyphicon glyphicon-ok x-icon-left"></i>
						</div>
						<div class="x-text-tip">
							<i class="glyphicon glyphicon-info-sign x-icon-left"></i>注册成功后我们将发邮件到该邮箱，请及时查收
						</div>
						<div id="adminEmail_err" class="x-text-error"
							style="display: none">请填写正确的邮箱地址
						</div>
					</div>
				</div>
				<div class="form-group">
					<label class="control-label col-sm-2 x-required">验证码：</label>
					<div class="col-sm-5 x-has-feedback-left">
						<button type="button" class="btn x-form-control-feedback-left x-btn-checkcode" disabled="disabled" style="width: 130px">
							<span>获取验证码</span><span class="x-timeout-word" style="display: none;"><span class="x-timeout-num">60</span>秒</span>
						</button>
						<input type="text" style="display: none;padding-left: 140px" class="form-control x-input" name="checkcode"
							   required placeholder="手机或邮箱收到的6位数字" x-pattern="^\d{6}$"
							   x-help-by="checkcode_help" x-error-by="checkcode_err">
					</div>
					<div class="x-input-addon col-sm-5">
						<div id="checkcode_help" class="x-text-help" style="display: none">
							<i class="glyphicon glyphicon-ok x-icon-left"></i>
						</div>
						<%--<div id="checkcode_help" class="x-text-help">
							<i class="glyphicon glyphicon-info-sign x-icon-left"></i>手机和邮箱都可以接收到
						</div>--%>
						<div class="x-text-tip">
							<i class="glyphicon glyphicon-info-sign x-icon-left"></i>手机和邮箱都可以接收到
						</div>
						<div id="checkcode_err" class="x-text-error"
							 style="display: none">填写您的手机短信或邮箱收到的6位数字
						</div>
					</div>
				</div>
				<input type="hidden" name="checkcodeToken" required x-error-text="请先获取验证码，然后输入验证码">
			</div>
		</div>
		<!-- -->
		<div class="x-form-set-wrap">
			<div class="x-form-set" style="margin-left: 100px">
				<div class="form-group">
					<div class="col-sm-8">
						<label class="checkbox-inline"> <input type="checkbox"
							id="agree" name="agree" value="1" checked="checked" required
							x-error-text="您还未同意服务协议"> 我已阅读并同意<a
							href="http://www.usoftmall.com/help#/issue/50" target="_blank" class="x-btn-item x-text-link" id="modaltrigger">《优软商城服务条款》</a>、<a
									href="http://www.usoftmall.com/help#/issue/16" target="_blank" class="x-btn-item x-text-link">《优软商城买卖条例》</a>
						</label>
					</div>
				</div>
				<div class="form-group">
					<div class="col-sm-4">
						<a class="btn x-btn-primary x-btn-submit btn-block"> 下一步 </a>
						<!-- add class "disabled" to avoid click -->
					</div>
				</div>
			</div>
		</div>
	</form>
</div>