6c5a9249 by 田浩浩
2 parents e623e0a0 bdb59604
......@@ -144,49 +144,61 @@
</a>
</h2>
<ul class="notice_list" id="ulNotice">
<li>
<li class="item_notice">
<a href="" title="1地信中心开展外业安全生产监控系统培训工作">
<p>
1地信中心开展外业安全生产监控系统培训工作
</p>
<svg class="icon svg-icon" aria-hidden="true">
<use xlink:href="#icongonggao1"></use>
</svg>
</a>
</li>
<li>
<li class="item_notice">
<a href="" title="2地信中心开展外业安全生产监控系统培训工作">
<p>
2地信中心开展外业安全生产监控系统培训工作
</p>
<svg class="icon svg-icon" aria-hidden="true">
<use xlink:href="#icongonggao1"></use>
</svg>
</a>
</li>
<li>
<li class="item_notice">
<a href="" title="3地信中心开展外业安全生产监控系统培训工作">
<p>
3地信中心开展外业安全生产监控系统培训工作
</p>
<svg class="icon svg-icon" aria-hidden="true">
<use xlink:href="#icongongshi"></use>
</svg>
</a>
</li>
<li>
<li class="item_notice">
<a href="" title="4地信中心开展外业安全生产监控系统培训工作">
<p>
4地信中心开展外业安全生产监控系统培训工作
</p>
<svg class="icon svg-icon" aria-hidden="true">
<use xlink:href="#icongongshi"></use>
</svg>
</a>
</li>
<li>
<li class="item_notice">
<a href="" title="5地信中心开展外业安全生产监控系统培训工作">
<p>
5地信中心开展外业安全生产监控系统培训工作
</p>
<svg class="icon svg-icon" aria-hidden="true">
<use xlink:href="#icongongshi"></use>
</svg>
</a>
</li>
<li>
<li class="item_notice">
<a href="" title="6地信中心开展外业安全生产监控系统培训工作">
<p>
6地信中心开展外业安全生产监控系统培训工作
</p>
<svg class="icon svg-icon" aria-hidden="true">
<use xlink:href="#icongongshi"></use>
</svg>
......
/* ------------------------公共头部和尾部css------------------------------------ */
/* layer confim */
.layui-layer-btn .layui-layer-btn0 {
background-color: #fff!important;
color: #333!important;
border: 1px solid #dedede!important;
background-color: #F7B500!important;
color: #fff!important;
border: 1px solid #F7B500!important;
}
.layui-layer-btn .layui-layer-btn1 {
border-color: #1E9FFF;
......@@ -13,6 +13,10 @@
.layui-icon-search {
color: #6D7278;
}
.active1 {
background-color: #1E9FFF!important;
color: #fff!important;
}
/* ----------------------公共样式-------------------------- */
.contentBox {
width: 1200px;
......
.layui-layer-title {
background-color: #1E9FFF!important;
color: #fff!important;
}
.layui-layer-ico {
background: none!important;
position: relative;
}
.layui-layer-ico::after {
content: '\2716';
position: absolute;
left: 0;
top: -5px;
font-size: 14px;
color: #fff;
}
\ No newline at end of file
......@@ -5,41 +5,6 @@
padding-top: 25px;
margin-bottom: 25px;
}
.app_progress li {
padding: 0 30px;
line-height: 40px;
background: #eee;
display: inline-block;
color: #fff;
position: relative;
color: black;
cursor: pointer;
}
.app_progress li:hover {
background-color: #1E9FFF;
color: #fff;
}
.app_progress li:hover:after {
border-left-color: #1E9FFF;
}
.app_progress li:after{
content: '';
display: block;
border-top: 20px solid #fff;
border-bottom: 20px solid #fff;
border-left: 12px solid #eee;
position: absolute;
right:0;
top: 0;
}
.active {
background-color: #1E9FFF!important;
color: #fff!important;
}
.app_progress li.active:after {
border-left-color: #1E9FFF;
}
.selected {
background-color: #5FB878!important;
color: #fff!important;
......@@ -60,6 +25,7 @@
.selectCity {
width: 1200px;
margin: 0 auto;
margin-top: 50px;
}
.selectCity h2 {
display: inline-block;
......@@ -67,7 +33,7 @@
}
.area_list_content {
overflow: hidden;
margin-top: 20px;
margin-top: 30px;
width: 100%;
}
.area_list_content h2 {
......@@ -81,22 +47,26 @@
}
.selectCity .area_list li {
display: inline-block;
width: 100px;
height: 32px;
width: 140px;
height: 48px;
border-radius: 3px;
background-color: #01AAED;
margin-right: 10px;
color: #fff;
margin-right: 15px;
color: #9B9B9B;
text-align: center;
line-height: 32px;
margin-bottom: 10px;
line-height: 48px;
margin-bottom: 15px;
cursor: pointer;
background: #FFFFFF;
border-radius: 4px;
border: 1px solid #DEDEDE;
}
.selectCity .area_list li:hover {
background-color: #5FB878;
border-color: #0091FF;
color: #0091FF;
}
.active1 {
background-color: #5FB878!important;
border-color: #0091FF!important;
color: #0091FF!important;
}
.select_officehall {
width: 1200px;
......@@ -109,7 +79,7 @@
}
/* -----------------------------地图--------------------------------------- */
.map_content {
margin-top: 20px;
margin-top: 20px!important;
}
.office_halls {
width: 15%;
......@@ -118,26 +88,48 @@
}
.office_halls h2 {
font-weight: 600;
margin-bottom: 6px;
margin-bottom: 15px;
color: #6D7278;
line-height: 16px;
}
.office_halls li{
line-height: 28px;
width: 150px;
height: 48px;
background: #FFFFFF;
border-radius: 4px;
border: 1px solid #DEDEDE;
cursor: pointer;
text-align: center;
line-height: 48px;
margin-bottom: 10px;
color: #9B9B9B;
}
.office_halls li:hover {
color: #0091FF;
color: #006CFF;
border-color: #006CFF;
}
.footer_button {
margin: 20px 0;
margin: 30px 0 100px 0;
text-align: center;
}
.footer_button button {
margin-right: 10px;
width: 140px;
height: 42px;
position: relative;
}
.footer_button a {
color: #fff;
display: block;
width: 140px;
height: 42px;
position: absolute;
left: 0;
top: 0;
}
.footer_button a:hover {
color: #fff;
}
.hallActive {
background-color: rgb(236, 236, 236);
color: #0091FF;
......
.central_area {
min-height:calc(100vh - 227px);
min-height:calc(100vh - 197px);
}
.ovfHiden{overflow: hidden;height: 100%;}
.navigation_crumbs {
......@@ -10,38 +10,6 @@
padding-top: 25px;
margin-bottom: 25px;
}
.app_progress li {
padding: 0 30px;
line-height: 40px;
background: #eee;
display: inline-block;
color: #fff;
position: relative;
color: black;
cursor: pointer;
}
.app_progress li:hover {
background-color: #1E9FFF;
color: #fff;
}
.app_progress li:hover:after {
border-left-color: #1E9FFF;
}
.app_progress li:after{
content: '';
display: block;
border-top: 20px solid #fff;
border-bottom: 20px solid #fff;
border-left: 12px solid #eee;
position: absolute;
right:0;
top: 0;
}
.active {
background-color: #1E9FFF!important;
color: #fff!important;
}
.app_progress li.active:after {
border-left-color: #1E9FFF;
}
......@@ -70,6 +38,7 @@
padding: 0 50px;
box-sizing: border-box;
position: relative;
margin-top: 30px;
}
.swiper-container {
width: 100%;
......@@ -88,8 +57,9 @@
font-size: 14px;
margin-top: 3px;
}
.active {
.active1 {
background-color: #1E9FFF;
color: #fff;
}
.business_choice {
margin: 20px auto;
......@@ -299,13 +269,40 @@
text-align: center;
margin: 20px 0;
}
.next_button button {
width: 140px;
height: 42px;
position: relative;
}
.next_button a {
color: #fff;
display: block;
width: 140px;
height: 42px;
position: absolute;
left: 0;
top: 0;
}
.next_button a:hover{
color: #fff;
}
.layui-layer-title {
background-color: #1E9FFF!important;
color: #fff!important;
}
.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;
}
/* ---------------------信息确认弹框样式------------------------------- */
.infoContent {
......@@ -340,18 +337,6 @@
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;
......
......@@ -9,6 +9,7 @@
border: 1px solid #CBCBCB;
padding: 30px 20px;
margin-bottom: 20px;
margin-top: 30px;
}
.clause p {
line-height: 26px;
......@@ -68,5 +69,9 @@
}
.next_button {
text-align: center;
margin: 20px auto;
margin: 30px 0 100px 0;
}
.next_button button {
width: 140px;
height: 42px;
}
\ No newline at end of file
......
......@@ -81,7 +81,7 @@ $(function () {
function a(i) {
Date = data.dateList[i].date
bustime = data.dateList[i].week
$(".swiper-slide").eq(i).addClass('active').siblings().removeClass('active');
$(".swiper-slide").eq(i).addClass('active1').siblings().removeClass('active1');
}
layui.use('laytpl', function () {
......@@ -107,6 +107,7 @@ $(function () {
on: {
click: function (swiper) {
var index = swiper['clickedIndex'];
console.log(index)
a(index);
}
},
......
......@@ -9,15 +9,7 @@ $(function () {
});
var accept = $('.accept');
$('.next_button button').click(function () {
if (!accept.is(':checked')) {
layui.use('layer', function () {
var layer = layui.layer;
layer.open({
title: '标题'
, content: '请先选择同意协议'
});
});
} else {
if ($('.checkbox').find(".img").length>0) {
layui.use('layer', function () {
var layer = layui.layer;
layer.confirm('本人承诺所填的预约信息属实,如有虚假,将承担法律责任', {
......@@ -29,6 +21,11 @@ $(function () {
window.location.href = "./xzqy.html";
});
});
} else {
layui.use('layer', function () {
layer.alert('请先同意以上协议', {icon: 6,title:'提示'});
})
}
})
$('.checkbox').click(function(){
......
......@@ -8,6 +8,7 @@
<title>我的预约-选择区域</title>
<script type="text/javascript" src="../staticJs/head.js"></script>
<link rel="stylesheet" type="text/css" href="../staticCss/xzqy.css">
<link rel="stylesheet" type="text/css" href="../staticCss/progressBar.css">
</head>
<body>
......@@ -22,26 +23,40 @@
</div>
</div>
<!-- ----------------------------------内容模块的开始----------------------------------------------- -->
<div class="appointment_notice contentBox">
<div class="progressBar contentBox">
<ul class="app_progress">
<li class="selected">
<span>1</span>
<li>
<p class="active"></p>
<h5>
预约须知
</h5>
</li>
<div class="line"></div>
<li class="active">
<span>2</span>
<div class="layui-progress">
<div class="layui-progress-bar" lay-percent="100%"></div>
</div>
<li>
<p class="active"></p>
<h5>
选择区域
</h5>
</li>
<div class="line"></div>
<div class="layui-progress">
<div class="layui-progress-bar" lay-percent="50%"></div>
</div>
<li>
<span>3</span>
<p></p>
<h5>
预约时间
</h5>
</li>
<div class="line"></div>
<div class="layui-progress">
<div class="layui-progress-bar"></div>
</div>
<li>
<span>4</span>
<p></p>
<h5>
预约结果
</h5>
</li>
</ul>
</div>
......
......@@ -8,6 +8,7 @@ PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD
<title>我的预约-预约时间</title>
<script type="text/javascript" src="../staticJs/head.js"></script>
<link rel="stylesheet" href="../staticCss/swiper-bundle.min.css">
<link rel="stylesheet" type="text/css" href="../staticCss/progressBar.css">
<link rel="stylesheet" type="text/css" href="../staticCss/yysj.css">
</head>
......@@ -25,26 +26,40 @@ PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD
</div>
<!-- ----------------------------------内容模块的开始----------------------------------------------- -->
<div class="central_area">
<div class="appointment_notice contentBox">
<div class="progressBar contentBox">
<ul class="app_progress">
<li class="selected">
<span>1</span>
<li>
<p class="active"></p>
<h5>
预约须知
</h5>
</li>
<div class="line"></div>
<li class="selected">
<span>2</span>
<div class="layui-progress">
<div class="layui-progress-bar" lay-percent="100%"></div>
</div>
<li>
<p class="active"></p>
<h5>
选择区域
</h5>
</li>
<div class="line"></div>
<li class="active">
<span>3</span>
<div class="layui-progress">
<div class="layui-progress-bar" lay-percent="100%"></div>
</div>
<li>
<p class="active"></p>
<h5>
预约时间
</h5>
</li>
<div class="line"></div>
<div class="layui-progress">
<div class="layui-progress-bar" lay-percent="50%"></div>
</div>
<li>
<span>4</span>
<p></p>
<h5>
预约结果
</h5>
</li>
</ul>
</div>
......@@ -91,7 +106,7 @@ PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD
<script id="date" type="text/html">
{{# layui.each(d.dateList, function(index, item){ }}
{{# if(item.isSelect){ }}
<ul class="swiper-slide layui-bg-gray active">
<ul class="swiper-slide layui-bg-gray active1">
<li>{{item.week}}</li>
<li>{{item.date}}</li>
</ul>
......
......@@ -10,6 +10,7 @@
<script type="text/javascript" src="../staticJs/head.js"></script>
<link rel="stylesheet" type="text/css" href="../staticCss/yyxz.css">
<link rel="stylesheet" type="text/css" href="../staticCss/progressBar.css">
<link rel="stylesheet" type="text/css" href="../staticCss/layuiedit.css">
</head>
<body>
......