<!DOCTYPE html> <html xmlns="http://www.w3.org/1999/xhtml" xmlns:th="http://www.thymeleaf.org" xmlns:shiro="http://www.pollix.at/thymeleaf/shiro"> <head th:replace="common::header(~{::title},~{::link})"> <meta charset="UTF-8"> <meta name="viewport" content="width=device-width,initial-scale=1.0, user-scalable=no"> <meta http-equiv="X-UA-Compatible" content="ie=edge"> <title>科德信息咨询</title> <!-- 二级页面CSS --> <link rel="stylesheet" th:href="${portalHost+'/css/secode.css'}"> <!-- 自定义动画样式 --> <link rel="stylesheet" th:href="${portalHost+'/css/swiper.min.css'}"> </head> <body> <div class="app"> <!-- 头部 --> <header> <div th:replace="common::nav('','')"></div> <!-- 新闻轮播图 --> <div class="swiper-containerx"> <img th:src="${banners}==null?${portalHost+'/images/banner/news_bg.jpg'}:${avatarUploadHost}+${banners.bannerUrl}" /> </div> <!-- 新闻轮播图 end --> </header> <!-- 头部 end --> <!-- 主体内容 --> <div class="client main"> <div class="product-title"> <h4>服务客户</h4> <p>已为26800企业,获得国家高新技术企业认证!</p> </div> <div class="container"> <div class="client-list"> <div id="trigger1">请选择选择区域、省份</div> <div class="quyu"> <span>所属区域</span> <ul> <li class="active">全国</li> <li data-id="1">华中</li> <li data-id="2">华东</li> <li data-id="3">东北</li> <li data-id="4">华南</li> <li data-id="5">华北</li> <li data-id="6">西南</li> <li data-id="7">西北</li> </ul> </div> <div class="shengfen"> <span>所属省份</span> <ul> </ul> </div> </div> <div class="client-list-box"> <div class="client-item"> </div> <!-- 分页 --> <div class="page_2"></div> <!-- 分页 end --> </div> </div> </div> <!-- 主体内容 end --> <!-- 底部 --> <footer> <div th:replace="common::copyright"></div> </footer> <!-- 底部 end --> </div> <div th:replace="common::footer(~{::script},'')"> <!-- 手机端省级联动 --> <script type="text/javascript"> var mobileSelect = new MobileSelect({ trigger: '#trigger1', title: '区域/省份-选择', wheels: [ { data: [ { id: '1', value: '全国', childs: [ { id: undefined, value: "全部" }, { id: "7", value: "安徽" }, { id: "15", value: "北京" }, { id: "27", value: "重庆" }, { id: "8", value: "福建" }, { id: "30", value: "甘肃" }, { id: "24", value: "广东" }, { id: "20", value: "广西" }, { id: "25", value: "贵州" }, { id: "21", value: "海南" }, { id: "13", value: "河北" }, { id: "1", value: "黑龙江" }, { id: "19", value: "河南" }, { id: "22", value: "香港" }, { id: "17", value: "湖北" }, { id: "18", value: "湖南" }, { id: "5", value: "江苏" }, { id: "9", value: "江西" }, { id: "3", value: "辽宁" }, { id: "2", value: "吉林" }, { id: "23", value: "澳门" }, { id: "14", value: "内蒙古" }, { id: "32", value: "宁夏" }, { id: "31", value: "青海" }, { id: "10", value: "山东" }, { id: "4", value: "上海" }, { id: "12", value: "山西" }, { id: "34", value: "陕西" }, { id: "29", value: "四川" }, { id: "11", value: "台湾" }, { id: "16", value: "天津" }, { id: "33", value: "新疆" }, { id: "28", value: "西藏" }, { id: "26", value: "云南" }, { id: "6", value: "浙江" }, ] }, { id: '2', value: '东北', childs: [ { id: '1', value: '黑龙江' }, { id: '2', value: '吉林' }, { id: '3', value: '辽宁' } ] }, { id: '3', value: '华东', childs: [ { id: '4', value: '上海' }, { id: '5', value: '江苏' }, { id: '6', value: '浙江' }, { id: '7', value: '安徽' }, { id: '8', value: '福建' }, { id: '9', value: '江西' }, { id: '10', value: '山东' }, { id: '11', value: '台湾' } ] }, { id: '4', value: '华北', childs: [ { id: '15', value: '北京' }, { id: '16', value: '天津' }, { id: '12', value: '山西' }, { id: '13', value: '河北' }, { id: '14', value: '内蒙古' } ] }, { id: '4', value: '华中', childs: [ { id: '19', value: '河南' }, { id: '17', value: '湖北' }, { id: '18', value: '湖南' } ] }, { id: '5', value: '华南', childs: [ { id: '24', value: '广东' }, { id: '20', value: '广西' }, { id: '21', value: '海南' }, { id: '22', value: '香港' }, { id: '23', value: '澳门' } ] }, { id: '6', value: '西南', childs: [ { id: '29', value: '四川' }, { id: '25', value: '贵州' }, { id: '26', value: '云南' }, { id: '27', value: '重庆' }, { id: '28', value: '西藏' } ] }, { id: '6', value: '西北', childs: [ { id: '34', value: '陕西' }, { id: '30', value: '甘肃' }, { id: '31', value: '青海' }, { id: '32', value: '宁夏' }, { id: '33', value: '新疆' } ] }, ] } ], position: [0, 1], callback: function (indexArr, data) { let province = data[1].id $.ajax({ url: api + "/open/listCustomerCase", data: { province }, type: "GET", dataType: "json", success: function (data) { if (data.error && data.error.length) { alert("系统繁忙,请刷新页面"); } else { var dataList = data.data.list; var html = ""; if (dataList.length) { for (var d = 0; d < dataList.length; d++) { html += "<div><img src=" + avatarUploadHost + dataList[d].pictureUrl + " /></div>"; } $(".page_ctrl").css({ display: "block" }); window.sessionStorage.setItem("total", data.data.totalCount); window.sessionStorage.setItem("province", province); page() } else { var html = "<h4 style='text-align:center;margin-top:90px;color:#666' >暂无服务客户</h4>" $(".page_ctrl").css({ display: "none" }) } $(".client-item").html(html); } } }); } }); </script> <!-- 引入分页 --> <script th:src="${portalHost+'/js/page.js'}"></script> <script> function page() { var obj_1 = { obj_box: ".page_2", total_item: +window.sessionStorage.getItem("total"), //总共数据 province: +window.sessionStorage.getItem("province"), per_num: 10, //每页显示数据 current_page: 1, //当前页 change_content: function (per_num, current_page) { per_num = per_num ? per_num : 10; current_page = current_page ? current_page : 1; var province = window.sessionStorage.getItem("province"); if (province == "undefined") { var data = { pageNo: current_page }; } else { var data = { province, pageNo: current_page }; } $.ajax({ url: api + "/open/listCustomerCase", data, type: "GET", dataType: "json", success: function (data) { if (data.error && data.error.length) { alert("系统繁忙,请刷新页面"); } else { var dataList = data.data.list; var html = ""; if (dataList.length) { for (var d = 0; d < dataList.length; d++) { html += "<div><img src=" + avatarUploadHost + dataList[d].pictureUrl + " /></div>"; } $(".page_ctrl").css({ display: "block" }); window.sessionStorage.setItem("total", data.data.totalCount); window.sessionStorage.setItem("province", province); } else { var html = "<h4 style='text-align:center;margin-top:90px;color:#666' >暂无服务客户</h4>"; $(".page_ctrl").css({ display: "none" }); } $(".client-item").html(html); } } }); } }; //调用分页 page_ctrl(obj_1); } </script> </div> </body> </html>