{extend name="default/base" /}
		
{block name="meta"}
<title>{:listSEO(999)['stitle']}</title>
<meta name="description" content="{:listSEO(999)['sdesc']}">
<meta name="Keywords" content="{:listSEO(999)['skeyword']}">
{/block}

{block name="css"}
<script>
    var navid = 0;
</script>

<style>
	.font30 p{
		white-space: pre-line;
	}
</style>

{/block}

{block name="main"}
<h1 style="width: 0;height: 0;overflow: hidden;">{:listSEO(999)['seo_h1']}</h1>


    <div class="banner">
        <div class="swiper-container">
            <div class="swiper-wrapper">
                {wst:ads code="ban_index" cache='86400' num='10'}
                <div class="swiper-slide">
                    {if $vo.adName}
                    <div class="pic dis_pc" style="background-image: url(__ROOT__/{$vo.adFile});"><a href="http://www.onerugged.com/"></a></div>
                    <div class="pic dis_mb" style="background-image: url(__ROOT__/{$vo.adImg});"><a href="http://www.onerugged.com/"></a></div>
                    <div class="bantxt flex">
                        <div class="w1440">
                            <div class="tit">{$vo.adName}</div>
                            <div class="p">{$vo.adDesc}</div>
                            <div class="btns">
                                {if $vo.adURL}
                                <a class="vm" href="{$vo.adURL}"><span>{:WstPagedata('LearnMore')}</span><span class="icon icon-right"></span></a>
                                {/if}
                                {if $vo.adURL2}
                                <a class="vm" href="{$vo.adURL2}" target="_blank"><span>{:WstPagedata('ProductDetails')}</span><span class="icon icon-right"></span></a>
                                {/if}
                            </div>
                            <div class="img"><img src="__ROOT__/{$vo.adImg2}" alt="{$vo.adName}" title="{$vo.adName}"></div>
                        </div>
                    </div>
                    
                    {else /}
                    <div class="images_bnner">
                        <a href="{$vo.adURL}"> <img src="__ROOT__/{$vo.adFile}" alt="{$vo.adName}" title="{$vo.adName}" /> </a>
                    </div>
                    <div class="images_wap">
                        <a href="{$vo.adURL}"> <img src="__ROOT__/{$vo.adImg}" alt="{$vo.adName}" title="{$vo.adName}" /> </a>
                    </div>
                    {/if}
                    
                </div>
                {/wst:ads}
            </div>
            <div class="swiperCtr">
                <div class="w1440 flex">
                    <div class="prev"></div>
                    <div class="cur"></div>
                    <div class="progress">
                        <div class="svg"></div>
                        <div class="pause"></div>
                    </div>
                    <div class="total"></div>
                    <div class="next"></div>
                </div>
            </div>
        </div>
    </div>
    <div class="index1 pt5">
        <div class="title"><span class="wow fadeInUp font48">{:WstPagedata('IndustrialSolutions')}</span></div>
        <div class="lines wow fadeInUp">
            <div class="linev v1"></div>
            <div class="linev v2"></div>
            <div class="linev v3"></div>
            <div class="lineh h1"></div>
            <div class="lineh h2"></div>
            <div class="lineh h3"></div>
            <div class="items flex">
                {wst:solution type="is_index" cat='0' num='16'  key="k1"}
                <div class="item wow fadeInUp" style="background-image: url(__ROOT__/{$vo['goodsImg3']});">
                    <a href="{$vo.navUrl}">
                        <div class="tit fontb">{$vo['goodsName2']}</div>
                        <div class="p">{$vo['goodDetail']}</div>
                        <div class="vm2"></div>
                    </a>
                </div>
                {/wst:solution}
            </div>
        </div>
    </div>
    <div class="index2" style="background-image: url(/{:WSTConf('CONF.wxAppLogo')});">
        <div class="w1440 flex">
            <div class="txt wow fadeInRight">
                <div class="t1 font36">{:WstPagedata('Solutions')}</div>
                <div class="t2 font48">{:WstPagedata('Whatfor')}</div>
                <div class="img"><img src="/{:WSTConf('CONF.wxAppXcxLogo')}" alt="{:WstPagedata('Solutions')}"></div>
            </div>
            <div class="form wow fadeInLeft">
                <div class="line">
                    <div class="label"><span class="red">*</span><span>{:WstPagedata('Industry')}</span></div>
                    <div class="in">
                        <select id="hy" onchange="hangye(this)">
                            <option value="">{:WstPagedata('Select')}</option>
                            {volist name="soulist" id="val" key="k"}
                            <option value="{$val.goodsId}">{$val.goodsName}</option>
                            {/volist}
                        </select>
                    </div>
                </div>
                <div class="line">
                    <div class="label"><span class="red">*</span><span>{:WstPagedata('Solution')}</span></div>
                    <div class="in">
                        <select id="ly">
                            <option value="">{:WstPagedata('Select')}</option>
                            {volist name="soulist" id="val" key="k"}
                            {if $k == 1}
                            {volist name="val.son" id="val2" }
                            <option value="{$val2.itemName}">{$val2.itemName}</option>
                            {/volist}
                            {/if}
                            {/volist}
                        </select>
                    </div>
                </div>
                <div class="btns">
                    <a id="as" class="as">
                        <div class="vm"><span>{:WstPagedata('GetStarted')}</span><span class="icon icon-right"></span></div>
                    </a>
                </div>
            </div>
        </div>
    </div>
    <div class="index3 pt5">
        <div class="w1440">
            <div class="title"><span class="font48 wow fadeInUp">{:WstPagedata('Successful')}</span></div> 
            <div class="tab wow fadeInUp">
                {volist name="caCat" id="val" key="k"}
                <span>{$val.catName}</span>
                {/volist}
            </div>
            <div class="slideToggle swiper-container wow fadeInUp">
                <div class="swiper-wrapper">
                    {volist name="caCat" id="val" key="k"}
                    <div class="swiper-slide">
                        <div class="slideSwiper">
                            <div class="swiper-container">
                                <div class="swiper-wrapper">
                                    {volist name="val.son" id="vol" }
                                    <div class="swiper-slide">
                                        <img src="/{$vol.goodsImg2}" alt="{$vol.goodsName}" title="{$vol.goodsName}">
                                        <div class="txt">
                                            <div class="t font30"><p>{$vol.goodsName2}</p></div>
                                            <a class="vm3" href="{:Url('home/cases/detail','id='.$vol['goodsId'])}"><span>{:WstPagedata('More')}</span><span class="icon icon-right"></span>
                                            </a>
                                        </div>
                                    </div>
                                     {/volist}
                                </div>
                                <div class="dots"></div>
                            </div>
                        </div>
                    </div>
                    {/volist}
                </div>
            </div>
        </div>
    </div>
    <div class="index4 pt5 pb5">
        <div class="w1440">
            <div class="title"><span class="font48 wow fadeInUp">{:WstPagedata('ProductsSpec')}</span></div>
            <div class="tab wow fadeInUp">
                {volist name="gcCat" id="val" }
                <span>{$val.catName}</span>
                {/volist}
            </div>
            <div class="swiperWidthCtr wow fadeInUp">
                <div class="slideToggle2 swiper-container">
                    <div class="swiper-wrapper">
                        {volist name="gcCat" id="val" }
                        <div class="swiper-slide">
                            <div class="slideSwiper2">
                                <div class="swiper-container">
                                    <div class="swiper-wrapper">
                                        {volist name="val.goods" id="val2" }
                                        <div class="swiper-slide">
                                            <a href="{$val2.navUrl}" class="item">
                                                <div class="tg"><span class="icon icon-windows" {if $val2.goodsImg4} style="background: url({$val2.goodsImg4}) no-repeat center;" {/if}></span><span
                                                        class="fontb">{$val2.goodsName2}</span></div>
                                                <div class="img"><img src="__ROOT__/{$val2['goodsImg']}" title="{$val2['goodsName']}" alt="{$val2['goodsName']}"></div>
                                                <div class="txt">
                                                    <div class="tit font30">{$val2.goodsName}</div>
                                                    <div class="p">{$val2.goodDetail}</div>
                                                </div>
                                            </a>
                                        </div>
                                        {/volist}
                                        
                                    </div>
                                </div>
                            </div>
                        </div>
                        {/volist}
                    
                    </div>
                </div>
                <div class="ctr"><span class="prev"></span><span class="next"></span></div>
            </div>
        </div>
    </div>
    
 
    {:viewdata(1)}
    <div class="index8 pt5 pb5">
        <div class="w1440">
            <div class="title"><span class="font48 wow fadeInUp">{:WstPagedata('News')}</span></div>
            <div class="con flex">
                <div class="img wow fadeInRight">
                    {wst:article type="is_index" cat='0' num='6' offset="0"  key="k1"}
                    <div class="i"><img src="__ROOT__/{$vo['coverImg2']}" title="{$vo['articleTitle']}" alt="{$vo['articleTitle']}"></div>
                    {/wst:article}
                </div>
                <div class="news">
                    {wst:article type="is_index" cat='0' num='6' offset="0"  key="k1"}
                    <div class="item wow fadeInUp">
                        <a href="{$vo.navUrl}">
                            <div class="date">{$vo['releaseTime']}</div>
                            <div class="tit">{$vo['articleTitle']}</div>
                            <div class="p">{$vo['ymd']}</div>
                        </a>
                    </div>
                    {/wst:article}
                </div>
            </div>
        </div>
    </div>
    {:viewdata(2)}
    
    <script src="__STYLE__/js/wow.js"></script>
    <script src="__STYLE__/js/swiper.min.js"></script>
    <script src="__STYLE__/js/swiper.animate1.0.3.min.js"></script>
    <script src="__STYLE__/js/countUp.js"></script>
    <script type='text/javascript' src="__STATIC__/plugins/layui/layui.js?v={$v}"></script>
    <script>
        new WOW().init();
        let dashoffset = 145;
        var banner = new Swiper(".banner .swiper-container", {
            autoplay: {
                delay: 5000,
                disableOnInteraction: false
            },
            speed: 1000,
            loop: true,
            navigation: {
                nextEl: '.banner .next',
                prevEl: '.banner .prev',
            },
            on: {
                init: function () {
                    $(".swiperCtr .cur").text((this.realIndex + 1) > 9 ? (this.realIndex + 1) : "0" + (this.realIndex + 1));
                    $(".swiperCtr .total").text((this.slides.length - 2) > 9 ? (this.slides.length - 2) : "0" + (this.slides.length - 2));
                    //$(".swiperCtr #circle").css("stroke-dashoffset", "" + 145 - 145 * (this.realIndex) / (this.slides.length - 2) + "")
                },
                slideChangeTransitionStart: function () {
                    $(".banner .progress .svg").html('<svg width="50" height="50" viewBox="0 0 50 50"><circle id="circle" cx="25" cy="25" r="23" fill="transparent" stroke-width="2" stroke="#fff" /></svg>');
                },
                slideChangeTransitionEnd: function () {
                    $(".swiperCtr .cur").text((this.realIndex + 1) > 9 ? (this.realIndex + 1) : "0" + (this.realIndex + 1));
                    $(".swiperCtr .total").text((this.slides.length - 2) > 9 ? (this.slides.length - 2) : "0" + (this.slides.length - 2));
                    //$(".swiperCtr #circle").css("stroke-dashoffset", "" + 145 - 145 * (this.realIndex) / (this.slides.length - 2) + "")
                }
            }
        });
        $(".swiperCtr .pause").click(function () {
            if (banner.autoplay.running) {
                banner.autoplay.stop();
                $(this).addClass("on");
            } else {
                banner.autoplay.start();
                $(this).removeClass("on");
            }
        });
        //成功故事
        var slideSwiper = new Swiper(".slideSwiper .swiper-container", {
            autoplay: {
                delay: 4000,
                disableOnInteraction: false
            },
            speed: 1200,
            spaceBetween: 10,
            loop: true,
            pagination: {
                el: '.slideSwiper .dots',
            },
            loopAdditionalSlides: 1
        });
        var slideToggle = new Swiper(".slideToggle.swiper-container", {
            autoplay: false,
            loop: false,
            allowTouchMove: false
        });
        $(".index3 .tab span").click(function () {
            $(this).addClass("cur").siblings().removeClass("cur");
            slideToggle.slideTo($(this).index(), 0);
        });
        $(".index3 .tab span:first").click();
        //产品
        var slideSwiper2 = new Swiper(".slideSwiper2 .swiper-container", {
            autoplay: {
                delay: 4000,
                disableOnInteraction: false
            },
            speed: 1200,
            slidesPerView: 3,
            spaceBetween: 24,
            loop: false,
            breakpoints: {
                480: {
                    slidesPerView: 1.5,
                    spaceBetween: 20
                },
                768: {
                    slidesPerView: 2,
                    spaceBetween: 12
                },
            },
            navigation: {
                nextEl: '.index4 .next',
                prevEl: '.index4 .prev',
            },
        });
        var slideToggle2 = new Swiper(".slideToggle2.swiper-container", {
            autoplay: false,
            loop: false,
            allowTouchMove: false
        });
        $(".index4 .tab span").click(function () {
            $(this).addClass("cur").siblings().removeClass("cur");
            slideToggle2.slideTo($(this).index(), 0);
        });
        $(".index4 .tab span:first").click();
        //新闻
        $(".news .item").mouseover(function () {
            $('.index8 .img .i').eq($(this).index()).show().siblings().hide();
        });
        $(".news .item:first").mouseover();
        
        
    </script>
    {/block}