|
|
|
|
<!DOCTYPE html>
|
|
|
|
|
<html lang="en">
|
|
|
|
|
<head>
|
|
|
|
|
<meta charset="UTF-8">
|
|
|
|
|
<title>在线体验</title>
|
|
|
|
|
<link rel="stylesheet" href="css/common.css">
|
|
|
|
|
<link rel="stylesheet" href="css/experience.css"/>
|
|
|
|
|
<link rel="stylesheet" href="css/bootstrap.min.css">
|
|
|
|
|
<link href="images/favicon.ico" rel="icon" type="image/x-icon" />
|
|
|
|
|
<script src="js/jquery-1.8.3.min.js"></script>
|
|
|
|
|
<script src="js/index.js"></script>
|
|
|
|
|
<script src="js/axios.min.js"></script>
|
|
|
|
|
<script src="https://cdn.staticfile.org/jquery/2.1.1/jquery.min.js"></script>
|
|
|
|
|
<script src="https://cdn.staticfile.org/twitter-bootstrap/3.3.7/js/bootstrap.min.js"></script>
|
|
|
|
|
</head>
|
|
|
|
|
<body>
|
|
|
|
|
<div id="wrap">
|
|
|
|
|
<div id="banner" class="header clearfix">
|
|
|
|
|
<div class="inner">
|
|
|
|
|
<div class="fl bannerLogo logo"></div>
|
|
|
|
|
<div class="fl logoName">汇盈帮手</div>
|
|
|
|
|
<div class="fr list" toUrl="aboutUs.html">关于我们</div>
|
|
|
|
|
<div class="fr list on" toUrl="">在线体验</div>
|
|
|
|
|
<div class="fr list" toUrl="information.html">公司资讯</div>
|
|
|
|
|
<div class="fr list" toUrl="index.html">产品介绍</div>
|
|
|
|
|
</div>
|
|
|
|
|
</div>
|
|
|
|
|
<div class="bg">
|
|
|
|
|
<div class="inner">
|
|
|
|
|
<div class="holderDiv"></div>
|
|
|
|
|
<div class="stepsWords clearfix">
|
|
|
|
|
<div class="steps-left fl"></div>
|
|
|
|
|
<div class="steps-title">在线体验</div>
|
|
|
|
|
<div class="steps-right fr"></div>
|
|
|
|
|
</div>
|
|
|
|
|
<div class="application clearfix">
|
|
|
|
|
<div class="application-left fl">
|
|
|
|
|
<img src="images/orange-logo.png" alt="" class="orange-logo">
|
|
|
|
|
<a href="http://demo.huiybs.cn/common/login" style="font-size:15px;color:red;display: inline-block;margin-top:80px;" target="_blank">跳转系统</a>
|
|
|
|
|
</div>
|
|
|
|
|
<div class="application-right fr">
|
|
|
|
|
<div class="application-right-title">在线体验</div>
|
|
|
|
|
<form class="form-horizontal" role="form">
|
|
|
|
|
<div class="form-group">
|
|
|
|
|
<label for="firstname" class="col-xs-3 col-sm-3 control-label" style="text-align: left">名字</label>
|
|
|
|
|
<div class="col-xs-9 col-sm-9">
|
|
|
|
|
<input type="text" class="form-control" id="firstname" placeholder="请输入名字" style="height:50px;">
|
|
|
|
|
</div>
|
|
|
|
|
</div>
|
|
|
|
|
<div class="form-group">
|
|
|
|
|
<label for="phone" class="col-xs-3 col-sm-3 control-label" style="text-align: left">电话</label>
|
|
|
|
|
<div class="col-xs-9 col-sm-9">
|
|
|
|
|
<input type="text" class="form-control" maxlength="11" id="phone" placeholder="请输入电话号" style="height:50px;">
|
|
|
|
|
</div>
|
|
|
|
|
</div>
|
|
|
|
|
<div class="form-group" style="position: relative">
|
|
|
|
|
<label for="code" class="col-xs-3 col-sm-3 control-label" style="text-align: left">验证码</label>
|
|
|
|
|
<div class="col-xs-9 col-sm-9">
|
|
|
|
|
<input type="text" class="form-control" id="code" placeholder="请输入验证码" style="height:50px;">
|
|
|
|
|
<div class="verification-code">验证码</div>
|
|
|
|
|
</div>
|
|
|
|
|
</div>
|
|
|
|
|
<div class="form-group">
|
|
|
|
|
<div class="col-xs-10 col-sm-offset-2 col-sm-10">
|
|
|
|
|
<!-- <div class="btn btn-warning login" style="font-size:20px;line-height: 32px;" data-toggle="modal" data-target="#myModal">登录</div>-->
|
|
|
|
|
<div class="btn btn-warning login" style="font-size:20px;line-height: 32px;">登录</div>
|
|
|
|
|
<!-- 模态框（Modal） -->
|
|
|
|
|
<!-- <div class="modal fade" id="myModal" tabindex="-1" role="dialog" aria-labelledby="myModalLabel" aria-hidden="true">-->
|
|
|
|
|
<!-- <div class="modal-dialog">-->
|
|
|
|
|
<!-- <div class="modal-content" style="width:300px;margin:100px auto;">-->
|
|
|
|
|
<!-- <div class="modal-header">-->
|
|
|
|
|
<!-- <button type="button" class="close" data-dismiss="modal" aria-hidden="true">-->
|
|
|
|
|
<!-- ×-->
|
|
|
|
|
<!-- </button>-->
|
|
|
|
|
<!-- <h4 class="modal-title" id="myModalLabel">-->
|
|
|
|
|
<!-- 汇盈帮手车险业务系统账号密码-->
|
|
|
|
|
<!-- </h4>-->
|
|
|
|
|
<!-- </div>-->
|
|
|
|
|
<!-- <div class="modal-body">-->
|
|
|
|
|
<!-- <div>账号：<span class="account">暂无</span></div>-->
|
|
|
|
|
<!-- <div>密码：<span class="password">暂无</span></div>-->
|
|
|
|
|
<!-- </div>-->
|
|
|
|
|
<!-- <div class="modal-footer">-->
|
|
|
|
|
<!-- <button type="button" class="btn btn-default" style="width:48%;" data-dismiss="modal">关闭</button>-->
|
|
|
|
|
<!-- <button type="button" class="btn btn-primary" style="width:48%;" data-dismiss="modal">确定</button>-->
|
|
|
|
|
<!-- </div>-->
|
|
|
|
|
<!-- </div>-->
|
|
|
|
|
<!-- </div>-->
|
|
|
|
|
<!-- </div>-->
|
|
|
|
|
</div>
|
|
|
|
|
</div>
|
|
|
|
|
</form>
|
|
|
|
|
|
|
|
|
|
</div>
|
|
|
|
|
</div>
|
|
|
|
|
</div>
|
|
|
|
|
</div>
|
|
|
|
|
|
|
|
|
|
<!--main over-->
|
|
|
|
|
|
|
|
|
|
<div id="footerBlock" class="footer">
|
|
|
|
|
<div class="footerContent">
|
|
|
|
|
<div class="record">备案号：京ICP备19053938号</div>
|
|
|
|
|
<div class="record1 clearfix">
|
|
|
|
|
<div class="address fl">公司地址：北京市丰台区卢沟桥路西五里店59号</div>
|
|
|
|
|
<div class="phone fl">
|
|
|
|
|
<img src="images/jurassic_phone.png" alt="" class="footer-img">
|
|
|
|
|
<span style="vertical-align: middle">电话：15811367527</span>
|
|
|
|
|
</div>
|
|
|
|
|
<div class="phone fl">
|
|
|
|
|
<img src="images/youxiang.png" alt="" class="footer-img1">
|
|
|
|
|
<span style="vertical-align: middle">邮箱：847787950@qq.com</span>
|
|
|
|
|
</div>
|
|
|
|
|
</div>
|
|
|
|
|
<div class="logo footer-logo"></div>
|
|
|
|
|
</div>
|
|
|
|
|
</div>
|
|
|
|
|
</div>
|
|
|
|
|
</body>
|
|
|
|
|
<script>
|
|
|
|
|
$(function () {
|
|
|
|
|
var baseUrl = 'http://demo.huiybs.cn/api/';
|
|
|
|
|
$(".verification-code").click(function () {
|
|
|
|
|
var phone=$('#phone').val();//手机号码的值
|
|
|
|
|
var mobileReg = /^[1](([3][0-9])|([4][5-9])|([5][0-3,5-9])|([6][5,6])|([7][0-8])|([8][0-9])|([9][1,8,9]))[0-9]{8}$/; //手机号正则
|
|
|
|
|
var phoneflag = mobileReg.test(phone);
|
|
|
|
|
var _this=$(this);
|
|
|
|
|
if(!phoneflag){
|
|
|
|
|
alert('手机号码格式不正确！');
|
|
|
|
|
}else{
|
|
|
|
|
$.ajax({
|
|
|
|
|
url:baseUrl+'sms-verify-code',
|
|
|
|
|
type: 'post',
|
|
|
|
|
dataType: 'json',
|
|
|
|
|
data: {
|
|
|
|
|
mobile:phone
|
|
|
|
|
},
|
|
|
|
|
success:function(data) {
|
|
|
|
|
console.log(data);
|
|
|
|
|
_this.attr("disabled", "disabled");
|
|
|
|
|
_this.css({background:"#f1ca94"});//设置不可点颜色
|
|
|
|
|
var val = parseInt(_this.html());
|
|
|
|
|
var time = 60;
|
|
|
|
|
_this.html(time + " S");
|
|
|
|
|
time--;
|
|
|
|
|
var timer = setInterval(function() {
|
|
|
|
|
val = time + " S";
|
|
|
|
|
_this.html(val);
|
|
|
|
|
if (time > 0) {
|
|
|
|
|
time--;
|
|
|
|
|
} else {
|
|
|
|
|
//原始颜色
|
|
|
|
|
_this.html("验证码").removeAttr("disabled").css({background:"#f0ad4e"});
|
|
|
|
|
clearInterval(timer);
|
|
|
|
|
}
|
|
|
|
|
}, 1000);
|
|
|
|
|
}
|
|
|
|
|
})
|
|
|
|
|
}
|
|
|
|
|
});
|
|
|
|
|
$(".login").click(function () {
|
|
|
|
|
var name=$('#firstname').val();
|
|
|
|
|
var phone=$('#phone').val();
|
|
|
|
|
var code=$("#code").val();
|
|
|
|
|
if(name===''){
|
|
|
|
|
alert('请填写名字');
|
|
|
|
|
}else if(phone===''){
|
|
|
|
|
alert('请填写电话号');
|
|
|
|
|
}else if(code===''){
|
|
|
|
|
alert('请填写验证码');
|
|
|
|
|
}else{
|
|
|
|
|
$.ajax({
|
|
|
|
|
url: baseUrl + 'register',
|
|
|
|
|
type: 'post',
|
|
|
|
|
dataType: 'json',
|
|
|
|
|
data: {
|
|
|
|
|
name: name,
|
|
|
|
|
mobile: phone,
|
|
|
|
|
code:code
|
|
|
|
|
},
|
|
|
|
|
success: function (data) {
|
|
|
|
|
console.log(data);
|
|
|
|
|
if(data.code===0){
|
|
|
|
|
console.log(data.data.username);
|
|
|
|
|
console.log(data.data.password);
|
|
|
|
|
alert("\n汇盈帮手车险业务系统\n\n账号："+data.data.username+"\n密码："+data.data.password);
|
|
|
|
|
}else if(data.code===-1){
|
|
|
|
|
alert('请填入正确内容');
|
|
|
|
|
}
|
|
|
|
|
}
|
|
|
|
|
});
|
|
|
|
|
}
|
|
|
|
|
});
|
|
|
|
|
|
|
|
|
|
})
|
|
|
|
|
</script>
|
|
|
|
|
</html>
|
