Skip to content

任超 / js.portalStaticPage

Go to a project
Toggle navigation
Toggle navigation pinning
724036db by 焦小希
Options

我的预约接口联调

1 parent 86f11914
Inline Side-by-side
Showing 10 changed files with 352 additions and 176 deletions
......@@ -348,6 +348,10 @@
text-align: center;
line-height: 130px;
}
.business_item{
margin-bottom: 10px;
overflow: hidden;
}
.business_item ul {
display: inline-block;
width: 80%;
......@@ -372,10 +376,10 @@
width: 100%;
height: 100%;
}
.business_item ul .item_appoint:hover {
/* .business_item ul .item_appoint:hover {
background-color: #0091FF;
color: #fff;
}
} */
.isAppoint {
cursor:not-allowed!important;
}
......
......@@ -38,3 +38,23 @@ function GetQueryString(name) {
var r = window.location.search.substr(1).match(reg);
if (r!=null) return (r[2]); return null;
}
// 存储cookie
function setCookie(resdata,duration){
var date = new Date();
date.setTime(date.getTime() + duration*24*3600*1000);
document.cookie = "myCookie=" + JSON.stringify(resdata)
+ "; expires=" +date.toGMTString() + "; path=/";
// document.cookie = " myCookie =" + JSON.stringify(resdata) + ';expires=' + date.toGMTString();
};
//获取cookie
function getCookie(){
var str = document.cookie;
if(str == ''){
return false
}else{
$('.PersonLogin').css('pointer-events', 'none')
var arr = str.replace(/(\s)+/g,'').split('=');
return JSON.parse(arr[1]);
}
};
\ No newline at end of file
......
......@@ -75,3 +75,4 @@ document.writeln("");
document.writeln("</html>");
document.writeln("<script type='text/javascript' src=\'" + localhostPaht + "/staticLib/layui/layui.js\'></script>");
document.writeln("<script src=\'https://at.alicdn.com/t/font_2174584_1j8kvwarwge.js\'></script>");
\ No newline at end of file
......
......@@ -32,8 +32,11 @@ $(document).on('click', '#loginButton', function(){
userLoginRequest.username = username
userLoginRequest.password = password
clicklogin(userLoginRequest)
// layer.closeAll()
layer.closeAll()
});
$(function(){
$('.PersonLogin').html(getCookie().username)
})
// 点击注册的时候
$(document).on('click', '#registerButton', function(){
// layer.closeAll()
......@@ -49,11 +52,16 @@ function clicklogin(data){
dataType: "json",
data:JSON.stringify(data),//***关键******
success: function (result) {//返回数据根据结果进行相应的处理
if (result.code == 200 && result.data != null) {
console.log(232323,result)
console.log(222,result)
if(result.code ==200 && result.data!==null){
setCookie(result.data)
$('.PersonLogin').html(getCookie().username)
}else if(result.code ==500){
window.open(`${localhostPaht}/staticViews/register.html`,'_self')
}
}
});
});
}
\ No newline at end of file
......
......@@ -3,7 +3,7 @@ $(function () {
var province = undefined
var city = undefined
// 办事大厅
var halloffice = '不夜城'
var jgid = '不夜城'
$('.area_list li').click(function () {
$(".area_list li").removeClass("activeRegion")
$(this).addClass("activeRegion");
......@@ -137,6 +137,8 @@ $(function () {
$(this).addClass("active2");
var index = $(this).index();
console.log(4444,index)
jgid = $(this).data('id')
console.log(jgid)
})
infoWindow.addEventListener('close', function (type, target, point) {
$('.office_halls li').eq(0).removeClass('hallActive')
......@@ -153,7 +155,7 @@ $(function () {
_initData()
// 下一步
$('.nextButton').click(function(){
window.open("./yysj.html?halloffice="+halloffice+"","_self")
window.open("./yysj.html?jgid="+jgid+"","_self")
})
})
function _initData() {
......
$(function () {
var latitude =undefined
var longitude =undefined
var orgname = undefined
layui.use('element', function () {
let element = layui.element; //导航的hover效果、二级菜单等功能，需要依赖element模块
//监听导航点击
......@@ -8,7 +11,7 @@ $(function () {
});
// 地图
var map = new BMap.Map('container');
var point = new BMap.Point(108.95346, 34.265725);
var point = new BMap.Point(longitude, latitude);
map.centerAndZoom(point, 15);
// 创建点标记
var marker = new BMap.Marker(point);
......@@ -17,13 +20,73 @@ $(function () {
var opts = {
width: 200,
height: 100,
title: '不夜城'
title: orgname
};
var infoWindow = new BMap.InfoWindow('大唐不夜城', opts);
var infoWindow = new BMap.InfoWindow( orgname, opts);
// 点标记添加点击事件
map.openInfoWindow(infoWindow, point); // 开启信息窗口
marker.addEventListener('click', function () {
map.openInfoWindow(infoWindow, point); // 开启信息窗口
});
map.enableScrollWheelZoom();
getAppointmentDetail()
});
// GET 根据预约信息标识码appointmentId查看预约详情
function getAppointmentDetail(){
$.ajax({
type: "get", //提交方式
url:
portal.api_url + "/portal/appointmentmh/getAppointmentDetail",
data: {
appointmentId: GetRequest(),
},
dataType: "json",
//数据，这里使用的是Json格式进行传输
success: function (result) {
//返回数据根据结果进行相应的处理
if (result.code == 200) {
var renegeCounttotal =undefined
console.log('ff',result)
$('#username').text(result.data.username)
$('#zjhm').text(result.data.zjhm)
$('#orgName').text(result.data.orgName)
$('#hbShortname').text(result.data.hbShortname)
$('#reservationNumber').text(result.data.reservationNumber)
console.log(result.data.bookingDate.substr(0,4))
var year = result.data.bookingDate.substr(0,4) + '年'
var month = result.data.bookingDate.substr(4,2) + '月'
var day= result.data.bookingDate.substr(6,2) + '日'
var startTime= result.data.startTime + '至'
var endTime= result.data.endTime
var yysjtotal = year + month + day + startTime + endTime
$('#yysj').text(yysjtotal)
if(result.data.renegeCount == null){
renegeCounttotal = 0
}else{
renegeCounttotal = result.data.renegeCount
}
$('#renegeCount').html(renegeCounttotal)
$('#renegeCount').css('color','red')
longitude= result.data.longitude
latitude= result.data.latitude
orgname= result.data.orgName
}
},
});
}
function GetRequest() {
var url = location.search; //获取url中"?"符后的字串
var theRequest = new Object();
if (url.indexOf("?") != -1) {
var str = url.substr(1);
strs = str.split("?");
for (var i = 0; i < strs.length; i++) {
theRequest[strs[i].split("=")[0]] = decodeURIComponent(
strs[i].split("=")[1]
);
}
}
return theRequest.appointmentId;
}
\ No newline at end of file
......
$(function () {
var Date = undefined;
var appuintText = undefined
var bustime = undefined;
// 国有房屋无业点击选中记录
var busIndex = undefined
// 办事中心
var halloffice = undefined
var data = {
'dateList': [
{
week: '星期一',
date: '10月15号'
},
{
week: '星期二',
date: '10月16号'
},
{
week: '星期三',
date: '10月17号'
},
{
week: '星期二',
date: '10月18号'
},
{
week: '星期五',
date: '10月19号'
},
{
week: '星期六',
date: '10月19号'
}
],
"busList": [{
startTime: "09:30",
endTime: "10:30",
orgBusinessList: [
{
shortName: "一般抵押登记",
isyy: 1,
residueNumber: "约满"
},
{
shortName: "查封/解封登记",
isyy: 1,
residueNumber: "约满"
},
{
shortName: "有证房抵押首次登记",
isyy: 1,
residueNumber: "约满"
},
{
shortName: "商品房抵押登记",
isyy: 0,
residueNumber: "余3位"
}
]
}],
};
var Date = undefined;
var appuintText = undefined;
var bustime = undefined;
// 获取当前选中的日期
data.dateList[0].isSelect = true
for (var i = 0; i < data.dateList.length; i++) {
if (data.dateList[i].isSelect) {
Date = data.dateList[i].date
bustime = data.dateList[i].week
}
};
layui.use('element', function () {
// 国有房屋无业点击选中记录
var busIndex = undefined;
// 机构id
var jgid = undefined;
getAppointmentDay();
layui.use("element", function () {
let element = layui.element; //导航的hover效果、二级菜单等功能，需要依赖element模块
//监听导航点击
element.on('nav(demo)', function (elem) {
element.on("nav(demo)", function (elem) {
layer.msg(elem.text());
});
});
function a(i) {
Date = data.dateList[i].date
bustime = data.dateList[i].week
$(".swiper-slide").eq(i).addClass('active1').siblings().removeClass('active1');
Date = data.dateList[i].jyjh;
bookingDate = data.dateList[i].bookingDate;
bustime = data.dateList[i].week;
getAppointmentPeriodAndBusiness()
$(".swiper-slide")
.eq(i)
.addClass("active1")
.siblings()
.removeClass("active1");
}
layui.use('laytpl', function () {
laytpl = layui.laytpl;
var getTpl = document.getElementById('date').innerHTML
, view = document.getElementById('swiperDate');
laytpl(getTpl).render(data, function (html) {
view.innerHTML = html;
});
var getTpl1 = document.getElementById('business_item').innerHTML
, view1 = document.getElementById('business_list');
laytpl(getTpl1).render(data, function (html) {
view1.innerHTML = html;
});
});
var swiper = new Swiper('.swiper-container', {
var swiper = new Swiper(".swiper-container", {
slidesPerView: 5,
spaceBetween: 20,
slidesPerGroup: 1,
......@@ -106,55 +35,83 @@ $(function () {
observeParents: true,
on: {
click: function (swiper) {
var index = swiper['clickedIndex'];
console.log(index)
var index = swiper["clickedIndex"];
a(index);
}
},
},
loopFillGroupWithBlank: true,
navigation: {
nextEl: '.swiper-button-next',
prevEl: '.swiper-button-prev',
nextEl: ".swiper-button-next",
prevEl: ".swiper-button-prev",
},
});
function handle(){
layui.use('layer', function () {
function handle() {
layui.use("layer", function () {
layer.open({
type: 1,
title: '请确认以下信息',
shadeClose: true,
area: ['500px', '320px'],
title: "请确认以下信息",
shadeClose: false,
area: ["500px", "320px"],
scrollbar: false,
skin: 'confimInfo',
content: '<div class="infoContent">'
+ '<ul>'
+ '<li><span>姓名</span>：任超</li>'
+ '<li><span>身份证号</span>：610124193335522</li>'
+ '<li><span>联系电话</span>：18740677386</li>'
+ '</ul>'
+ '<div class="listItem"><h3>大厅名称：</h3>'+halloffice+'</div>'
+ '<div class="listItem"><h3>预约业务：</h3>' + appuintText + '</div>'
+ '<div class="listItem"><h3>预约时间：</h3>' + Date + '&nbsp;&nbsp;' + bustime + '</div>'
+ '<div class="confimButton"><button type="button" class="layui-btn cancel layui-btn-primary">取消</button><button type="button" class="layui-btn confim layui-btn-normal">确定</button></div>'
+ '</div>'
skin: "confimInfo",
content:
'<div class="infoContent">' +
"<ul>" +
"<li><span>姓名</span>:" + getCookie().username +"</li>" +
"<li><span>身份证号</span>："+getCookie().zjhm+"</li>" +
"<li><span>联系电话</span>："+getCookie().phone +"</li>" +
"</ul>" +
'<div class="listItem"><h3>大厅名称：</h3>' +
hallname +
"</div>" +
'<div class="listItem"><h3>预约业务：</h3>' +
appuintText +
"</div>" +
'<div class="listItem"><h3>预约时间：</h3>' +
Date +
"&nbsp;&nbsp;" +
bustime +
"</div>" +
'<div class="confimButton"><button type="button" class="layui-btn cancel layui-btn-primary">取消</button><button type="button" class="layui-btn confim layui-btn-normal">确定</button></div>' +
"</div>",
});
});
}
function detailHandle(){
layui.use("layer", function () {
layer.open({
type: 1,
title: "请确认以下信息",
shadeClose: false,
area: ["500px", "320px"],
scrollbar: false,
skin: "confimInfo",
content:'123',
});
});
})
}
// 业务选择
$(document).on('click', '.business_item ul .item_appoint', function () {
halloffice = GetRequest()
appuintText = $(this).find('h3').text()
handle()
$(document).on("click", ".business_item ul .item_appoint ", function (e) {
console.log(5555)
jgid = GetRequest();
appuintText = $(this).find("h3").text();
periodRulesId = $(this).data('id')
console.log('aaa',periodRulesId)
checkAppointment()
handle();
});
$(document).on("click", ".cancel", function () {
layer.closeAll();
});
$(document).on("click", ".confim", function () {
if(flag){
var paramsobj = {}
paramsobj.jgid = GetRequest()
paramsobj.periodRulesId = periodRulesId
paramsobj.userid = getCookie().userid
makeAppointment(paramsobj)
}
});
$(document).on('click', '.cancel', function () {
layer.closeAll()
})
$(document).on('click', '.confim', function () {
window.location.href = "./yyjg.html"
})
});
function GetRequest() {
var url = location.search; //获取url中"?"符后的字串
......@@ -163,8 +120,146 @@ function GetRequest() {
var str = url.substr(1);
strs = str.split("?");
for (var i = 0; i < strs.length; i++) {
theRequest[strs[i].split("=")[0]] = decodeURIComponent(strs[i].split("=")[1]);
theRequest[strs[i].split("=")[0]] = decodeURIComponent(
strs[i].split("=")[1]
);
}
}
return theRequest.jgid;
}
function getAppointmentDay() {
$.ajax({
type: "get", //提交方式
url: portal.api_url + "/portal/appointmentmh/getAppointmentDay", //路径
data: {
jgid: GetRequest(),
},
dataType: "json",
success: function (result) {
//返回数据根据结果进行相应的处理
if (result.code == 200 && result.data != null) {
data.dateList = result.data.listTime;
layui.use("laytpl", function () {
laytpl = layui.laytpl;
var getTpl = document.getElementById("date").innerHTML,
view = document.getElementById("swiperDate");
laytpl(getTpl).render(data, function (html) {
view.innerHTML = html;
});
});
}
},
});
}
// 根据办事大厅机构ID、日期、用户ID，查询可预约的业务 GET
function getAppointmentPeriodAndBusiness() {
$.ajax({
type: "get", //提交方式
url:
portal.api_url + "/portal/appointmentmh/getAppointmentPeriodAndBusiness", //
data: {
jgid: GetRequest(),
userid: getCookie().userid,
bookingDate: bookingDate,
},
dataType: "json",
//数据，这里使用的是Json格式进行传输
success: function (result) {
//返回数据根据结果进行相应的处理
if (result.code == 200 && result.data != null) {
console.log(result.data)
data.busList = result.data.appointmentPeriodBusinessList
// console.log(2222,data.busList)
// if(result.data.choosePeriodRulesId!==null){
// if(2){
// // for循环找到对应的id 打开，其余都设置为禁用
// }
// }else if(result.data.choosePeriodRulesId ==null){
// // step 1: 如果等于0
// for(var i =0;i<result.data.appointmentPeriodBusinessList.length;i++){
// for(var j=0;j<result.data.appointmentPeriodBusinessList[i].orgBusinessList.length; j++){
// if(result.data.appointmentPeriodBusinessList[i].orgBusinessList[j].residueNumber ==0){
// result.data.appointmentPeriodBusinessList[i].orgBusinessList[j].disabled = true
// }
// }
// }
// data.busList = result.data.appointmentPeriodBusinessList
// console.log(11111, data.busList)
// }
if(data.busList.length >0){
data.busList.forEach((item,index)=>{
hallname = item.orgBusinessList[0].jgName
})
}
layui.use("laytpl", function () {
laytpl = layui.laytpl;
var getTpl1 = document.getElementById("business_item").innerHTML,
view1 = document.getElementById("business_list");
laytpl(getTpl1).render(data, function (html) {
view1.innerHTML = html;
});
});
}
},
});
}
// 根据办事大厅机构ID、用户ID检查用户是否可预约抢号
function checkAppointment(){
$.ajax({
type: "get", //提交方式
async:false,
url:
portal.api_url + "/portal/appointmentmh/checkAppointment",
data: {
jgid: GetRequest(),
userid: getCookie().userid,
},
dataType: "json",
//数据，这里使用的是Json格式进行传输
success: function (result) {
//返回数据根据结果进行相应的处理
if (result.code == 200) {
return flag = result.data
}else if(result.code ==210){
return layer.msg( result.message)
}
},
});
}
// 用户预约抢号 POST
function makeAppointment(data){
$.ajax({
type: "post", //提交方式
async:false,
url: portal.api_url + "/portal/appointmentmh/makeAppointment",//路径
headers:{//***关键******
'Content-Type': 'application/json;charset=UTF-8',
},
dataType: "json",
data:JSON.stringify(data),//***关键******
success: function (result) {//返回数据根据结果进行相应的处理
if(result.code ==200 && result.data!==null){
appointmentId = result.data
window.location.href = "./yyjg.html?appointmentId="+ appointmentId
}
}
return theRequest.halloffice;
});
}
var bookingDate = undefined;
var flag = undefined;
var msg = undefined;
var hallname = undefined;
var periodRulesId = undefined
var appointmentId = undefined
var periodRulesId = undefined
var data = {
dateList: [],
busList: [
{
startTime: "",
endTime: "",
orgBusinessList: [],
},
],
};
......
......@@ -90,7 +90,7 @@
</div>
<div class="footer_button">
<button type="button" class="layui-btn layui-btn-normal">
<a href="../yyxz/index.html" title="上一步">
<a href="./yyxz.html" title="上一步">
上一步
</a>
</button>
......
......@@ -67,12 +67,12 @@
<div class="title">
<h3>
预约成功！您的预约号：
<span>952567654</span>
<span id='reservationNumber'></span>
</h3>
<p>请记录下您的预约号，以便后续的预约服务。</p>
</div>
<ul>
<li>1.您曾经失约（0）次，请留意您本次的预约时间和业务类型，切勿迟到或失约。</li>
<li>1.您曾经失约<span id='renegeCount'></span>次，请留意您本次的预约时间和业务类型，切勿迟到或失约。</li>
<li>2.如确需取消预约，请提前1天登陆系统办理</li>
<li>3.请凭预约号及相关证件，按预约时间提前10分钟到选定的不动产登记中心办理业务</li>
</ul>
......@@ -83,23 +83,23 @@
<ul>
<li>
<span>姓名：</span>
<p>任超</p>
<p id="username"></p>
</li>
<li>
<span>身份证号：</span>
<p>6101245646546</p>
<p id='zjhm'></p>
</li>
<li>
<span>办事大厅：</span>
<p>碑林区办事大厅</p>
<p id="orgName"></p>
</li>
<li>
<span>预约业务：</span>
<p>二手房过户</p>
<p id="hbShortname"></p>
</li>
<li>
<span>预约时间：</span>
<p>2020年10月16日上午 11:00</p>
<p id="yysj">2020年10月16日上午 11:00</p>
</li>
</ul>
</div>
......
......@@ -89,7 +89,10 @@ PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD
<div class="next_button">
<button type="button" class="layui-btn layui-btn-normal">
<a href="./yyxz.html" title="上一步">
<!-- <a href="./yyxz.html" title="上一步">
上一步
</a> -->
<a href="./xzqy.html" title="上一步">
上一步
</a>
</button>
......@@ -109,13 +112,13 @@ PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD
{{# if(item.isSelect){ }}
<ul class="swiper-slide layui-bg-gray active1">
<li>{{item.week}}</li>
<li>{{item.date}}</li>
<li>{{item.jyjh}}</li>
</ul>
{{# } }}
{{# if(!item.isSelect){ }}
<ul class="swiper-slide layui-bg-gray">
<li>{{item.week}}</li>
<li>{{item.date}}</li>
<li>{{item.jyjh}}</li>
</ul>
{{# } }}
{{# }); }}
......@@ -130,35 +133,15 @@ PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD
<span>-</span>
<span>{{item.endTime}}</span>
</div>
<ul>
<ul >
{{# layui.each(item.orgBusinessList, function(index1, item1){ }}
{{# if(item1.isyy==0){ }}
<li class="item_appoint">
<h3>
{{item1.shortName}}
</h3>
{{# if(item1.isyy==1){ }}
<p style="color:#FF5722">({{item1.residueNumber}})</p>
{{# } }}
{{# if(item1.isyy==0){ }}
<p style="color:#5FB878">({{item1.residueNumber}})</p>
{{# } }}
</li>
{{# } }}
{{# if(item1.isyy==1){ }}
<li class="isAppoint">
<li class="item_appoint" data-id='{{item1.periodRulesId}}'>
<h3>
{{item1.shortName}}
</h3>
{{# if(item1.isyy==1){ }}
<p style="color:#FF5722">({{item1.residueNumber}})</p>
{{# } }}
{{# if(item1.isyy==0){ }}
<p style="color:#5FB878">({{item1.residueNumber}})</p>
{{# } }}
<p style="color:#5FB878">(剩{{item1.residueNumber}}票)</p>
</li>
{{# } }}
{{# }); }}
{{# }) }}
</ul>
</div>
{{# }); }}
......