335 lines
12 KiB
Plaintext
335 lines
12 KiB
Plaintext
|
@{Layout = null; }
|
|||
|
|
|
|||
|
|
<!doctype html>
|
|||
|
|
<html>
|
|||
|
|
<head>
|
|||
|
|
<meta charset="UTF-8">
|
|||
|
|
<title>预约信息</title>
|
|||
|
|
<meta name="viewport" content="width=device-width,initial-scale=1,minimum-scale=1,maximum-scale=1,user-scalable=no" />
|
|||
|
|
<link href="../css/mui.min.css" rel="stylesheet" />
|
|||
|
|
<link rel="stylesheet" href="../css/bootstrap.min.css" />
|
|||
|
|
<link href="../Content/bootstrap.css" rel="stylesheet">
|
|||
|
|
<!--css样式-->
|
|||
|
|
<style type="text/css">
|
|||
|
|
|
|||
|
|
body, html {
|
|||
|
|
width: 100%;
|
|||
|
|
height: 100%;
|
|||
|
|
position: relative;
|
|||
|
|
background: #FFFFFF;
|
|||
|
|
font-size: 14px;
|
|||
|
|
}
|
|||
|
|
/*主体*/
|
|||
|
|
.mui-content {
|
|||
|
|
width: 100%;
|
|||
|
|
height: auto;
|
|||
|
|
padding: 18% 5% 15% 5%;
|
|||
|
|
background: #FFFFFF;
|
|||
|
|
}
|
|||
|
|
|
|||
|
|
.mui-input-row {
|
|||
|
|
margin-bottom: 15px;
|
|||
|
|
}
|
|||
|
|
|
|||
|
|
.mui-input-row label {
|
|||
|
|
text-align: right;
|
|||
|
|
width: 37%;
|
|||
|
|
line-height: 20px;
|
|||
|
|
padding: 11px 10px;
|
|||
|
|
}
|
|||
|
|
|
|||
|
|
.mui-input-row label ~ input, .mui-input-row label ~ select, .mui-input-row label ~ textarea {
|
|||
|
|
border: 1px solid rgba(0,0,0,0.2);
|
|||
|
|
padding-left: 8px;
|
|||
|
|
width: 63%;
|
|||
|
|
font-size: 14px;
|
|||
|
|
}
|
|||
|
|
|
|||
|
|
#codeBtn {
|
|||
|
|
position: absolute;
|
|||
|
|
right: 3px;
|
|||
|
|
top: 3px;
|
|||
|
|
padding: 6px 7px;
|
|||
|
|
}
|
|||
|
|
/*按钮*/
|
|||
|
|
.mui-bar {
|
|||
|
|
-webkit-box-shadow: none;
|
|||
|
|
box-shadow: none;
|
|||
|
|
height: 40px;
|
|||
|
|
}
|
|||
|
|
|
|||
|
|
#submitBtn {
|
|||
|
|
position: absolute;
|
|||
|
|
height: 100%;
|
|||
|
|
border-color: #007aff;
|
|||
|
|
border-radius: 0;
|
|||
|
|
background: #007aff;
|
|||
|
|
color: #FFFFFF;
|
|||
|
|
}
|
|||
|
|
|
|||
|
|
#checkBox {
|
|||
|
|
position: absolute;
|
|||
|
|
top: 0;
|
|||
|
|
z-index: 999;
|
|||
|
|
display: table-cell;
|
|||
|
|
vertical-align: middle;
|
|||
|
|
background: url(../Images/wenjuan.png);
|
|||
|
|
background-size: 100% 100%;
|
|||
|
|
background-repeat: no-repeat;
|
|||
|
|
width: 100%;
|
|||
|
|
height: 100%;
|
|||
|
|
font-size: 18px;
|
|||
|
|
font-weight: bold;
|
|||
|
|
text-align: center;
|
|||
|
|
padding-top:40%;
|
|||
|
|
}
|
|||
|
|
</style>
|
|||
|
|
</head>
|
|||
|
|
<body>
|
|||
|
|
<!--页面主体-->
|
|||
|
|
<div class="mui-content">
|
|||
|
|
<form id="dataForm">
|
|||
|
|
<div class="mui-input-row">
|
|||
|
|
<label>预约时间：</label>
|
|||
|
|
<input type="text" id="date3" data-options="{'type':'YYYY-MM-DD','beginYear':2010,'endYear':2088}" placeholder="预约时间" name="order_date">
|
|||
|
|
|
|||
|
|
</div>
|
|||
|
|
<div class="mui-input-row">
|
|||
|
|
<label>预约地点：</label>
|
|||
|
|
@Html.DropDownList("test_org", ViewBag.JGList as IEnumerable<SelectListItem>, new { id = "test_org" })
|
|||
|
|
</div>
|
|||
|
|
<div class="mui-input-row">
|
|||
|
|
<label>手机号码：</label>
|
|||
|
|
<input type="text" class="mui-input-clear" placeholder="请输入手机号码" name="phone" value="" id="phone">
|
|||
|
|
|
|||
|
|
</div>
|
|||
|
|
<div class="mui-input-row">
|
|||
|
|
<label></label>
|
|||
|
|
<input type="number" class="mui-input-clear" placeholder="短信验证码" name="yzm">
|
|||
|
|
<button class="btn mui-btn-blue" type="button" id="codeBtn" onclick="fnShowCode()">获取验证码</button>
|
|||
|
|
</div>
|
|||
|
|
</form>
|
|||
|
|
</div>
|
|||
|
|
<div class="modal fade" id="loadingModal">
|
|||
|
|
<div style="position: relative;top: 30%;">
|
|||
|
|
<div style="width: 100%;background: transparent;text-align: center;">
|
|||
|
|
<img src="../Images/5-1503130Q911.gif" style="margin: 25px 0;width: 7%;" />
|
|||
|
|
</div>
|
|||
|
|
</div>
|
|||
|
|
<h5 style="position: relative;top: 30%;color:#fff;text-align: center;font-size: 16px;margin: 15px 0 ;"> <strong>正在保存...请稍等！</strong> </h5>
|
|||
|
|
</div>
|
|||
|
|
<div id="checkBox" v-if="state == 0">
|
|||
|
|
{{message}}
|
|||
|
|
</div>
|
|||
|
|
<nav class="mui-bar mui-bar-tab">
|
|||
|
|
<input type="button" class="mui-btn mui-btn-block mui-btn-primary" value="提交" id="submitBtn" />
|
|||
|
|
</nav>
|
|||
|
|
<!--js内容-->
|
|||
|
|
<script src="../js/mui.min.js"></script>
|
|||
|
|
<script type="text/javascript" src="../js/common.js"></script>
|
|||
|
|
<script type="text/javascript" src="../js/jquery-2.1.0.js"></script>
|
|||
|
|
<script type="text/javascript" src="../js/jquery.date.js"></script>
|
|||
|
|
<script type="text/javascript" src="../js/bootstrap.min.js"></script>
|
|||
|
|
<script type="text/javascript" src="../js/vue.min.js"></script>
|
|||
|
|
<script type="text/javascript" src="http://res.wx.qq.com/open/js/jweixin-1.2.0.js"></script>
|
|||
|
|
|
|||
|
|
<script type="text/javascript">
|
|||
|
|
wx.config({
|
|||
|
|
debug: false, //是否调试，true，会弹窗
|
|||
|
|
appId: '@dccdc.Common.Global.InfectionAppId', //得到这个东西，首先必须有一个公众号，或者企业号，如果已经拥有了，你可以就知道AppId在哪里了。
|
|||
|
|
timestamp: '@ViewBag.timeStamp',//生成签名的时间戳，随机数，之后会用这个生成一个签名
|
|||
|
|
nonceStr: '@ViewBag.nonceStr',//生成签名的随机串，随机串，之后会用这个生成一个签名
|
|||
|
|
signature: '@ViewBag.signature',//这个就是签名了，在步骤4，我会详细讲解
|
|||
|
|
jsApiList: [
|
|||
|
|
'onMenuShareTimeline',
|
|||
|
|
'onMenuShareAppMessage',
|
|||
|
|
'onMenuShareQQ',
|
|||
|
|
'onMenuShareWeibo',
|
|||
|
|
'onMenuShareQZone'
|
|||
|
|
]
|
|||
|
|
});
|
|||
|
|
|
|||
|
|
wx.ready(function () {
|
|||
|
|
wx.checkJsApi({
|
|||
|
|
jsApiList: [
|
|||
|
|
'onMenuShareTimeline',
|
|||
|
|
'onMenuShareAppMessage',
|
|||
|
|
'onMenuShareQQ',
|
|||
|
|
'onMenuShareWeibo',
|
|||
|
|
'onMenuShareQZone'
|
|||
|
|
], // 需要检测的JS接口列表，所有JS接口列表见附录2,
|
|||
|
|
success: function (res) {
|
|||
|
|
// 以键值对的形式返回，可用的api值true，不可用为false
|
|||
|
|
// 如：{"checkResult":{"chooseImage":true},"errMsg":"checkJsApi:ok"}
|
|||
|
|
}
|
|||
|
|
});
|
|||
|
|
var shareUrl = 'http://oa.dcqcdc.com/dccdc/infection/tjfx2?id=@ViewBag.id&recommend=@ViewBag.recommend&name=@ViewBag.name';
|
|||
|
|
var obj = {//朋友圈
|
|||
|
|
title: '德城健康e路', // 分享标题
|
|||
|
|
desc: '@ViewBag.name 邀请您参与德城区卡车司机健康促进项目！', // 分享描述
|
|||
|
|
link: shareUrl, // 分享链接，该链接域名或路径必须与当前页面对应的公众号JS安全域名一致
|
|||
|
|
// 该链接是重定向链接，因为需要获取用户code，但是该链接又无法直接写微信获取code的链接，
|
|||
|
|
// 所以需要点击后重新加载新的页面，来实现重定向，重新打开获取code的微信链接，实现获取用户信息的功能；
|
|||
|
|
imgUrl: '@ViewBag.license', // 分享图标
|
|||
|
|
fail: function (res) {
|
|||
|
|
alert(JSON.stringify(res));
|
|||
|
|
},
|
|||
|
|
success: function (res) {
|
|||
|
|
}
|
|||
|
|
};
|
|||
|
|
|
|||
|
|
// 2.1 监听“分享给朋友”，按钮点击、自定义分享内容及分享结果接口
|
|||
|
|
wx.onMenuShareAppMessage(obj);
|
|||
|
|
// 2.2 监听“分享到朋友圈”按钮点击、自定义分享内容及分享结果接口
|
|||
|
|
wx.onMenuShareTimeline(obj);
|
|||
|
|
// 2.3 监听“分享到QQ”按钮点击、自定义分享内容及分享结果接口
|
|||
|
|
wx.onMenuShareQQ(obj);
|
|||
|
|
// 2.4 监听“分享到微博”按钮点击、自定义分享内容及分享结果接口
|
|||
|
|
wx.onMenuShareWeibo(obj);
|
|||
|
|
// 2.5 监听“分享到QZone”按钮点击、自定义分享内容及分享接口
|
|||
|
|
wx.onMenuShareQZone(obj);
|
|||
|
|
});
|
|||
|
|
$.date('#date3');
|
|||
|
|
var yzmid, status, message ;
|
|||
|
|
window.onload = function () {
|
|||
|
|
mui.init()
|
|||
|
|
var url1 = "@Url.Action("checkTestState")";/*serverurl + "/Infection/SaveData_Test";*/
|
|||
|
|
$.ajax(url1, {
|
|||
|
|
type: "post",
|
|||
|
|
dataType: "text",
|
|||
|
|
success: function(data) {
|
|||
|
|
if (data) {
|
|||
|
|
var dataLists = JSON.parse(data)
|
|||
|
|
status = dataLists.State;
|
|||
|
|
message = dataLists.Message;
|
|||
|
|
var app = new Vue({
|
|||
|
|
el:"#checkBox",
|
|||
|
|
data:{
|
|||
|
|
state: status,
|
|||
|
|
message: message
|
|||
|
|
}
|
|||
|
|
})
|
|||
|
|
}
|
|||
|
|
|
|||
|
|
},
|
|||
|
|
error: function(a, b, c) {
|
|||
|
|
//alert(JSON.stringify(a))
|
|||
|
|
$("#loadingModal").modal('hide');
|
|||
|
|
mui.toast("ajax传输失败2");
|
|||
|
|
}
|
|||
|
|
})
|
|||
|
|
|
|||
|
|
$("#submitBtn")[0].addEventListener("tap", function () {
|
|||
|
|
|
|||
|
|
//$("#loadingModal").modal('show');
|
|||
|
|
var keyvalues = getForm2("dataForm");
|
|||
|
|
//姓名
|
|||
|
|
if(keyvalues["order_date"] == "" || keyvalues["order_date"].length == 0){
|
|||
|
|
mui.toast("请填写预约时间");
|
|||
|
|
return;
|
|||
|
|
}
|
|||
|
|
/*//身份证号
|
|||
|
|
keyvalues["ident"] = id;*/
|
|||
|
|
if (keyvalues["test_org"] == "" || keyvalues["test_org"] == "0") {
|
|||
|
|
mui.toast("请选择预约地点");
|
|||
|
|
return;
|
|||
|
|
}
|
|||
|
|
|
|||
|
|
//手机号
|
|||
|
|
if(keyvalues["phone"] == "" || keyvalues["phone"].length == 0){
|
|||
|
|
mui.toast("请填写手机号码");
|
|||
|
|
return;
|
|||
|
|
}
|
|||
|
|
|
|||
|
|
//手机号
|
|||
|
|
if(keyvalues["phone"].length != 11){
|
|||
|
|
mui.toast("请填写正确手机号码");
|
|||
|
|
return;
|
|||
|
|
}
|
|||
|
|
//验证码
|
|||
|
|
if(keyvalues["yzm"].length == 0 || keyvalues["yzm"] == ""){
|
|||
|
|
mui.toast("请填写验证码");
|
|||
|
|
return;
|
|||
|
|
}
|
|||
|
|
keyvalues["yzmid"] = yzmid;
|
|||
|
|
$("#loadingModal").modal({ backdrop: "static", keyboard: false });
|
|||
|
|
var url1 = "@Url.Action("SaveData_Test")";/*serverurl + "/Infection/SaveData_Test";*/
|
|||
|
|
$.ajax(url1, {
|
|||
|
|
data: keyvalues,
|
|||
|
|
type: "post",
|
|||
|
|
dataType: "text",
|
|||
|
|
success: function(data) {
|
|||
|
|
$("#loadingModal").modal('hide');
|
|||
|
|
mui.toast(data)
|
|||
|
|
if (data == "预约成功!") {
|
|||
|
|
@*mui.openWindow({
|
|||
|
|
url: '@Url.Action("userSubscribe")', //通过URL传参
|
|||
|
|
id: 'userSubscribe'
|
|||
|
|
})*@
|
|||
|
|
WeixinJSBridge.call('closeWindow');
|
|||
|
|
}
|
|||
|
|
},
|
|||
|
|
error: function(a, b, c) {
|
|||
|
|
//alert(JSON.stringify(a))
|
|||
|
|
$("#loadingModal").modal('hide');
|
|||
|
|
mui.toast("ajax传输失败2");
|
|||
|
|
}
|
|||
|
|
})
|
|||
|
|
})
|
|||
|
|
}
|
|||
|
|
|
|||
|
|
|
|||
|
|
|
|||
|
|
|
|||
|
|
|
|||
|
|
var countdown=59;
|
|||
|
|
function fnShowCode(){
|
|||
|
|
var code = document.getElementById("code");
|
|||
|
|
var codeBtn = document.getElementById("codeBtn");
|
|||
|
|
var phone = document.getElementById("phone");
|
|||
|
|
var url1 = "@Url.Action("getsjyzm")";/*serverurl + "/Infection/getsjyzm";*/
|
|||
|
|
$.ajax(url1, {
|
|||
|
|
data: {
|
|||
|
|
Mobile:phone.value
|
|||
|
|
},
|
|||
|
|
type: "post",
|
|||
|
|
dataType: "text",
|
|||
|
|
success: function(data) {
|
|||
|
|
if(data){
|
|||
|
|
var item = JSON.parse(data);
|
|||
|
|
//alert(JSON.stringify(item))
|
|||
|
|
yzmid = item["Message"];
|
|||
|
|
//alert(yzmid)
|
|||
|
|
}
|
|||
|
|
},
|
|||
|
|
error: function(a, b, c) {
|
|||
|
|
$.toast("ajax传输失败2");
|
|||
|
|
}
|
|||
|
|
})
|
|||
|
|
if(!phone){
|
|||
|
|
mui.toast("请输入手机号");
|
|||
|
|
}
|
|||
|
|
settime();
|
|||
|
|
}
|
|||
|
|
|
|||
|
|
//构造一个倒计时函数叫settime
|
|||
|
|
function settime(obj) {
|
|||
|
|
//开始判断倒计时是否为0
|
|||
|
|
if (countdown == '-1') {
|
|||
|
|
$('#codeBtn').attr("disabled", false);
|
|||
|
|
$('#codeBtn').css("background-color", "red");
|
|||
|
|
$('#codeBtn').text("重新获取验证码");
|
|||
|
|
countdown = 59;
|
|||
|
|
} else {
|
|||
|
|
$('#codeBtn').attr("disabled", true);
|
|||
|
|
$('#codeBtn').css("background-color", "gray");
|
|||
|
|
$('#codeBtn').text("重新发送"+countdown+"S");
|
|||
|
|
countdown--;
|
|||
|
|
setTimeout(function () {
|
|||
|
|
settime()
|
|||
|
|
}, 1000);//1s后执行settime（）函数；
|
|||
|
|
};
|
|||
|
|
}
|
|||
|
|
</script>
|
|||
|
|
</body>
|
|||
|
|
</html>
|