{layout name="layout" /}

<!-- 轮播图 -->
<div class="pull-banner w100">
    <img src="{$category.src ?: '__STATIC__/images/banner/banner-develop.jpg'}" alt="{$category.title ?? ''}banner">
    <div class="pull-banner-title w1360">
        <h2>{$category.title ?? ''}</h2>
        <p>{$category.description ?? ''}</p>
        <span><a href="/">首页</a> /  {$category.title ?? ''}</span>
    </div>
</div>
<!-- 二级导航 -->
<div class="pull-nav pull-nav-other w1360 wow fadeInUp" data-wow-duration=".8s" data-wow-delay="0">
    <div class="pull-nav-bg pull-nav-bg2">
        <div class="pull-nav-swiper swiper">
            <div class="swiper-wrapper">
                <div class="swiper-slide">
                    <a href="javascript:void(0);" rel="nofollow" class="idea-btn active">人才理念</a>
                    <ins></ins>
                </div>
                <div class="swiper-slide">
                    <a href="javascript:void(0);" rel="nofollow" class="culture-btn">人才培养</a>
                    <ins></ins>
                </div>
                <div class="swiper-slide">
                    <a href="javascript:void(0);" rel="nofollow" class="recruit-btn">招聘职位</a>
                    <ins></ins>
                </div>
            </div>
        </div>
        <div class="swiper-button-prev"></div>
        <div class="swiper-button-next"></div>
    </div>
</div>
<!-- 主体内容 -->
<div class="idea-bg w100 wow fadeInUp" data-wow-duration=".8s" data-wow-delay="0" id="idea">
    <ul class="idea w1360 wow fadeInUp" data-wow-duration=".8s" data-wow-delay="0">
        {if isset($blocks['talent-idea']['value']) && !empty($blocks['talent-idea']['value'])}
        {php}$images = json_decode($blocks['talent-idea']['value'], true);{/php}
        {foreach $images as $k => $ideaImage}
        <li class="wow fadeInUp" data-wow-duration=".8s" data-wow-delay="0">
            <div class="img">
                <img src="{$ideaImage['src'] ?? ''}" alt="{$ideaImage['alt'] ?? '人才理念'}">
            </div>
            <div class="txt">
                <h2>{$ideaImage['title'] ?? ''}</h2>
                <p>{:nl2br($ideaImage['desc']) ?? ''}</p>
            </div>
        </li>
        {/foreach}
        {/if}
    </ul>
</div>
<div class="culture-bg w100 wow fadeInUp" data-wow-duration=".8s" data-wow-delay="0" id="culture">
    <div class="img-bg w100 wow fadeInUp" data-wow-duration=".8s" data-wow-delay="0">
        <div class="index-title index-title-black w100 wow fadeInUp" data-wow-duration=".8s" data-wow-delay="0">
            <h2>{$blocks['talent-foster-title']['value'] ?? ''}</h2>
            <span>{$blocks['talent-foster-subtitle']['value'] ?? ''}</span>
        </div>
    </div>
    <div class="txt-bg w1360 wow fadeInUp" data-wow-duration=".8s" data-wow-delay="0">
        <div class="img">
            <img src="{$blocks['talent-foster-right']['value'] ?? '__STATIC__/images/culture.jpg'}"
                 alt="{$blocks['talent-foster-title']['value'] ?? ''}">
        </div>
        <div class="txt">
            {:nl2br($blocks['talent-foster-left']['value']) ?? ''}
        </div>
    </div>
</div>
<div class="recruit-bg w100 wow fadeInUp" data-wow-duration=".8s" data-wow-delay="0" id="recruit">
    <div class="index-title index-title-black w100 wow fadeInUp" data-wow-duration=".8s" data-wow-delay="0">
        <h2>{$blocks['position-title']['value'] ?? ''}</h2>
        <span>{$blocks['position-subtitle']['value'] ?? ''}</span>
    </div>
    {if !empty($positionList)}
    <ul class="recruit-list w1360 wow fadeInUp" data-wow-duration=".8s" data-wow-delay="0">
        <li>
            <div class="item">
                <span>职位名称</span>
                <span>招聘人数</span>
                <span>职位类别</span>
                <span>发布时间</span>
                <span>查看详情</span>
            </div>
        </li>
        {foreach $positionList as $position}
        <li class="wow fadeInUp" data-wow-duration=".8s" data-wow-delay="0">
            <div class="item item-btns">
                <span>{$position.title ?? ''}</span>
                <span>{$position.num ?? 1}</span>
                <span>{$position.type ?? ''}</span>
                <span>{:date('Y-m-d', $position['create_time'])}</span>
                <span class="btns"><em>+</em></span>
            </div>
            <div class="txt">
                {$position.content|raw}
                <a class="join-btn" href="#join">我要应聘</a>
            </div>
        </li>
        {/foreach}
    </ul>
    {/if}
</div>
<div class="join-bg w100 wow fadeInUp" data-wow-duration=".8s" data-wow-delay="0" id="join">
    <div class="index-title index-title-black w100 wow fadeInUp" data-wow-duration=".8s" data-wow-delay="0">
        <h2>{$blocks['how-to-apply-title']['value'] ?? ''}</h2>
        <span>{$blocks['how-to-apply-subtitle']['value'] ?? ''}</span>
    </div>
    <div class="join-txt w1360 wow fadeInUp" data-wow-duration=".8s" data-wow-delay="0">
        {$blocks['how-to-apply-content']['value']|raw}
    </div>
</div>
<script type="text/javascript">
	let ideaTop = $(".idea-bg").offset().top-80;
	let cultureTop = $(".culture-bg").offset().top-80;
	let recruitTop = $(".recruit-bg").offset().top-80;
	$(window).bind("scroll",function(){
		let topScroll=$(this).scrollTop();//当前窗口的滚动距离
		if(topScroll > ideaTop){
			$(".pull-nav .swiper-slide>a").removeClass("active");
			$(".idea-btn").addClass("active");
		}
		if(topScroll > ideaTop && topScroll > cultureTop){
			$(".pull-nav .swiper-slide>a").removeClass("active");
			$(".culture-btn").addClass("active");
		}
		if(topScroll > ideaTop && topScroll > cultureTop && topScroll > recruitTop){
			$(".about-nav>a").removeClass("active");
			$(".recruit-btn").addClass("active");
		}
	});
</script>