se
This commit is contained in:
parent
1621b2ddbf
commit
7da0bd279a
|
|
@ -1,131 +1,175 @@
|
|||
<?php $this->titre = "INTER-SANTE - Réseau de soins"; ?>
|
||||
<?php $this->titre = "Intersanté - Réseau de soins"; ?>
|
||||
|
||||
<div class="d-flex align-items-center mb-3">
|
||||
<i class="fas fa-hospital-user fa-2x text-primary me-2"></i>
|
||||
<h3 class="mb-0 text-uppercase fw-bold text-secondary" style="letter-spacing: 1px;">
|
||||
<?= _("Réseau de soins") ?>
|
||||
</h3>
|
||||
</div>
|
||||
|
||||
<div class="card shadow-sm border-0 mb-4" style="border-radius: 12px;">
|
||||
<div class="card-body bg-light" style="border-radius: 12px;">
|
||||
<div class="row g-3">
|
||||
<div class="col-12 col-md-4 col-lg-3">
|
||||
<label class="form-label small fw-bold text-muted"><?= _("Type de prestataire") ?></label>
|
||||
<select class="form-select form-select-sm" id="codeTypePrestataire" name="codeTypePrestataire">
|
||||
<?php liste_options_consultation($typeprestataire, ""); ?>
|
||||
</select>
|
||||
</div>
|
||||
|
||||
<div class="col-12 col-md-4 col-lg-3">
|
||||
<label class="form-label small fw-bold text-muted"><?= _("Réseau") ?></label>
|
||||
<select class="form-select form-select-sm" id="codeReseau" name="codeReseau">
|
||||
<?php liste_options_consultation($reseausoins, ""); ?>
|
||||
</select>
|
||||
</div>
|
||||
|
||||
<div class="col-12 col-md-4 col-lg-4">
|
||||
<label class="form-label small fw-bold text-muted"><?= _("Nom du Prestataire") ?></label>
|
||||
<div class="input-group input-group-sm">
|
||||
<span class="input-group-text bg-white"><i class="fas fa-search"></i></span>
|
||||
<input class="form-control" type="text" id="libelle" name="libelle"
|
||||
placeholder="Rechercher un nom..."
|
||||
onkeypress="javascript:ctrlkeypress_lite_prestataire(event);">
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<div class="col-12 col-md-4 col-lg-2">
|
||||
<label class="form-label small fw-bold text-muted"><?= _("Statut") ?></label>
|
||||
<input class="form-control form-control-sm text-center bg-white" type="text" id="nbligne" name="nbligne" value="Lignes : 0" readonly>
|
||||
</div>
|
||||
|
||||
<div class="col-12 col-md-4 col-lg-3">
|
||||
<label class="form-label small fw-bold text-muted"><?= _("Pays") ?></label>
|
||||
<select onChange="ajaxListerVilleConsultation();" class="form-select form-select-sm" id="codePays" name="codePays">
|
||||
<?php liste_options_consultation($pays, $_SESSION['codePaysSociete']); ?>
|
||||
</select>
|
||||
</div>
|
||||
|
||||
<div class="col-12 col-md-4 col-lg-3">
|
||||
<label class="form-label small fw-bold text-muted">
|
||||
<?= (isset($_SESSION['affichagedynamique']['Province'])) ? _($_SESSION['affichagedynamique']['Province']) : _("Province") ?>
|
||||
</label>
|
||||
<div id="listeville">
|
||||
<select onChange="ajaxListerLocaliteConsultation();" class="form-select form-select-sm" id="codeVille" name="codeVille">
|
||||
<?php liste_options_consultation($ville, ""); ?>
|
||||
</select>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<div class="col-12 col-md-4 col-lg-3">
|
||||
<label class="form-label small fw-bold text-muted">
|
||||
<?= (isset($_SESSION['affichagedynamique']['Commune'])) ? _($_SESSION['affichagedynamique']['Commune']) : _("Commune") ?>
|
||||
</label>
|
||||
<div id="listelocalite">
|
||||
<select class="form-select form-select-sm" id="codeLocalite" name="codeLocalite">
|
||||
<?php liste_options_consultation($listelocalite, "" ); ?>
|
||||
</select>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<div class="col-12 col-md-4 col-lg-3 d-flex align-items-end">
|
||||
<button type="button" class="btn btn-primary btn-sm w-100 fw-bold shadow-sm" onclick="javascript:afficher_lite_prestataire();">
|
||||
<i class="fas fa-filter me-1"></i> <?= _("Afficher les résultats") ?>
|
||||
</button>
|
||||
</div>
|
||||
<div class="card shadow-lg border-0 mb-4 main-container-card">
|
||||
<div class="card-header bg-primary text-white py-3">
|
||||
<div class="d-flex align-items-center justify-content-center">
|
||||
<i class="fas fa-project-diagram fa-lg me-3"></i>
|
||||
<h4 id="h4_titre" class="mb-0 fw-bold">
|
||||
<span id="id_titre_page"><?= _("Réseau des prestataires") ?></span>
|
||||
</h4>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<div class="card shadow-sm border-0">
|
||||
<div class="card-header bg-white border-bottom py-3">
|
||||
<h6 class="mb-0 fw-bold text-primary"><i class="fas fa-list me-2"></i><?= _("Liste des prestataires") ?></h6>
|
||||
</div>
|
||||
<div class="card-body p-0">
|
||||
<div id="div_liste_prestataire" class="table-responsive">
|
||||
<table class="table table-hover align-middle mb-0" style="font-size: 0.9rem;">
|
||||
<thead class="table-light">
|
||||
<tr>
|
||||
<th class="ps-3"><?= _("Nom") ?></th>
|
||||
<th class="text-center" width="80 px">Code</th>
|
||||
<th>Type</th>
|
||||
<th><?= _("Réseau") ?></th>
|
||||
<th class="text-center"><?= _("Tarif") ?></th>
|
||||
<th class="text-center"><?= _("Cons") ?></th>
|
||||
<th class="text-center" width="50 px">Action</th>
|
||||
</tr>
|
||||
</thead>
|
||||
<tbody id="body_liste_prestataire">
|
||||
<tr>
|
||||
<td colspan="7" class="text-center text-muted py-4">
|
||||
<i class="fas fa-info-circle me-1"></i> Utilisez les filtres ci-dessus pour afficher les prestataires.
|
||||
</td>
|
||||
</tr>
|
||||
</tbody>
|
||||
</table>
|
||||
<div class="card-body bg-light-subtle">
|
||||
<div class="card shadow-sm border-0 mb-4 search-filter-card">
|
||||
<div class="card-body p-4">
|
||||
<div class="row g-3">
|
||||
<div class="col-12 col-md-6 col-lg-4">
|
||||
<label class="form-label small fw-bold text-muted text-uppercase"><?= _("Type du prestataire") ?></label>
|
||||
<select class="form-select select2-enable" id="codeTypePrestataire" name="codeTypePrestataire" autofocus>
|
||||
<?php liste_options_consultation($typeprestataire, ""); ?>
|
||||
</select>
|
||||
</div>
|
||||
|
||||
<div class="col-12 col-md-6 col-lg-4">
|
||||
<label class="form-label small fw-bold text-muted text-uppercase"><?= _("Catégorie du réseau") ?></label>
|
||||
<select class="form-select" id="codeReseau" name="codeReseau">
|
||||
<?php liste_options_consultation($reseausoins, ""); ?>
|
||||
</select>
|
||||
</div>
|
||||
|
||||
<div class="col-12 col-md-6 col-lg-4">
|
||||
<label class="form-label small fw-bold text-muted text-uppercase"><?= _("Nom du prestataire") ?></label>
|
||||
<input class="form-control" type="text" id="libelle" name="libelle"
|
||||
placeholder="<?= _("Ex: Clinique...") ?>"
|
||||
onkeypress="javascript:ctrlkeypress_liste_prestataires_actif(event);">
|
||||
</div>
|
||||
|
||||
<div class="col-12 col-md-6 col-lg-4">
|
||||
<label class="form-label small fw-bold text-muted text-uppercase"><?= _("Pays") ?></label>
|
||||
<select onChange="ajaxListerVilleConsultation();" class="form-select" id="codePays" name="codePays">
|
||||
<?php liste_options_consultation($pays, $_SESSION['codePaysSociete']); ?>
|
||||
</select>
|
||||
</div>
|
||||
|
||||
<div class="col-12 col-md-6 col-lg-4">
|
||||
<label class="form-label small fw-bold text-muted text-uppercase"><?= _("Région") ?></label>
|
||||
<div id="listeville">
|
||||
<select onChange="ajaxListerLocaliteConsultation();" class="form-select" id="codeVille" name="codeVille">
|
||||
<?php liste_options_consultation($ville, ""); ?>
|
||||
</select>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<div class="col-12 col-md-6 col-lg-4">
|
||||
<label class="form-label small fw-bold text-muted text-uppercase"><?= _("District") ?></label>
|
||||
<div id="listelocalite">
|
||||
<select class="form-select" id="codeLocalite" name="codeLocalite">
|
||||
<?php liste_options_consultation($listelocalite, "" ); ?>
|
||||
</select>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<div class="col-12 mt-4">
|
||||
<button id="btn_filtre" type="button" class="btn btn-primary btn-lg w-100 shadow-sm transition-all"
|
||||
onclick="handleSearchClick();">
|
||||
<span id="btn_text"><i class="fas fa-search me-2"></i> <?= _("Afficher les résultats") ?></span>
|
||||
<span id="btn_spinner" class="d-none spinner-border spinner-border-sm me-2" role="status"></span>
|
||||
</button>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<div id="container_resultats" class="card shadow-sm border-0 d-none">
|
||||
<div class="card-body p-0">
|
||||
<div id="div_liste_prestataire" class="table-responsive">
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<style>
|
||||
/* Amélioration visuelle légère */
|
||||
.form-select:focus, .form-control:focus {
|
||||
border-color: #337ab7;
|
||||
box-shadow: 0 0 0 0.2rem rgba(51, 122, 183, 0.25);
|
||||
:root {
|
||||
--primary-soft: #e7f1ff;
|
||||
--transition-speed: 0.3s;
|
||||
}
|
||||
.table thead th {
|
||||
text-transform: uppercase;
|
||||
font-size: 0.75rem;
|
||||
letter-spacing: 0.5px;
|
||||
color: #6c757d;
|
||||
|
||||
.main-container-card {
|
||||
border-radius: 15px !important;
|
||||
overflow: hidden;
|
||||
}
|
||||
.btn-primary {
|
||||
background-color: #337ab7;
|
||||
border-color: #2e6da4;
|
||||
transition: all 0.2s;
|
||||
|
||||
.search-filter-card {
|
||||
border-radius: 12px !important;
|
||||
transition: transform var(--transition-speed);
|
||||
}
|
||||
|
||||
.form-control, .form-select {
|
||||
border-radius: 8px;
|
||||
padding: 0.6rem 1rem;
|
||||
border: 1px solid #dee2e6;
|
||||
transition: all var(--transition-speed);
|
||||
}
|
||||
|
||||
.form-control:focus, .form-select:focus {
|
||||
border-color: #0d6efd;
|
||||
box-shadow: 0 0 0 0.25rem rgba(13, 110, 253, 0.15);
|
||||
background-color: #fff;
|
||||
}
|
||||
|
||||
.transition-all {
|
||||
transition: all var(--transition-speed) ease;
|
||||
}
|
||||
|
||||
.btn-primary:hover {
|
||||
background-color: #286090;
|
||||
transform: translateY(-1px);
|
||||
box-shadow: 0 4px 12px rgba(13, 110, 253, 0.3) !important;
|
||||
}
|
||||
</style>
|
||||
|
||||
/* Améliorations Tablettes & Mobiles */
|
||||
@media (max-width: 768px) {
|
||||
.card-header h4 { font-size: 1.1rem; }
|
||||
.form-label { font-size: 0.75rem; }
|
||||
|
||||
/* Empêche le zoom sur iOS */
|
||||
input, select { font-size: 16px !important; }
|
||||
|
||||
.p-4 { padding: 1.5rem !important; }
|
||||
}
|
||||
|
||||
/* Animation de chargement */
|
||||
.loading-opacity {
|
||||
opacity: 0.6;
|
||||
pointer-events: none;
|
||||
}
|
||||
</style>
|
||||
|
||||
<script>
|
||||
function handleSearchClick() {
|
||||
const btn = document.getElementById('btn_filtre');
|
||||
const text = document.getElementById('btn_text');
|
||||
const spinner = document.getElementById('btn_spinner');
|
||||
const resultContainer = document.getElementById('container_resultats');
|
||||
|
||||
// UI Feedback
|
||||
btn.disabled = true;
|
||||
text.classList.add('d-none');
|
||||
spinner.classList.remove('d-none');
|
||||
|
||||
// Appel de votre fonction originale
|
||||
if (typeof afficher_liste_prestataires_actifs === "function") {
|
||||
afficher_liste_prestataires_actifs();
|
||||
|
||||
// Simulation d'affichage du container de résultat
|
||||
// (À intégrer idéalement dans le success de votre appel AJAX original)
|
||||
setTimeout(() => {
|
||||
resultContainer.classList.remove('d-none');
|
||||
btn.disabled = false;
|
||||
text.classList.remove('d-none');
|
||||
spinner.classList.add('d-none');
|
||||
}, 800);
|
||||
}
|
||||
}
|
||||
|
||||
document.addEventListener('DOMContentLoaded', function() {
|
||||
// Optimisation des interactions mobiles
|
||||
const selects = document.querySelectorAll('.form-select');
|
||||
selects.forEach(s => {
|
||||
s.addEventListener('change', function() {
|
||||
this.classList.add('is-valid');
|
||||
});
|
||||
});
|
||||
});
|
||||
</script>
|
||||
Loading…
Reference in New Issue
Block a user