Merge branch 'master' of http://yun.pashanhoo.com:9090/renchao/portalStaticPage

@@ -21,25 +21,25 @@
             </div>
             <ul class="banner_title">
                 <li>
-                    <a href="" title="查询档案">
+                    <a class="cardItem" href="" title="查询档案">
                         <img src="./staticImages/dacx.png" alt="查询档案">
                         查询档案
                     </a>
                 </li>
                 <li>
-                    <a href="" title="进度查询">
+                    <a class="cardItem" href="" title="进度查询">
                         <img src="./staticImages/jdcx.png" alt="进度查询">
                         进度查询
                     </a>
                 </li>
                 <li>
-                    <a href="/staticViews/yyxz.html" title="在线预约">
+                    <a class="cardItem" href="/staticViews/yyxz.html" title="在线预约">
                         <img src="./staticImages/zxyy.png" alt="在线预约">
                         在线预约
                     </a>
                 </li>
                 <li>
-                    <a title="证书核验">
+                    <a class="cardItem" title="证书核验">
                         <img src="./staticImages/zshy.png" alt="证书核验">
                         证书核验
                     </a>

@@ -314,4 +314,16 @@ div.footer .system_service ul li a:hover {
 
 ::-webkit-scrollbar-thumb:hover {
     background-color: rgba(144,147,153,.5);
-}
\ No newline at end of file
+}
+
+/* card样式 */
+.cardItem {
+    background: #FFFFFF;
+    border: 1px solid #E5E8ED;
+    box-shadow: 0 3px 6px 0 rgba(10,14,40,0.08);
+    -moz-box-shadow:0 3px 6px 0 rgba(10,14,40,0.08); /*firefox*/
+    -webkit-box-shadow:0 3px 6px 0 rgba(10,14,40,0.08); /*webkit*/
+    border-radius: 6px;
+}
+
+/* 0091FF */
\ No newline at end of file

@@ -88,101 +88,102 @@
     float: right;
     margin-top: 20px;
 }
