<?php /*Template Name: 服务流程 */
get_header(); ?>
<div class="container">
	<div class="flex pages-wrap">
		<div class="pages-left">
			<div class="aside-nav">
				<div class="flex aside-nav-title">
					<h3>服务流程</h3>
				</div>
				<!-- ./ -->
				<div class="aside-nav-current">
					<ul>
						<li class="on"><a href="/process">服务流程</a></li>
						<?php wp_list_pages('depth=1&sort_column=id&title_li=&optioncount=0&hierarchical=0&hide_empty=1&child_of=108'); ?>
					</ul>
				</div>
				<!-- ./ -->
			</div>
			<!-- ./nav -->
			<?php get_sidebar(); ?>
		</div>
		<!-- ./left -->
		<div class="pages-right">
			<div class="page-path">
				当前位置：<a href="<?php echo esc_url( home_url( '/' ) ); ?>">首页</a> <b></b> <a href="/process">服务流程</a> <b></b> <span><?php the_title(); ?></span>
			</div>
			<!-- ./ -->
			<div class="pages-curcatagory">
				<h3><i></i><?php the_title(); ?> </h3>
			</div>
			<!-- ./ -->
			<div class="case-detail-content">
				<!-- *********************** -->
				<?php if (get_field('swipers')) { ?>
				<?php $my_arr = get_field('swipers'); ?>
				<div class="pages-swipers">
					<div class="gallery-top">
						<div class="swiper-container">
							<div class="swiper-wrapper">
								<?php
									for($i=0;$i<count($my_arr);$i++) {
										$arr = $my_arr[$i];
										$n=$i+1;
										echo "<div class='swiper-slide'><div class='gallery-top-img'><img src='".$arr[url]. "' /></div></div>";
									}
								?>
							</div>
							<div class="swiper-button-next"></div>
    						<div class="swiper-button-prev"></div>
						</div>
					</div>
					<!-- ./top -->
					<div class="gallery-thumbs">
						<div class="swiper-container">
							<div class="swiper-wrapper">
								<?php
									for($i=0;$i<count($my_arr);$i++) {
										$arr = $my_arr[$i];
										$n=$i+1;
										echo '<div class="swiper-slide background" style="background-image:url('.$arr[url].')"></div>';
									}
								?>
							</div>
							
						</div>
					</div>
					<!-- ./thumbs -->
				</div>
				<?php } ?>
				<!-- ************************* -->

				<?php if (have_posts()) : while (have_posts()) : the_post(); ?>
				<?php the_content(); ?>
				<?php endwhile; endif; ?>
			</div>
			<!-- ./ -->
		</div>
		<!-- ./right -->
	</div>
</div>
<link href="https://cdn.bootcdn.net/ajax/libs/Swiper/4.5.0/css/swiper.min.css" rel="stylesheet">
<script src="https://cdn.bootcdn.net/ajax/libs/Swiper/4.5.0/js/swiper.min.js"></script>

<script>
	if($(".aside-nav-current ul li").hasClass("current_page_item")) {
		var _this = $(".aside-nav-current ul li");
		_this.removeClass('on');
	}
	

	var galleryThumbs = new Swiper('.gallery-thumbs .swiper-container', {
		spaceBetween: 10,
		slidesPerView: 'auto',
		freeMode: true,
		watchSlidesVisibility: true,
		watchSlidesProgress: true,
	});
	var galleryTop = new Swiper('.gallery-top .swiper-container', {
		spaceBetween: 10,
		// lazy: true,
		navigation: {
			nextEl: '.gallery-top .swiper-button-next',
			prevEl: '.gallery-top .swiper-button-prev',
		},
		thumbs: {
			swiper: galleryThumbs
		}
	});
</script>
<?php get_footer(); ?>