<?php
error_reporting(E_ERROR);

include 'admin/public/db.php';

// seo 信息
$sql_result = mysql_query("SELECT * FROM `seo` WHERE id = '1' ");
$rows = mysql_fetch_assoc($sql_result);
$seo_content = $rows['content'];

// 页面导航头
$sql_result = mysql_query("SELECT * FROM `header` WHERE Id = '1' ");
$rows = mysql_fetch_assoc($sql_result);
$head_content = $rows['content'];

//   页面脚部
$sql_result = mysql_query("SELECT * FROM `footer` WHERE Id = '1' ");
$rows = mysql_fetch_assoc($sql_result);
$foot_content = $rows['content'];

// 页面内容
$sql_result = mysql_query("SELECT * FROM `page_content` WHERE path = 'index' ");
$rows = mysql_fetch_assoc($sql_result);
$page_content = $rows['content'];

?>

<!DOCTYPE html>
<html>

<head>
	<?php echo $seo_content ?>
	<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
	<script type="application/x-javascript"> addEventListener("load", function() { setTimeout(hideURLbar, 0); }, false);
		function hideURLbar(){ window.scrollTo(0,1); } </script>
	<!-- //for-mobile-apps -->
	<link href="static/css/bootstrap.css" rel="stylesheet" type="text/css" media="all" />
	<link href="static/css/style.css?v=99" rel="stylesheet" type="text/css" media="all" />
	<link rel="Shortcut Icon" href="./ico.png" type="image/x-icon" />
	<!-- js -->
	
	<!-- //js -->
	<link href='static/css/swiper.min.css' rel='stylesheet' type='text/css'>
	<script src="static/js/jquery-1.11.1.min.js"></script>
	<script src="static/js/swiper.min.js"></script>
	
	<style>
		
		.swiper-pagination-bullet-active{
			background: #a22720;
		}
		.swiper-pagination-bullet{
			width: 14px;
    	height: 14px;
		}
		@media (max-width: 414px){
			.swiper-pagination-bullet{
				width: 8px;
				height: 8px;
			}
		}
		html{
			height: 100%;
		}
		body{
			height: 100%;
			position: relative;
		}
		.footer{
			position: relative;
			width: 100%;
			left: 0;
			bottom: 0;
		}
		.banner-box{
			position: relative;
			top: 0;
			bottom: 220px;
			width: 100%;
			margin: auto;
			background: #000;
		}
		.banner-box img{
			width: 100%;
			height: auto;
			object-fit: cover;
		}
		@media (max-width: 991px){
			.banner-box{
				position: absolute;
				top: 50px;
				bottom: 220px;
				width: 100%;
				margin: auto;
				background: #000;
			}
			.footer{
				position: absolute;
				width: 100%;
				left: 0;
				bottom: 0;
			}
			.banner-box img{
				width: 100%;
				height: 100%;
				object-fit: contain;
			}
		}
		@media (max-width: 414px){
			.banner-box{
				position: absolute;
				top: 49px;
				bottom: 190px;
				width: 100%;
				margin: auto;
			}
		}
	</style>
</head>

<body>

<?php echo $head_content; ?>
	<!-- swiper-box -->
	<div class="swiper-box banner-box">
		<div class="swiper-container">
			<div class="swiper-wrapper">
				<?php 
					$sql_res = mysql_query("select * from carousel order by sort");
					$index = 0;
					while($row = mysql_fetch_array($sql_res)) {
						echo '<div class="swiper-slide">
							<img src="'.$row['img_url'].'" alt="">
						</div>';
					}
				?>
			</div>
			<div class="swiper-pagination"></div>
		</div>
	</div>
	<!-- //swiper-box -->
	<!-- <div class="banner-box">
		<img src="static/images/banner.jpg" alt="">
	</div> -->

	<!-- footer -->
	<?php echo $foot_content; ?>
	<!-- //footer -->
	<!-- for bootstrap working -->
	<script src="static/js/bootstrap.js"></script>
	<script src="static/js/main.js"></script>
	<script>
		var swiper = new Swiper('.swiper-container', {
			spaceBetween: 30,
			speed:300,
			autoplay : {
				delay:6880
			},
			loop : true,
      pagination: {
        el: '.swiper-pagination',
        clickable: true,
      },
    });
	</script>
	<!-- //for bootstrap working -->
</body>

</html>