{% extends 'main_base.html.twig' %}
{% block title %}{{ entity ? entity.title : kategori.title }}{% endblock %}
{% block description %}{{ entity ? entity.description : kategori.description }}{% endblock %}
{% block content %}
    {% set banner = entity ? entity.hizmet.banner : kategori.kategori.banner %}
    {% if entity %}
        {% set bannerPath = asset('uploads/hizmet/banner/') %}
    {% else %}
        {% set bannerPath = asset('uploads/hizmet/kategori/banner/') %}
    {% endif %}
    {% if banner is null %}
        {% set banner = 'hizmet.jpg' %}
        {% set bannerPath = asset('assets/main/img/') %}
    {% endif %}
    <div class="page_head" id="hizmet-banner" style="background-image: url('{{ bannerPath~banner }}'); background-position:center">
        <h1 class="page-title animate__animated animate__flipInX">{{ entity ? entity.baslik : kategori.baslik }}</h1>
        <div class="tree animate__animated animate__slideInDown">
            <a href="{{ path('app_main_default') }}">{{ 'home'|trans }} </a>
            <span>/</span>
            <a href="javascript:void(0);">{{ 'services'|trans }} </a>
            <span>/</span>
            {% if entity %}
                <a href="{{ path('app_main_hizmetler', {'slug': kategori.link}) }}">{{ kategori.baslik }} </a>
                <span>/</span>
                <a href="javascript:void(0)" class="activetree">{{ entity.baslik }}</a>
            {% else %}
                <a href="" class="activetree">{{ kategori.baslik }}</a>
            {% endif %}
        </div>
        {#<div class="innerPage-banner-img-hiz">
            <img src="{{ asset('assets/main/img/cert.png') }}" alt="">
        </div>#}
    </div>
    <div class="container">
        <div class="page-h-text animate__animated animate__slideInUp">
            {{ kategori.metin2|default|raw }}
        </div>
        <div class="page-icerik">
            <div class="page-title2">{{ entity ? entity.baslik : kategori.baslik }}</div>
            <div class="page-text">
                {{ entity ? entity.metin|default|raw : kategori.metin|default|raw }}
            </div>
            {% if entity %}
                <div class="ana-buton-hizmetler">
                    <ul class="ana-hizmet-buton-ul-banner">
                        {% for item in kategori.kategori.hizmetler|filter(h => h.del == 0) %}
                            {% set itemDil = item.diller|filter(d => d.dil.kisaBaslik == app.request.locale)|first %}
                            <li class="ana-hizmet-buton-li {% if itemDil.link == entity.link %}ui-state-active{% endif %}"><a href="{{ path('app_main_hizmetler', {'slug':kategori.link,'link':itemDil.link}) }}">{{ itemDil.baslik }}</a></li>
                        {% endfor %}
                    </ul>
                </div>
                <div id="tabs">
                    <div class="row">
                        <div class="col-md-6">
                            <div class="swiper hizmet-swiper">
                                <div class="swiper-wrapper">
                                    {% for resim in entity.hizmet.resimler|filter(r => r.del == 0) %}
                                        <div class="swiper-slide"><img src="{{ asset('uploads/hizmet/'~resim.resim) }}" alt="Askon"></div>
                                    {% endfor %}
                                </div>
                                <div class="swiper-pagination"></div>
                                <div class="hakkimizda-swiper-navs" hidden="hidden">
                                    <div class="swiper-button-prev"></div>
                                    <div class="swiper-button-next"></div>
                                </div>
                            </div>
                        </div>
                        <div class="col-md-6">
                            <div class="hizmet-swiper-right">
                                <div class="hizmet-swiper-title">{{ entity.baslik }}</div>
                                <div class="hizmet-swiper-text">
                                    {{ entity.metin2|raw }}
                                </div>
                            </div>
                        </div>
                    </div>
                </div>
            {% else %}
                <div class="ana-buton-hizmetler">
                    <ul class="ana-hizmet-buton-ul-banner">
                        {% for item in kategori.kategori.hizmetler|filter(h => h.del == 0) %}
                            {% set itemDil = item.diller|filter(d => d.dil.kisaBaslik == app.request.locale)|first %}
                            <li class="ana-hizmet-buton-li"><a href="{{ path('app_main_hizmetler', {'slug': kategori.link,'link': itemDil.link}) }}">{{ itemDil.baslik }}</a></li>
                        {% endfor %}
                    </ul>
                </div>
                {% for bolum in kategori.kategori.bolumler|filter(b => b.del == 0) %}
                    {% set bolumDil = bolum.diller|filter(d => d.dil.kisaBaslik == app.request.locale)|first %}
                    <div id="tabs">
                        <div class="row mb-5">
                            <div class="col-md-6">
                                <div class="swiper hizmet-swiper">
                                    <div class="swiper-wrapper">
                                        {% for resim in bolum.resimler|filter(r => r.del == 0) %}
                                            <div class="swiper-slide"><img src="{{ asset('uploads/hizmet/bolum/'~resim.resim) }}" alt="Askon"></div>
                                        {% endfor %}
                                    </div>
                                    <div class="swiper-pagination"></div>
                                    <div class="hakkimizda-swiper-navs" hidden="hidden">
                                        <div class="swiper-button-prev"></div>
                                        <div class="swiper-button-next"></div>
                                    </div>
                                </div>
                            </div>
                            <div class="col-md-6">
                                <div class="hizmet-swiper-right">
                                    <div class="hizmet-swiper-title">{{ bolumDil.baslik }}</div>
                                    <div class="hizmet-swiper-text">
                                        {{ bolumDil.metin|raw }}
                                    </div>
                                </div>
                            </div>
                        </div>
                    </div>
                {% endfor %}
            {% endif %}
        </div>
        <div class="temizle"></div>
    </div>
    <section class="we-hizmets">
        <div class="explore-inner hizmet-explore">
            <p>{{ 'browse_systems'|trans }}</p>
        </div>
        <div class="container">
            <div class="we-container">
                <div class="we-inner we-hizmet">
                    <div class="row">
                        {% for item in hizmetKategoriler %}
                            {% set itemDil = item.diller|filter(d => d.dil.kisaBaslik == app.request.locale)|first %}
                            <div class="col-md-4 we-hizmet-box">
                                <div class="we-item">
                                    <div class="we-img we-img-hizmet">
                                        <img src="{{ asset('uploads/hizmet/kategori/icon/'~item.icon) }}" alt="">
                                    </div>
                                    <a href="{{ path('app_main_hizmetler', {'slug': item.diller|first.link}) }}"><h3>{{ itemDil.baslik }}</h3></a>
                                    {{ itemDil.metin|default|raw }}
                                </div>
                            </div>
                        {% endfor %}
                    </div>
                </div>
            </div>
        </div>
    </section>
{% endblock %}


{% block pageScript %}
    <script>
        window.addEventListener('DOMContentLoaded', () => {
            $(".we-hizmet-box").each(function () {
                $(this).find(".we-item > p").not(":first").remove();
            });
        });
    </script>
{% endblock %}