{% extends 'base_emine.html.twig' %}

{% block title %}{{parent()}}-Résultats de la recherche{% endblock %}

{#{% block content %}
    <div class="content-wrapper" style="margin-top:180px;">
		<div class="container-full">
			<div class="content-header">
				<div class="d-flex align-items-center">
					<div class="me-auto">
						<h3 class="page-title text-dark">Résultats de la recherche</h3>
						<div class="d-inline-block align-items-center">
							<nav>
								<ol class="breadcrumb">
									<li class="breadcrumb-item"><a href="#"><i class="mdi mdi-home-outline"></i></a></li>
									<li class="breadcrumb-item" aria-current="page">Recherche</li>
                                    <li class="breadcrumb-item" aria-current="page">Opérateurs</li>
									<li class="breadcrumb-item active text-dark" aria-current="page">Résultats de la recherche</li>
								</ol>
							</nav>
						</div>
					</div>
				</div>
			</div>

			<!-- Main content -->
			<section class="content">
				<div class="row">
                    <div class="col-12">
						<div class="box">
							<div class="box-header with-border">
								<h3 class="box-title text-dark">Résultats de la recherche ({{data}})</h3>
							</div>
							<div class="box-body">
								<div class="table-responsive" style="margin-top: 40px;">
									<table class="table table-bordered table-hover display nowrap margin-top-10 w-p100 shadow bg-body">
										<thead>
											<tr style="background-color: #17418a;">
												<th class="bb-2 text-white">N°</th>
												<th class="bb-2 text-white">Nom</th>
												<th class="bb-2 text-white">Sigle</th>
												<th class="bb-2 text-white">NIF</th>
												<th class="bb-2 text-white">Filière</th>
												<th class="bb-2 text-white">Statut</th>
												<th class="bb-2 text-white">Secteur</th>
												<th class="bb-2 text-white">Catégorie</th>
												<th class="bb-2 text-white">Partenariat</th>
												<th class="bb-2 text-white">Province</th>
												<th class="bb-2 text-white">Part de l'Etat</th>
												<th class="bb-2 text-white">Détails</th>
											</tr>
										</thead>
										<tbody id="resultsOpera">
											{% set compter = 0 %}

											{% for item in operateurs %}
												{% set compter  = compter + 1 %}

												<tr>
													<td>{{compter}}</td>
													<td>{{item.denomination}}</td>
													<td>{{item.sigle}}</td>
													<td>{{item.numIdentFiscal}}</td>
													<td>
														{% if item.commodites[0] is defined %}
															{{item.commodites[0].filiere.nom}}
														{% endif %}
													</td>
													<td>{{item.statut ? item.statut : ""}}</td>
													<td>{{item.sousSecteur ? item.sousSecteur.secteur.nom : ""}}</td>
													<td>{{item.categorie ? item.categorie.nom : ""}}</td>
													<td>{{item.nature}}</td>
													<td>{{item.ville ? item.ville.province.nom : ''}}</td>
													<td>
														{% if item.partEtat is not null %}
															{{item.partEtat}} %
														{% endif %}
													</td>
													<td>
														<a href="{{path('app_emine_operateur_operateur_show', {id: item.id, sp: 'all'})}}" class="badge badge-pill badge-xl badge-primary px-15 btn-outline btn-primary-light text-white" style="background-color:#17418a;">
															<i class="fa fa-eye"></i>
														</a>
													</td>
												</tr>
                                            {% else %}
                                                <tr class="text-center">
                                                    <td colspan="12">Aucune information dans la base de données</td>
                                                </tr>
											{% endfor %}
										</tbody>
									</table>
								</div>
							</div>
						</div>
					</div>
                </div>
            </section>
        </div>
    </div>    
{% endblock %}#}

{% block content %}
	<main style="padding-top: 180px; min-height: 100vh;" class="bg-charcoal-light">
		<div class="container py-4">
			<nav class="operators-breadcrumb mb-4">
				<ol>
					<li>
						<a href="/">
							<svg width="15" height="15" viewbox="0 0 24 24" fill="none" stroke="currentColor" strokewidth="2" strokelinecap="round" strokelinejoin="round">
								<path d="m3 9 9-7 9 7v11a2 2 0 0 1-2 2H5a2 2 0 0 1-2-2z"/><polyline points="9 22 9 12 15 12 15 22"/>
							</svg>
							Accueil
						</a>
					</li>
					<li class="separator">
						<svg width="14" height="14" viewbox="0 0 24 24" fill="none" stroke="currentColor" strokewidth="2" strokelinecap="round" strokelinejoin="round">
							<polyline points="9 18 15 12 9 6"/>
						</svg>
					</li>
					<li>
						<a href="#">Recherche</a>
					</li>
					<li class="separator">
						<svg width="14" height="14" viewbox="0 0 24 24" fill="none" stroke="currentColor" strokewidth="2" strokelinecap="round" strokelinejoin="round">
							<polyline points="9 18 15 12 9 6"/>
						</svg>
					</li>
					<li>
						<a href="#">Opérateurs</a>
					</li>
					<li class="separator">
						<svg width="14" height="14" viewbox="0 0 24 24" fill="none" stroke="currentColor" strokewidth="2" strokelinecap="round" strokelinejoin="round">
							<polyline points="9 18 15 12 9 6"/>
						</svg>
					</li>
					<li class="active">Résultats de la recherche</li>
				</ol>
			</nav>

			<div class="d-flex flex-column flex-md-row align-items-start align-items-md-center justify-content-between gap-3 mb-4">
				<div>
					<h1 class="fw-bold mb-1" style="font-family: var(--font-display); font-size: 1.6rem;">
						🔍 Résultats de la recherche
					</h1>
					<p class="text-muted-mine mb-0" style="font-size: 0.9rem">
						Résultats de la recherche ({{data}})
					</p>
				</div>
				<div class="d-flex gap-2 flex-wrap">
				</div>
			</div>


			<div class="mb-4" style='background-color: var(--card-bg);border: 1px solid var(--border-color);border-radius: 1rem;transition: all 0.3s ease;'>
				<div class="d-flex flex-column flex-md-row gap-3 p-3">
					<div class="d-flex gap-2 flex-wrap align-items-center">
						<a class="operators-status-chip active btn" href="{{path('app_emine_operateur_operateur_index')}}">
							Tous
						</a>

						<a class="operators-status-chip btn" href="{{path('app_emine_operateur_operateur_valide_by_statut', {statut: 'Actif'})}}">
							Actif
						</a>

						<a key="3" class="operators-status-chip btn" href="{{path('app_emine_operateur_operateur_valide_by_statut', {statut: 'En production'})}}">
							En production
						</a>

						<a key="4" class="operators-status-chip btn" href="{{path('app_emine_operateur_operateur_valide_by_statut', {statut: 'En recherche'})}}">
							En recherche
						</a>

						<div class="dropdown nav-scroller-dropdown" style='position:relative;z-index:9;'>
							<button class="operators-action-btn" type="button" data-bs-toggle="dropdown" aria-expanded="false" title="Opérations sur le titre">
								<svg width="16" height="16" viewbox="0 0 24 24" fill="none" stroke="currentColor" strokewidth="2" strokelinecap="round" strokelinejoin="round">
									<circle cx="12" cy="12" r="1"/><circle cx="12" cy="5" r="1"/><circle cx="12" cy="19" r="1"/>
								</svg>
							</button>
							<div class="dropdown-menu dropdown-menu-end dropdown-menu-dark-mine" style='position:fixed;top:20;left:20;z-index: 999999;background:#ffffff; border: 1px solid rgba(23, 65, 138, 0.15);border-radius: 0 0 10px 10px; box-shadow: 0 8px 30px rgba(0,0,0,0.22), 0 0 0 1px rgba(23,65,138,0.1);padding:0.4rem;min-width: 220px;animation: dropdown-slide 0.2s ease-out;'>
								<div>
									<a class="dropdown-item titres-dropdown-item" href="{{path('app_emine_operateur_operateur_valide_by_statut', {statut: 'En développement'})}}">
										En développement
									</a>
								</div>
								<div><hr class="dropdown-divider"/></div>
								<div>
									<a class="dropdown-item titres-dropdown-item" href="{{path('app_emine_operateur_operateur_valide_by_statut', {statut: 'En construction'})}}">
										En construction
									</a>
								</div>
								<div><hr class="dropdown-divider"/></div>
								<div>
									<a class="dropdown-item titres-dropdown-item" href="{{path('app_emine_operateur_operateur_valide_by_statut', {statut: 'En cessation d\'activité'})}}">
										En cessation d'activité
									</a>
								</div>
								<div><hr class="dropdown-divider"/></div>
								<div>
									<a class="dropdown-item titres-dropdown-item" href="{{path('app_emine_operateur_operateur_valide_by_statut', {statut: 'Inactif'})}}">
										Inactif
									</a>
								</div>
							</div>
						</div>
					</div>
				</div>
			</div>

			<div class="dashboard-card">
				<div class="dashboard-table-wrap">
					<table class="dashboard-table">
						<thead>
							<tr>
								<th>N°</th>
								<th>Nom / Raison sociale</th>
								<th>Sigle</th>
								<th>Nif</th>
								<th>Filière</th>
								<th class="text-center">Statut</th>
								<th>Secteur</th>
								<th>Catégorie</th>
								<th>Sous-catégorie</th>
								<th>Partenariat</th>
								<th>Province</th>
								<th>Part de l'Etat</th>
								<th class="text-center">Actions</th>
							</tr>
						</thead>
						<tbody id="resultsOpera">
							{% set compter = 0 %}

							{% for op in operateurs %}
								{% set compter  = compter + 1 %}

								<tr class="animate-fade-in-up">
									<td>
										<span style="font-family: var(--font-display); font-weight: 600; font-size:0.82rem; color:var(--copper);">
											{{compter}}
										</span>
									</td>
									<td class="fw-medium">{{op.denomination}}</td>
									<td style="font-size:0.85rem;">{{op.sigle}}</td>
									<td style="font-size:0.85rem;">{{op.numIdentFiscal}}</td>
									<td style="font-size: 0.85rem;">
										{% if op.commodites[0] is defined %}
											{{op.commodites[0].filiere.nom}}
										{% endif %}
									</td>

									{% if op.statut == 'En recherche' %}
										<td class="text-center">
											<span class="dashboard-badge" style="background: #f59e0b18; color: #d97706, borderColor:#f59e0b44;">
												{{op.statut ? op.statut : ""}}
											</span>
										</td>
									{% elseif op.statut == 'Inactif' %}
										<td class="text-center">
											<span class="dashboard-badge" style="background: #ef444418; color: #dc2626, borderColor:#ef444444;">
												{{op.statut ? op.statut : ""}}
											</span>
										</td>
									{% else %}
										<td class="text-center">
											<span class="dashboard-badge" style="background: #22c55e18; color: #16a34a, borderColor:#22c55e44;">
												{{op.statut ? op.statut : ""}}
											</span>
										</td>
									{% endif %}

									<td style="font-size:0.85rem;">{{op.sousSecteur ? op.sousSecteur.secteur.nom : ""}}</td>
									<td style="font-size:0.85rem;">{{op.categorie ? op.categorie.nom : ""}}</td>
									<td style="font-size:0.85rem;">{{op.sousCategorie ? op.sousCategorie.nom : ""}}</td>
									<td style="font-size:0.85rem;">{{op.nature}}</td>
									<td style="font-size:0.85rem;">{{op.ville ? op.ville.province.nom : ''}}</td>
									<td style="font-size:0.85rem;">
										{% if op.partEtat is not null %}
											{{op.partEtat}}
											%
										{% endif %}
									</td>
									<td class="text-center">
										<div class="d-flex gap-1 justify-content-center">
											<a class="operators-action-btn" title="Voir les détails" href="{{path('app_emine_operateur_operateur_show', {id: op.id, sp: 'all'})}}">
												<svg width="15" height="15" viewbox="0 0 24 24" fill="none" stroke="currentColor" strokewidth="2" strokelinecap="round" strokelinejoin="round">
													<path d="M1 12s4-8 11-8 11 8 11 8-4 8-11 8-11-8-11-8z"/><circle cx="12" cy="12" r="3"/>
												</svg>
											</a>
										</div>
									</td>
								</tr>
							{% else %}
								<tr>
									<td colspan="13" class="text-center py-5 text-muted-mine">
										Aucun opérateur trouvé pour cette recherche.
									</td>
								</tr>
							{% endfor %}
						</tbody>
					</table>
				</div>
			</div>
		</div>
	</main>
{% endblock %}