100 lines
5.2 KiB
PHP
Executable File
100 lines
5.2 KiB
PHP
Executable File
<div class="page-content">
|
||
<div class="header-section mb-1">
|
||
<div class="d-flex align-items-center bg-white p-3 shadow-sm border-start border-primary border-4" style="border-radius: var(--radius-md);">
|
||
<div class="icon-shape bg-primary-ghost text-primary rounded-circle me-3" style="width: 48px; height: 48px; display: flex; align-items: center; justify-content: center;">
|
||
<i class="fas fa-user-shield fs-4"></i>
|
||
</div>
|
||
<div>
|
||
<h4 id="titre-page" class="mb-0 fw-bold text-uppercase"><?= _("Gestion des Garants") ?></h4>
|
||
<p class="text-muted small mb-0"><?= _("Recherche et configuration des porteurs de risque") ?></p>
|
||
</div>
|
||
</div>
|
||
</div>
|
||
|
||
<div class="card border-0 shadow-sm mb-1">
|
||
<div class="card-header py-3 border-bottom bg-light">
|
||
<h6 class="mb-0 fw-bold text-uppercase text-primary small">
|
||
<i class="fas fa-search me-2"></i><?= _("Critères de recherche") ?>
|
||
</h6>
|
||
</div>
|
||
<div class="card-body p-4">
|
||
<form id="formRecherche" onsubmit="return false;">
|
||
<div class="row g-3 align-items-end">
|
||
<div class="col-md-3">
|
||
<label class="form-label fw-bold text-muted text-uppercase small"><?= _("Type") ?></label>
|
||
<select class="selectpicker form-control border-2 shadow-xs" id="typeGarant" name="typeGarant" data-live-search="true" data-container="body">
|
||
<?php liste_options_consultation($typegc, ""); ?>
|
||
</select>
|
||
</div>
|
||
|
||
<div class="col-md-2">
|
||
<label class="form-label fw-bold text-muted text-uppercase small"><?= _("Code") ?></label>
|
||
<div class="input-group shadow-xs">
|
||
<span class="input-group-text bg-white border-2 border-end-0"><i class="fas fa-barcode text-muted"></i></span>
|
||
<input type="text" class="form-control border-2 border-start-0 fw-bold" id="codeGcAssureur" name="codeGcAssureur" onkeypress="ctrlkeypress_liste_garants(event);">
|
||
</div>
|
||
</div>
|
||
|
||
<div class="col-md-5">
|
||
<label class="form-label fw-bold text-muted text-uppercase small"><?= _("Nom du Garant") ?></label>
|
||
<div class="input-group shadow-xs">
|
||
<span class="input-group-text bg-white border-2 border-end-0"><i class="fas fa-building text-primary"></i></span>
|
||
<input type="text" class="form-control border-2 border-start-0 majuscule fw-bold" id="libelle" name="libelle" onkeypress="ctrlkeypress_liste_garants(event);">
|
||
</div>
|
||
</div>
|
||
|
||
<div class="col-md-2">
|
||
<button type="button" class="btn btn-primary w-100 rounded-pill fw-bold shadow-sm py-2" onclick="afficher_liste_garants();">
|
||
<i class="fas fa-sync-alt me-2"></i><?= _("Afficher") ?>
|
||
</button>
|
||
</div>
|
||
</div>
|
||
</form>
|
||
</div>
|
||
</div>
|
||
|
||
<div class="results-section">
|
||
<div id="div_gcs">
|
||
<div class="text-center p-5 bg-white rounded shadow-xs border border-dashed">
|
||
<div class="icon-shape bg-light text-muted rounded-circle mx-auto mb-3" style="width: 60px; height: 60px; display: flex; align-items: center; justify-content: center;">
|
||
<i class="fas fa-list-check fa-2x"></i>
|
||
</div>
|
||
<h6 class="text-muted fw-bold"><?= _("Lancez une recherche pour afficher la liste des garants") ?></h6>
|
||
</div>
|
||
</div>
|
||
</div>
|
||
</div>
|
||
|
||
<script>
|
||
document.addEventListener("DOMContentLoaded", function() {
|
||
// Initialisation SelectPicker
|
||
if (typeof actualiserSelectPicker === 'function') {
|
||
actualiserSelectPicker('#typeGarant', false);
|
||
} else {
|
||
// Exemple d'initialisation sans jQuery :
|
||
const typeGarant = document.querySelector('#typeGarant');
|
||
if (typeGarant) {
|
||
// Ici tu devras remplacer par l’équivalent natif ou une lib JS
|
||
// car selectpicker est une extension jQuery Bootstrap.
|
||
// Exemple : activer la recherche live avec un plugin custom
|
||
console.log("Initialiser selectpicker manuellement ou via une alternative JS");
|
||
}
|
||
}
|
||
|
||
// Focus Neutral Pro
|
||
setTimeout(function() {
|
||
const libelle = document.querySelector('#libelle');
|
||
if (libelle) {
|
||
libelle.focus();
|
||
}
|
||
}, 200);
|
||
});
|
||
</script>
|
||
|
||
<style>
|
||
/* Intégration Design System */
|
||
.shadow-xs { box-shadow: 0 2px 4px rgba(0,0,0,0.05); }
|
||
.form-control.border-2, .input-group-text.border-2 { border-width: 2px !important; }
|
||
.majuscule { text-transform: uppercase; }
|
||
.border-dashed { border-style: dashed !important; }
|
||
</style>
|