@extends('layouts.main')

@section('style')
<link rel="stylesheet" href="/web/css/home.css">
<link rel="stylesheet" href="/web/css/swiper.min.css">
@endsection
@section('content')

<div class="swiper-container">
    <div class="swiper-wrapper">
        @foreach($banners as $banner)
        <div class="swiper-slide">
            <img src="{{$banner->resource_url}}">
        </div>
        @endforeach
    </div>
    <div class="swiper-pagination"></div>
    <!-- 如果需要导航按钮 -->
    <div class="swiper-button-prev"></div>
    <div class="swiper-button-next"></div>
</div>
<div class="project">
    <!-- <div class="title">项目<span>分类</span></div> -->
    <img src="/web/images/title.png" alt="">
    <a href="#0" class="go">
        <img src="/web/images/baseicons9.png" alt="">
    </a>
    <div class="list">
        @foreach($services as $k => $service)
        @if($k < 6)
        <div class="item">
            <a href="{{url('articles/'.$service->id.'/info')}}">{{$service->title}} ></a>
        </div>
        @endif
        @endforeach
    </div>
    <div class="pic">
        @foreach($services as $k => $service)
        <div class="items"> 
            <img src="{{$service->cover_url}}" alt="">
            <div class="moreAll">
                <span>{{$service->title}}</span>
                <a href="{{url('articles/'.$service->id.'/info')}}" class="more">更多</a>
            </div>
        </div>
        @endforeach
    </div>
</div>
<div class="succ">
    <div class="suCont">
        <img src="/web/images/title2.png" alt="">
        <!-- cases/cases -->
        <a href="/" class="go"><img src="/web/images/baseicons9.png" alt=""></a>
        @foreach($examples as $i => $example)
        <div class="suContItems">
            <a href="{{url('articles/'.$example->id.'/info')}}">
            <img src="{{$example->cover_url}}" alt="">
            <div class="show">
                <h1>-{{$i+1}}-</h1>
                <p>{{$example->title}}</p>
            </div>
            </a>
        </div>
        @endforeach
    </div>
</div>
<img src="/web/images/advantage.png" class="we" alt="">
<div class="about">
    <div class="aboutCont">
        <img src="/web/images/title3.png" alt="">
        <a href="#0" class="go"><img src="/web/images/baseicons9.png" alt=""></a>
        <div class="com">
            <div class="jieshao">
                <img src="/web/images/pic10.png" alt="">
                <div class="right">
                    <p class="title">公司介绍</p>
                    <div class="cont">
                    {{$company}}
                    </div>
                    <a href="/company">更多</a>
                </div>
            </div>
            <div class="dongtai">
                <p class="title">公司动态</p>
                @foreach($news as $item)
                <a href="{{url('articles/'.$item->id.'/info')}}" class="cont">· {{$item->title}}</a>
                @endforeach
            </div>
        </div>
    </div>
</div>
<div class="lianxi">
    <img src="/web/images/title4.png" alt="">
    <!-- cases/contactus -->
    <a href="/contactus" class="go"><img src="/web/images/baseicons9.png" alt=""></a>
    <img class="pic11" src="/web/images/pic11.png" alt="">
    <p class="hezuo">合作共赢</p>
    <p class="text">富琳全体员工竭诚以待</p>
    <a href="/contactus" class="link">联系我们</a>
</div>
<!-- <div id="form">
    <p class="liuyan">给我们留言</p>
    <form action="" name="myform" id="sumbit" method="post">
        <textarea name="word" id="" placeholder="请在此输入留言内容，我们会尽快与您联系。（必填）"></textarea>
        <input type="text" name="name" placeholder="姓名">
        <input type="text" name="phone" placeholder="电话">
        <input type="text" id="email" name="email" placeholder="邮箱">
        <button type="submit" class="submit" onclick="check(this.form);return false;">提交</button>
    </form>
</div> -->
    
@endsection

@section('script')
<script src="{{asset('/web/js/swiper.js')}}"></script>
<script>
	var swiper = new Swiper('.swiper-container', {
		loop: true,
		loopedSlides: 3,
		autoplay: {
			delay: 10000,
			stopOnLastSlide: false,
			disableOnInteraction: true,
		},
		pagination: {
			el: '.swiper-pagination',
			clickable: true,
		},
		navigation: {
			nextEl: '.swiper-button-next',
			prevEl: '.swiper-button-prev',
		},
	});
	$("#returnTop").click(function () {
		$(document).click = null;
		$('html , body').animate({
			scrollTop: 0
		}, 'slow');
	})
</script>
@endsection