dert
This commit is contained in:
parent
1749711fb8
commit
5a50a1c92c
|
|
@ -86157,32 +86157,55 @@ function ajax_police_context()
|
|||
}
|
||||
}
|
||||
|
||||
function affiche_pays_territoire()
|
||||
{
|
||||
var codeTerritoire = $('#codeTerritoire').val();
|
||||
|
||||
donnees = 'codeTerritoire='+codeTerritoire;
|
||||
|
||||
div_pays=$("#div_pays");
|
||||
|
||||
div_pays.html('<div style="padding-top:80px; text-align:center; font-size:14px; color: #0088cf; "><span><i class="fa fa-spinner fa-spin fa-5x" >' + '</span></div>');
|
||||
|
||||
$.ajax({
|
||||
url: $("#racineWeb").val()+"Ajaxpaysterritoire/",
|
||||
type : 'post',
|
||||
data: donnees,
|
||||
error: function(errorData){
|
||||
//alert("Erreur : "+errorData);
|
||||
},
|
||||
success: function(data) {
|
||||
|
||||
$('#div_pays').html(data);
|
||||
datatab_plus();
|
||||
},
|
||||
complete: function() {
|
||||
|
||||
}
|
||||
});
|
||||
/**
|
||||
* Affiche la liste des pays selon le territoire sélectionné
|
||||
*/
|
||||
function affiche_pays_territoire() {
|
||||
const racineWeb = $("#racineWeb").val();
|
||||
const codeTerritoire = $('#codeTerritoire').val();
|
||||
const codeLangue = $("#codeLangue").val();
|
||||
const $divPays = $("#div_pays");
|
||||
|
||||
// 1. Validation de la sélection
|
||||
if (!codeTerritoire) return;
|
||||
|
||||
// 2. Feedback visuel (SaaS UX)
|
||||
const loadingMsg = (codeLangue === "en_US") ? "Loading countries..." : "Chargement des pays...";
|
||||
|
||||
$divPays.html(`
|
||||
<div class="d-flex flex-column align-items-center justify-content-center p-5 text-primary animate__animated animate__fadeIn">
|
||||
<div class="spinner-border mb-3" role="status" style="width: 3rem; height: 3rem;"></div>
|
||||
<h6 class="fw-bold text-uppercase small">${loadingMsg}</h6>
|
||||
</div>
|
||||
`);
|
||||
|
||||
// 3. Appel AJAX
|
||||
$.ajax({
|
||||
url: racineWeb + "Ajaxpaysterritoire/",
|
||||
type: 'post',
|
||||
data: { codeTerritoire: codeTerritoire }, // Utilisation d'un objet JSON
|
||||
success: function(data) {
|
||||
// Injection des données avec une transition fluide
|
||||
$divPays.hide().html(data).fadeIn(300);
|
||||
|
||||
// 4. Initialisation de la SmartTable ESI
|
||||
// On passe le titre pour les exports PDF/Excel
|
||||
const titreExport = (codeLangue === "en_US") ? "Countries by Territory" : "Liste des Pays par Territoire";
|
||||
|
||||
// On attend que le DOM soit prêt pour initialiser DataTables
|
||||
setTimeout(() => {
|
||||
initSmartTable('.datatable-inter', titreExport, [0, 'asc']);
|
||||
}, 100);
|
||||
},
|
||||
error: function() {
|
||||
$divPays.html(`
|
||||
<div class="alert alert-warning border-0 shadow-sm text-center p-4">
|
||||
<i class="fas fa-exclamation-triangle fa-2x mb-2 opacity-50"></i>
|
||||
<p class="mb-0 fw-bold">${(codeLangue === "en_US") ? "Error retrieving data." : "Erreur lors de la récupération des données."}</p>
|
||||
</div>
|
||||
`);
|
||||
}
|
||||
});
|
||||
}
|
||||
|
||||
|
||||
|
|
|
|||
|
|
@ -1,74 +1,113 @@
|
|||
<div id="div_garant">
|
||||
<div class="row">
|
||||
<div id="div_sans_territoire" class="col-5" >
|
||||
<legend> <?= _("Pays hors du territoire") ?> </legend>
|
||||
<table class="table table-striped table-bordered table-hover table-condensed table-responsive datatabplus compact" style="font-size:10pt;">
|
||||
<thead>
|
||||
<tr>
|
||||
<th style='text-align:center'> <?= _("Pays") ?> </th>
|
||||
<th width="20%" style='text-align:center'> => </th>
|
||||
</tr>
|
||||
|
||||
<tr>
|
||||
<th colspan="2"> <button type="button" style="font-size:10pt;" class="form-control btn btn-primary" onclick="javascript:ajouter_tous_pays_territoire();" > <?= _("Ajouter tous"). " ==>" ?> </button> </th>
|
||||
</tr>
|
||||
|
||||
</thead>
|
||||
<div id="div_garant" class="animate__animated animate__fadeIn">
|
||||
<div class="row g-4">
|
||||
<div id="div_sans_territoire" class="col-md-5">
|
||||
<div class="card border-0 shadow-sm">
|
||||
<div class="card-header bg-white py-3 border-bottom-0">
|
||||
<div class="d-flex align-items-center justify-content-between">
|
||||
<h6 class="mb-0 fw-bold text-uppercase text-danger small">
|
||||
<i class="fas fa-external-link-alt me-2"></i><?= _("Pays hors du territoire") ?>
|
||||
</h6>
|
||||
<button type="button" class="btn btn-primary btn-sm rounded-pill px-3 fw-bold shadow-sm" onclick="javascript:ajouter_tous_pays_territoire();">
|
||||
<?= _("Ajouter tous") ?> <i class="fas fa-angle-double-right ms-1"></i>
|
||||
</button>
|
||||
</div>
|
||||
</div>
|
||||
<div class="card-body p-0">
|
||||
<div class="table-responsive">
|
||||
<table class="table table-hover align-middle mb-0 datatable-inter compact" style="font-size: 9.5pt; width: 100%;">
|
||||
<thead class="table-light">
|
||||
<tr>
|
||||
<th class="ps-3"><?= _("Désignation Pays") ?></th>
|
||||
<th class="text-center" width="60px"><?= _("Action") ?></th>
|
||||
</tr>
|
||||
</thead>
|
||||
<tbody>
|
||||
<?php foreach ($pays_sans_territoire as $v):
|
||||
$codePays = $v['codePays'];
|
||||
$pays = est_anglophone() ? $v['paysEng'] : $v['pays'];
|
||||
?>
|
||||
<tr>
|
||||
<td class="ps-3 fw-medium text-dark"><?= $pays ?></td>
|
||||
<td class="text-center">
|
||||
<button type="button" class="btn btn-outline-primary btn-xs rounded-circle shadow-none"
|
||||
onClick="javascript:ajouter_un_pays_territoire('<?=$codePays?>');" title="<?= _("Ajouter") ?>">
|
||||
<i class="fas fa-arrow-right"></i>
|
||||
</button>
|
||||
</td>
|
||||
</tr>
|
||||
<?php endforeach; ?>
|
||||
</tbody>
|
||||
</table>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<tbody>
|
||||
<?php foreach ($pays_sans_territoire as $v):
|
||||
$codePays = $v['codePays'];
|
||||
$pays = $v['pays'];
|
||||
|
||||
if (est_anglophone()){
|
||||
$pays = $v['paysEng'];
|
||||
}
|
||||
?>
|
||||
<tr valign="top">
|
||||
<td align='center'><?= $pays ?></td>
|
||||
<td align='center'> <input type="button" value="=>" onClick="javascript:ajouter_un_pays_territoire('<?=$codePays?>');" ></td>
|
||||
</tr>
|
||||
<?php endforeach; ?>
|
||||
</tbody>
|
||||
</table>
|
||||
</div>
|
||||
<div id="div_avec_seuil" class="col-md-7">
|
||||
<div class="card border-0 shadow-sm border-start border-success border-4">
|
||||
<div class="card-header bg-white py-3 border-bottom-0">
|
||||
<div class="d-flex align-items-center justify-content-between">
|
||||
<h6 class="mb-0 fw-bold text-uppercase text-success small">
|
||||
<i class="fas fa-check-circle me-2"></i><?= _("Pays du territoire") ?>
|
||||
</h6>
|
||||
<button type="button" class="btn btn-danger btn-sm rounded-pill px-3 fw-bold shadow-sm" onclick="javascript:retirer_tous_pays_territoire();">
|
||||
<i class="fas fa-angle-double-left me-1"></i> <?= _("Retirer tous") ?>
|
||||
</button>
|
||||
</div>
|
||||
</div>
|
||||
<div class="card-body p-0">
|
||||
<div class="table-responsive">
|
||||
<table class="table table-hover align-middle mb-0 datatable-inter compact" style="font-size: 9.5pt; width: 100%;">
|
||||
<thead class="table-light">
|
||||
<tr>
|
||||
<th class="text-center" width="60px"><?= _("Action") ?></th>
|
||||
<th class="ps-3"><?= _("Désignation Pays") ?></th>
|
||||
</tr>
|
||||
</thead>
|
||||
<tbody>
|
||||
<?php foreach ($pays_avec_territoire as $v):
|
||||
$id = $v['id'];
|
||||
$pays = est_anglophone() ? $v['paysEng'] : $v['pays'];
|
||||
?>
|
||||
<tr>
|
||||
<td class="text-center">
|
||||
<button type="button" class="btn btn-outline-danger btn-xs rounded-circle shadow-none"
|
||||
onClick="javascript:retirer_un_pays_territoire('<?=$id?>');" title="<?= _("Retirer") ?>">
|
||||
<i class="fas fa-arrow-left"></i>
|
||||
</button>
|
||||
</td>
|
||||
<td class="ps-3 fw-bold text-primary"><?= $pays ?></td>
|
||||
</tr>
|
||||
<?php endforeach; ?>
|
||||
</tbody>
|
||||
</table>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<div id="div_avec_seuil" class="col-7" >
|
||||
<legend> <?= _("Pays du territoire") ?> </legend>
|
||||
<table class="table table-striped table-bordered table-hover table-condensed table-responsive datatabplus compact" style="font-size:10pt;">
|
||||
<thead>
|
||||
|
||||
<tr>
|
||||
<th width="10%" style='text-align:center'> <= </th>
|
||||
<th style='text-align:center'> <?= _("Pays") ?> </th>
|
||||
</tr>
|
||||
|
||||
|
||||
|
||||
<tr>
|
||||
<td colspan="2"> <button type="button" style="font-size:10pt;" class="form-control btn btn-danger" onclick="javascript:retirer_tous_pays_territoire();" > <?= "<== " . _("Retirer tous") ?> </button> </td>
|
||||
</tr>
|
||||
|
||||
</thead>
|
||||
<style>
|
||||
/* Style pour les boutons circulaires de transfert */
|
||||
.btn-xs {
|
||||
width: 28px;
|
||||
height: 28px;
|
||||
padding: 0;
|
||||
display: inline-flex;
|
||||
align-items: center;
|
||||
justify-content: center;
|
||||
font-size: 0.75rem;
|
||||
}
|
||||
|
||||
/* Hover effect sur les cartes de pays */
|
||||
.card:hover {
|
||||
transform: translateY(-2px);
|
||||
transition: transform 0.2s ease-in-out;
|
||||
}
|
||||
|
||||
<tbody>
|
||||
<?php foreach ($pays_avec_territoire as $v):
|
||||
$id = $v['id'];
|
||||
|
||||
$pays = $v['pays'];
|
||||
|
||||
if (est_anglophone()){
|
||||
$pays = $v['paysEng'];
|
||||
}
|
||||
?>
|
||||
<tr valign="top">
|
||||
<td align='center'> <input type="button" value="<=" onClick="javascript:retirer_un_pays_territoire('<?=$id?>');" ></td>
|
||||
|
||||
<td align='center'><?= $pays ?></td>
|
||||
</tr>
|
||||
<?php endforeach; ?>
|
||||
</tbody>
|
||||
</table>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
/* Ajustement DataTables pour ces tableaux compacts */
|
||||
.compact.dataTable tbody td {
|
||||
padding: 8px 4px !important;
|
||||
}
|
||||
</style>
|
||||
Loading…
Reference in New Issue
Block a user