-/* ----------------预约列表-------------------- */
-.appointment_list {
-    margin-top: 20px;
+/* ---------------------------------- */
+.business_titleList {
+    width: 1220px;
+    margin: 20px auto;
     font-size: 0;
-    margin-left: -10px;
-    margin-right: -10px;
 }
-.appointment_list li {
-    width: 33.333%;
+.business_titleList li {
+    width: 25%;
+    font-size: 14px;
     display: inline-block;
+    text-align: center;
     padding: 0 10px;
     box-sizing: border-box;
-    float: left;
 }
-.appointment_list li .item_content {
-    border: 1px solid #CBCBCB;
-    border-radius: 4px;
-    border: 1px solid #CBCBCB;
-    font-size: 16px;
-    height: 368px;
-}
-.item_title {
-    height: 48px;
-    line-height: 48px;
-    color: #FFFFFF;
-    padding: 0 20px;
-    box-sizing: border-box;
-}
-.item_title h3 {
-    display: inline-block;
-    float: left;
-}
-.item_title p {
-    display: inline-block;
-    float: right;
+.business_titleList li a {
+    display: block;
+    height: 80px;
+    border: 1px solid #eee;
+    border-radius: 5px;
+    text-align: center;
+    cursor: pointer;
 }
-.success {
-    background-color: #44D7B6;
+.business_titleList li p:nth-child(1) {
+    font-size: 18px;
+    margin-top: 15px;
 }
-.overdue {
-    background-color: #F26363;
+.itemTitleActive {
+    border-color: #0091FF!important;
 }
-.cancel {
-    background-color: #F26363;
-    opacity: 0.5;
+/* ---------------预约列表------------------- */
+.contentBox {
+    width: 1200px;
+    margin: 0 auto;
 }
-.item_info {
-    padding: 30px;
-    height: 180px;
+.appintmentList li {
+    border-bottom: 1px solid #eee;
+    padding-bottom: 20px;
+    padding-top: 20px;
+    cursor: pointer;
 }
-.item_info li{
-    width: 100%;
-    line-height: 38px;
-    box-sizing: border-box;
-}
-.item_info li span {
+.appintmentList li .state{
+    width: 60px;
+    height: 60px;
+    border-radius: 50%;
     display: inline-block;
-    width: 108px;
-    text-align: right;
-    color: #9B9B9B;
-    white-space: nowrap;
+    color: #FFFFFF;
+    font-size: 12px;
+    text-align: center;
+    line-height: 60px;
+    margin-right: 20px;
 }
-.item_info li p{
+.appintmentList li div {
     display: inline-block;
-    color: #303030;
+    position: relative;
+    top: 12px;
+    margin-right: 50px;
 }
-.item_info li a{
-    display: inline-block;
+.business_name  h5{
+   font-size: 16px;
+   font-weight: 600; 
+}
+
+.handle {
     color: #0091FF;
-    margin-left: 20px;
+    float: right;
+    margin-top: 26px;
+    cursor: pointer;
 }
-.cancel_reservation {
-    display: block;
-    width: 100px;
-    height: 40px;
-    background: #FFFFFF;
-    border-radius: 3px;
-    border: 1px solid #E6E6E6;
-    font-size: 16px;
-    color: #9B9B9B;
-    line-height: 40px;
+.handle:hover {
+    color: #0091FF;
+}
+#page {
     text-align: center;
-    margin: 0 auto;
+    margin-top: 25px;
 }
-.business_titleList {
-    width: 1200px;
-    margin: 15px auto;
-    font-size: 0;
+/*------------正在填写------------- */
+.tobeSubmit {
+    background-color: rgba(129, 211, 248, 1);
 }
-.business_titleList li {
-    width: 25%;
-    font-size: 14px;
-    display: inline-block;
-    text-align: center;
+/*------------资料审核------------- */
+.dataReview {
+    background-color: #5FB878;
 }
-.business_titleList li p:nth-child(1) {
-    font-size: 18px;
+/*------------缴费------------- */
+.pay {
+    background-color: #01AAED;
+}
+/*------------退回------------- */
+.return {
+    background-color: #FFB800;
+}
+/*------------驳回------------- */
+.reject {
+    background-color: #FF5722;
+}
+/*------------办理成功------------- */
+.success {
+    background-color: #009688;
 }
\ No newline at end of file

@@ -7,25 +7,219 @@ layui.use('element', function () {
     });
 });
 $(function () {
-    _applyBusinessWiat()
+    _applyBusinessRecord()
+    _applyBusinessAJZTCount()
+    $('.business_titleList li a').click(function () {
+        $('.business_titleList li a').removeClass('itemTitleActive')
+        $(this).addClass('itemTitleActive')
+        let dataId = ($(this).attr('data-id'))
+        console.log(666, dataId)
+        if(dataId=='1') {
+            _applyBusinessRecord()
+            dataRendering(dataList.list)
+        }else if (dataId=='2') {
+            _applyBusinessWiat()
+            dataRendering(dataList.list)
+        }else if (dataId=='3') {
+            _applyBusinessIn()
+            dataRendering(dataList.list)
+        }else if (dataId=='6') {
+            _applyBusinessEnd()
+            dataRendering(dataList.list)
+        }
+    })
+
+    $(document).on("click", ".appintmentList li", function (e) {
+        let ywid = $(this).attr('data-ywid');
+        let lclb = $(this).attr('data-lclb');
+        getWorkBoxFLow(ywid, lclb)
+    })
 })
 
 
 //网上申请业务待提交
-function _applyBusinessWiat() {
+function _applyBusinessWiat(currentPage = 1) {
+    var li;
+    $.ajax({
+        type: "post",  //提交方式  
+        url: portal.api_url + "/portal/WorkBoxService/applyBusinessWait",//路径  
+        dataType: "json",
+        data: {
+            "userId": '0026609ddc6d2afabaa3c9b0ea3b0ec3',
+            "currentPage": currentPage,
+            "pageSize": 10
+        },
+        //数据，这里使用的是Json格式进行传输  
+        success: function (result) {//返回数据根据结果进行相应的处理      
+            $('.appintmentList').empty();     
+            if (result.code == 200 && result.data != null) {
+                dataList.list = result.data.records
+                dataRendering()
+            }
+            paged(result.data.total);
+        }
+    });
+}
+//网上申请业务正在办理
+function _applyBusinessIn(currentPage = 1) {
+    var li;
+    $.ajax({
+        type: "post",  //提交方式  
+        url: portal.api_url + "/portal/WorkBoxService/applyBusinessIn",//路径  
+        dataType: "json",
+        data: {
+            "userId": '0026609ddc6d2afabaa3c9b0ea3b0ec3',
+            "currentPage": currentPage,
+            "pageSize": 10
+        },
+        //数据，这里使用的是Json格式进行传输  
+        success: function (result) {//返回数据根据结果进行相应的处理      
+            $('.appintmentList').empty();     
+            if (result.code == 200 && result.data != null) {
+                dataList.list = result.data.records
+                dataRendering()
+            }
+            paged(result.data.total);
+        }
+    });
+}
+
+//网上申请业务已办结
+function _applyBusinessEnd(currentPage = 1) {
+    var li;
+    $.ajax({
+        type: "post",  //提交方式  
+        url: portal.api_url + "/portal/WorkBoxService/applyBusinessEnd",//路径  
+        dataType: "json",
+        data: {
+            "userId": '0026609ddc6d2afabaa3c9b0ea3b0ec3',
+            "currentPage": currentPage,
+            "pageSize": 10
+        },
+        //数据，这里使用的是Json格式进行传输  
+        success: function (result) {//返回数据根据结果进行相应的处理      
+            $('.appintmentList').empty();     
+            if (result.code == 200 && result.data != null) {
+                dataList.list = result.data.records
+                dataRendering()
+            }
+            paged(result.data.total);
+        }
+    });
+}
+
+//网上申请业务记录
+function _applyBusinessRecord(currentPage = 1) {
     var li;
     $.ajax({
         type: "post",  //提交方式  
-        url: portal.api_url + "/portal/WorkBoxService/applyBusinessWiat",//路径  
+        url: portal.api_url + "/portal/WorkBoxService/applyBusinessRecord",//路径  
         dataType: "json",
         data: {
-            userId:'0026609ddc6d2afabaa3c9b0ea3b0ec3'
+            "userId": '0026609ddc6d2afabaa3c9b0ea3b0ec3',
+            "currentPage": currentPage,
+            "pageSize": 10
         },
         //数据，这里使用的是Json格式进行传输  
-        success: function (result) {//返回数据根据结果进行相应的处理           
+        success: function (result) {//返回数据根据结果进行相应的处理      
+            $('.appintmentList').empty();     
             if (result.code == 200 && result.data != null) {
-                console.log(result.data)
+                dataList.list = result.data.records
+                dataRendering()
             }
+            paged(result.data.total, result.data.current );
+        }
+    });
+}
+
+// 网上申请业务案件状态数量统计
+function _applyBusinessAJZTCount() {
+    $.ajax({
+        type: "get",  //提交方式  
+        url: portal.api_url + "/portal/WorkBoxService/applyBusinessAJZTCount?userId="+dataList.userid,//路径  
+        dataType: "json",
+        //数据，这里使用的是Json格式进行传输  
+        success: function (result) {//返回数据根据结果进行相应的处理
+            $('.applyBusinessRecord span').text(result.data.allBusinessCount)
+            $('.to_be_submitted span').text(result.data.businessWaitCount)
+            $('.applyBusinessIn span').text(result.data.businessInProcessCount)
+            $('.applyBusinessEnd span').text(result.data.businessEndCount)
         }
     });
-}
\ No newline at end of file
+}
+
+
+// 分页
+function paged(pageCount, curr) {
+    layui.use('laypage', function () {
+        let laypage = layui.laypage;
+        //执行一个laypage实例
+        laypage.render({
+            elem: 'page' //注意，这里的 test1 是 ID，不用加 # 号
+            , count: pageCount //数据总数，从服务端得到
+            , curr: curr
+            , prev: '<'
+            , next: '>'
+            , theme: '#0091FF'
+            , jump: function (obj, first) {
+                if (!first) {
+                    console.log(obj.curr)
+                    _applyBusinessRecord(obj.curr);
+                }
+            }
+        });
+    })
+}
+
+
+// 列表数据渲染
+
+function dataRendering () {
+    for (var i = 0; i < dataList.list.length; i++) {
+        li = '<li data-ywid="' + dataList.list[i].ywid + '" data-lclb="' + dataList.list[i].ywid + '">';
+        if (dataList.list[i].ajzt == '1') {
+            li += '<span class="state tobeSubmit">正在填写</span>'
+        } else if (dataList.list[i].ajzt == '2') {
+            li += '<span class="state dataReview">资料审核</span>'
+        } else if (dataList.list[i].ajzt == '3') {
+            li += '<span class="state pay">缴费</span>'
+        } else if (dataList.list[i].ajzt == '4') {
+            li += '<span class="state return">退回</span>'
+        } else if (dataList.list[i].ajzt == '5') {
+            li += '<span class="state reject">驳回</span>'
+        } else {
+            li += '<span class="state success">办理成功</span>'
+        }
+        li += ' <div class="business_name">'
+        li += '<h5>' + dataList.list[i].djywjc + '</h5>'
+        li += '<p>权力类型：' + dataList.list[i].qllxmc + '</p>'
+        li += '</div>'
+        li += '<div>'
+        li += '<p>权利人</p>'
+        li += '<p>' + dataList.list[i].qlrmc + '</p>'
+        li += '</div>'
+        li += '<div>'
+        li += '<p>义务人</p>'
+        li += '<p>' + dataList.list[i].ywrmc + '</p>'
+        li += '</div>'
+        li += '<div>'
+        li += '<p>办理流水</p>'
+        li += '<p>' + dataList.list[i].wwsqbh + '</p>'
+        li += '</div>'
+        li += '<div>'
+        li += '<p>办理时间</p>'
+        li += '<p>' + dataList.list[i].sqrq + '</p>'
+        li += '</div>'
+        if (dataList.list[i].ajzt == '1') {
+            li += '<a class="handle">继续办理</a>'
+        } else if (dataList.list[i].ajzt == '3') {
+            li += '<a class="handle">缴费</a>'
+        }
+        $('.appintmentList').append(li)
+    }
+}
+
+var dataList = { 
+    "list": [],
+    "userid":'0026609ddc6d2afabaa3c9b0ea3b0ec3'
+};
\ No newline at end of file

 <!DOCTYPE html
     PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
 <html xmlns="http://www.w3.org/1999/xhtml">
+
 <head>
     <style>
     </style>
@@ -9,6 +10,7 @@
     <script type="text/javascript" src="../staticJs/head.js"></script>
     <link rel="stylesheet" type="text/css" href="../staticCss/wdyw.css">
 </head>
+
 <body>
     <div class="main">
         <div class="navigation_crumbs">
@@ -38,150 +40,53 @@
                 </div>
             </div>
             <ul class="business_titleList">
-                <li>
-                    <p>
-                        <span>5</span>
-                        <b>件</b>
-                    </p>
-                    <p>办理合计</p>
+                <li class="applyBusinessRecord">
+                    <a data-id='1' class="itemTitleActive">
+                        <p>
+                            <span>5</span>
+                            <b>件</b>
+                        </p>
+                        <p>办理合计</p>
+                    </a>
                 </li>
-                <li>
-                    <p>
-                        <span>1</span>
-                        <b>件</b>
-                    </p>
-                    <p>待提交</p>
+                <li class="to_be_submitted">
+                    <a data-id='2'>
+                        <p>
+                            <span>1</span>
+                            <b>件</b>
+                        </p>
+                        <p>待提交</p>
+                    </a>
                 </li>
-                <li>
-                    <p>
-                        <span>5</span>
-                        <b>件</b>
-                    </p>
-                    <p>办理中</p>
+                <li class="applyBusinessIn">
+                    <a data-id='3'>
+                        <p>
+                            <span>5</span>
+                            <b>件</b>
+                        </p>
+                        <p>办理中</p>
+                    </a>
                 </li>
-                <li>
-                    <p>
-                        <span>5</span>
-                        <b>件</b>
-                    </p>
-                    <p>已办结</p>
+                <li class="applyBusinessEnd">
+                    <a data-id='6'>
+                        <p>
+                            <span>5</span>
+                            <b>件</b>
+                        </p>
+                        <p>已办结</p>
+                    </a>
                 </li>
             </ul>
             <!-- -------------预约列表--------------- -->
             <div class="contentBox">
-                <ul class="appointment_list">
-                    <li>
-                        <div class="item_content">
-                            <div class="item_title success">
-                                <h3>正常</h3>
-                                <p>
-                                    查看
-                                    <i class="layui-icon layui-icon-right"></i>  
-                                </p>
-                            </div>
-                            <ul class="item_info">
-                                <li>
-                                    <span>预约人：</span>
-                                    <p>任超</p>
-                                </li>
-                                <li>
-                                    <span>办事大厅：</span>
-                                    <p>米香园办事大厅</p>
-                                </li>
-                                <li>
-                                    <span>办理业务类型：</span>
-                                    <p>二手房交易</p>
-                                    <a href="">办事指南</a>
-                                </li>
-                                <li>
-                                    <span>预约日期：</span>
-                                    <p>2020-12-56 上午 16：13</p>
-                                </li>
-                                <li>
-                                    <span>预约流水号：</span>
-                                    <p>897987987987</p>
-                                </li>
-                            </ul>
-                            <a class="cancel_reservation">取消预约</a>
-                        </div>
-                    </li>
-                    <li>
-                        <div class="item_content">
-                            <div class="item_title overdue">
-                                <h3>正常</h3>
-                                <p>
-                                    查看
-                                    <i class="layui-icon layui-icon-right"></i>  
-                                </p>
-                            </div>
-                            <ul class="item_info">
-                                <li>
-                                    <span>预约人：</span>
-                                    <p>任超</p>
-                                </li>
-                                <li>
-                                    <span>办事大厅：</span>
-                                    <p>米香园办事大厅</p>
-                                </li>
-                                <li>
-                                    <span>办理业务类型：</span>
-                                    <p>二手房交易</p>
-                                    <a href="">办事指南</a>
-                                </li>
-                                <li>
-                                    <span>预约日期：</span>
-                                    <p>2020-12-56 上午 16：13</p>
-                                </li>
-                                <li>
-                                    <span>预约流水号：</span>
-                                    <p>897987987987</p>
-                                </li>
-                            </ul>
-                            <a class="cancel_reservation">取消预约</a>
-                        </div>
-                    </li>
-                    <li>
-                        <div class="item_content">
-                            <div class="item_title cancel">
-                                <h3>正常</h3>
-                                <p>
-                                    查看
-                                    <i class="layui-icon layui-icon-right"></i>  
-                                </p>
-                            </div>
-                            <ul class="item_info">
-                                <li>
-                                    <span>预约人：</span>
-                                    <p>任超</p>
-                                </li>
-                                <li>
-                                    <span>办事大厅：</span>
-                                    <p>米香园办事大厅</p>
-                                </li>
-                                <li>
-                                    <span>办理业务类型：</span>
-                                    <p>二手房交易</p>
-                                    <a href="">办事指南</a>
-                                </li>
-                                <li>
-                                    <span>预约日期：</span>
-                                    <p>2020-12-56 上午 16：13</p>
-                                </li>
-                                <li>
-                                    <span>预约流水号：</span>
-                                    <p>897987987987</p>
-                                </li>
-                            </ul>
-                            <a class="cancel_reservation">取消预约</a>
-                        </div>
-                    </li>
-                </ul>
+                <ul class="appintmentList"></ul>
+                <div id="page"></div>
             </div>
         </div>
     </div>
 </body>
-
 </html>
 <script type="text/javascript" src="../staticJs/common.js"></script>
 <script type="text/javascript" src="../staticJs/down.js"></script>
+<script type="text/javascript" src="../staticJs/onlineApply/workFlow.js"></script>
 <script type="text/javascript" src="../staticJs/wdyw.js"></script>
\ No newline at end of file