feat:预约时间

@@ -2,7 +2,8 @@ $(function () {
 
     var province = undefined
     var city = undefined
-
+    // 办事大厅
+    var halloffice = '不夜城'
     $('.area_list li').click(function () {
         $(".area_list li").removeClass("active1")
         $(this).addClass("active1");
@@ -139,4 +140,9 @@ $(function () {
     infoWindow1.addEventListener('close', function (type, target, point) {
         $('.office_halls li').eq(1).removeClass('hallActive')
     })
+
+    // 下一步
+    $('.nextButton').click(function(){
+        window.open("../yysj/index.html?halloffice="+halloffice+"","_self")
+    })
 })
\ No newline at end of file

@@ -5,12 +5,13 @@ $(function () {
   var bustime = undefined;
   // 国有房屋无业点击选中记录
   var busIndex = undefined
+  // 办事中心
+  var halloffice = undefined
   var data = {
     'dateList': [
       {
         week: '星期一',
-        date: '10月15号',
-        isSelect: true
+        date: '10月15号'
       },
       {
         week: '星期二',
@@ -33,30 +34,40 @@ $(function () {
         date: '10月19号'
       }
     ],
-    "list": ['上午：09:00-10：00', '上午：10:00-11：00', '上午：11:00-12：00', '下午：14:00-15：00', '下午：15:00-16：00'],
-    "appint_detail": [
-      {
-        'total': 2
-      },
-      {
-        'total': 2
-      },
-      {
-        'total': 0
-      },
-      {
-        'total': 0
-      },
-      {
-        'total': 1
-      }
-    ]
+    "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位"
+        }
+      ]
+    }],
   };
 
   // 获取当前选中的日期
+  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
     }
   };
 
@@ -69,50 +80,22 @@ $(function () {
   });
   function a(i) {
     Date = data.dateList[i].date
+    bustime = data.dateList[i].week
     $(".swiper-slide").eq(i).addClass('active').siblings().removeClass('active');
   }
 
-  $('.business_list li').click(function () {
-    // 获取元素
-    appuintText = $(this).find('a').text()
-
-
-    $('.layui_anim_list').removeClass('disnone')
-    $('.layui_anim_content').show()
-    var demo = $('.layui-anim')
-    $('html,body').addClass('ovfHiden');
-    var othis = demo, anim = othis.data('anim');
-    othis.removeClass(anim);
-    setTimeout(function () {
-      demo.show()
-      othis.addClass(anim);
-    });
-
-    // 获取当前点击li 的下标
-    let index = $(this).index()
-    busIndex = index
-  })
-
   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 getTpl = document.getElementById('appoint_timeList').innerHTML
-      , view = document.getElementById('view');
-    laytpl(getTpl).render(data, function (html) {
-      view.innerHTML = html;
-    });
-
-    var getTpl = document.getElementById('appint_detail').innerHTML
-      , view = document.getElementById('view1');
-    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', {
@@ -133,85 +116,38 @@ $(function () {
       prevEl: '.swiper-button-prev',
     },
   });
-  $(document).on('click', '.able_appint', function () {
-    $('.able_appint').removeClass("able_appintActive")
-    $(this).addClass("able_appintActive")
-
-    let index = $(this).index()
-    // 获取当前选中的日期
-    bustime = data.list[index]
-    modleClose()
-    $(".business_list li .allowedMask").remove()
-    $(".business_list li .reserved").remove()
-    var str = "<div class='reserved'> <i class='layui-icon layui-icon-log'></i> <div><p>" + appuintText + "</p><p>" + bustime + "</p></div>  <i class='layui-icon appintDel  layui-icon-reduce-circle'></i></div>"
-    $(".business_list li").append('<div class="allowedMask"></div>');
-    $(".business_list li:eq(" + busIndex + ") a").removeClass('not-allowed')
-    $(".business_list li").eq(busIndex).append(str);
-    $(".business_list li:eq(" + busIndex + ") a").hide()
-  });
-
-  // 删除预约记录
-  $(document).on('click', '.appintDel', function (event) {
-    $('.layui_anim_list').addClass('disnone')
-    $('.able_appint').removeClass('able_appintActive')
+  function handle(){
     layui.use('layer', function () {
-      var layer = layui.layer;
-      layer.confirm('此操作将删除预约记录，是否继续', {
-        btn: ['取消', '继续'] //按钮
-      }, function () {
-        layer.closeAll();
-        modleClose()
-      }, function () {
-        modleClose()
-        $(".business_list li a").show()
-        $(".business_list li .allowedMask").remove()
-        $(".business_list li .reserved").remove()
+      layer.open({
+        type: 1,
+        title: '请确认以下信息',
+        shadeClose: true,
+        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>'
       });
-    });
+    })
+  }
+  // 业务选择
+  $(document).on('click', '.business_item ul li', function () {
+    halloffice = GetRequest()
+    appuintText = $(this).find('h3').text()
+    handle()
   });
 
 
-  $(document).on('click', '.allowedMask', function () {
-    $('.layui_anim_list').addClass('disnone')
-    modleClose()
-  });
-
-  // 下一步确认
-  $('.nextButton').click(function () {
-    if ($('.business_list li').has('.reserved').length) {
-      layui.use('layer', function () {
-        layer.open({
-          type: 1,
-          title: '请确认以下信息',
-          shadeClose: true,
-          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>碑林区不动产办事中心</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>'
-        });
-      })
-    } else {
-      layui.use('layer', function () {
-        layer.alert('请先选择相应业务', {
-          skin: 'layui-layer-molv' //样式类名
-          , closeBtn: 0
-        }, function () {
-          layer.closeAll()
-        });
-      })
-    }
 
-  })
   $(document).on('click', '.cancel', function () {
     layer.closeAll()
   })
@@ -219,8 +155,15 @@ $(function () {
     window.location.href = "../yyjg/index.html"
   })
 });
-function modleClose() {
-  $('.layui_anim_content').hide()
-  $('.layui-anim').hide()
-  $('html,body').removeClass('ovfHiden');
+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.halloffice;
 }
\ No newline at end of file

@@ -147,8 +147,8 @@
                     上一步
                 </a>
             </button>
-            <button type="button" class="layui-btn layui-btn-normal">
-                <a href="../yysj/index.html" title="下一步">
+            <button type="button" class="layui-btn nextButton layui-btn-normal">
+                <a title="下一步">
                     下一步
                 </a>
             </button>

@@ -339,4 +339,66 @@
 .confimButton .layui-btn {
     height: 30px;
     line-height: 30px;
+}
+.layui-layer-ico {
+    background: none!important;
+    position: relative;
+}
+.layui-layer-ico::after {
+    content: '\2716';
+    position: absolute;
+    left: 0;
+    top: -2px;
+    font-size: 14px;
+    color: #fff;
+}
+/* ----------------------------------------------- */
+.business_item .item_time {
+    float: left;
+    width: 200px;
+    background-color: #0091FF;
+    color: #fff;
+    margin-right: 15px;
+    height: 130px;
+    text-align: center;
+    line-height: 130px;
+}
+.business_item ul {
+    display: inline-block;
+    width: 80%;
+}
+.business_item ul li {
+    width: 33%;
+    display: inline-block;
+    background-color:#eee;
+    color: #fff;
+    border-radius: 3px;
+    text-align: center;
+    margin: 5px 0;
+    color: #666;
+    cursor: pointer;
+    padding: 7px 0;
+    position: relative;
+}
+.business_item ul li .mask {
+    position: absolute;
+    left: 0;
+    top: 0;
+    width: 100%;
+    height: 100%;
+}
+.business_item ul .item_appoint:hover {
+    background-color: #0091FF;
+    color: #fff;
+}
+.isAppoint {
+    cursor:not-allowed!important;
+ }
+.business_item ul li h3 {
+    margin-bottom: 5px;
+}
+.business_item ul li p {
+    font-size: 12px;
+    text-align: center;
+    line-height: 14px;
 }
\ No newline at end of file

@@ -18,7 +18,6 @@
     <link rel="stylesheet" type="text/css" href="../../staticCss/common.css" />
     <link rel="stylesheet" type="text/css" href="./css/index.css">
 </head>
-
 <body>
     <div class="yysj_main">
         <div class="subject top-logo">
@@ -108,74 +107,25 @@
             </div>
             <!-- ----------------------------------业务选择start----------------------------------------------- -->
             <div class="business_choice contentBox">
-                <div class="title">
-                    <h2>选择业务</h2>
-                    <p>(请选择您要办理的业务)</p>
-                </div>
                 <div class="site-title">
                     <fieldset>
                         <legend>
                             <a href="" name="fieldset">
-                                国有房屋
+                                业务预约
                             </a>
                         </legend>
                     </fieldset>
                 </div>
-                <ul class="business_list">
-                    <li>
-                        <a title="二手房转移登记">
-                            二手房转移登记
-                        </a>
-                    </li>
-                    <li>
-                        <a title="有证房抵押首次登记">
-                            有证房抵押首次登记/注销登记
-                        </a>
-                    </li>
-                    <li>
-                        <a title="解封登记">
-                            查封/解封登记
-                        </a>
-                    </li>
-                    <li>
-                        <a title="解封登记">
-                            查封/解封登记
-                        </a>
-                    </li>
-                    <li>
-                        <a title="证房抵押首次登记">
-                            证房抵押首次登记/注销登记
-                        </a>
-                    </li>
-                    <li>
-                        <a title="二手房转移登记">
-                            二手房转移登记
-                        </a>
-                    </li>
-                </ul>
-            </div>
-            <div class="layui-anim layui_anim_list" data-anim="layui-anim-scale">
-                <h2>
-                    <i class="layui-icon layui-icon-close" onclick="modleClose()"></i>
-                </h2>
-                <ul class="content_box">
-                    <li id="view"></li>
-                    <li id="view1"></li>
-                </ul>
+                <div id="business_list">
+                </div>
             </div>
-            <div class="layui_anim_content"></div>
     
             <div class="next_button">
                 <button type="button" class="layui-btn layui-btn-normal">
-                    <a href="../xxqu/index.html" title="上一步">
+                    <a href="../xzqy/index.html" title="上一步">
                         上一步
                     </a>
                 </button>
-                <button type="button" class="layui-btn layui-btn-normal nextButton">
-                    <a title="下一步">
-                        下一步
-                    </a>
-                </button>
             </div>
         </div>
         <!-- ----------------------------------内容模块的end----------------------------------------------- -->
@@ -273,37 +223,45 @@
     {{#  }); }}
 </script>
 
-
-<script id="appoint_timeList" type="text/html">
-    <ul class="appointment_time">
-    {{#  layui.each(d.list, function(index, item){ }}
-      <li class="layui-bg-gray">
-        {{item}}
-      </li>
+<script id="business_item" type="text/html">
+    {{#  layui.each(d.busList, function(index, item){ }}
+    <div class="business_item">
+        <div class="item_time">
+            <span>上午</span>
+            <span>{{item.startTime}}</span>
+            <span>-</span>
+            <span>{{item.endTime}}</span>
+        </div>
+        <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">
+                <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>
+            {{#  } }} 
+            {{#  }); }}
+        </ul>
+    </div>
     {{#  }); }}
-    {{#  if(d.list.length === 0){ }}
-      无数据
-    {{#  } }} 
-    </ul>
-</script>
-
-<script id="appint_detail" type="text/html">
-    <ol class="appint_detail">
-        {{#  layui.each(d.appint_detail, function(index, item){ }}
-        {{#  if(item.total > 0){ }}
-        <li class="able_appint">
-            <span>可预约</span>
-            <p>余{{item.total}}位</p>
-        </li>
-        {{#  } }} 
-        {{#  if(item.total == 0){ }}
-        <li class="layui-bg-gray">
-            <p class="full_engagement">已约满</p>
-        </li>
-        {{#  } }} 
-        {{#  }); }}
-        {{#  if(d.list.length === 0){ }}
-        无数据
-        {{#  } }} 
-    </ol>
 </script>
\ No newline at end of file