2026-08-20 17:28:26 +00:00
|
|
|
|
<!doctype html>
|
|
|
|
|
|
<html lang="fr">
|
|
|
|
|
|
<head>
|
|
|
|
|
|
<meta charset="UTF-8" />
|
|
|
|
|
|
|
|
|
|
|
|
<meta name="viewport" content="width=device-width, initial-scale=1.0" />
|
|
|
|
|
|
|
|
|
|
|
|
<title>Indices & Actions - Giraud Finance</title>
|
|
|
|
|
|
|
|
|
|
|
|
<link
|
|
|
|
|
|
rel="icon"
|
|
|
|
|
|
type="image/png"
|
|
|
|
|
|
sizes="32x32"
|
|
|
|
|
|
href="../images/dollars.ico"
|
|
|
|
|
|
/>
|
|
|
|
|
|
|
|
|
|
|
|
<!-- Tailwind CSS -->
|
|
|
|
|
|
<script src="https://cdn.tailwindcss.com"></script>
|
|
|
|
|
|
|
|
|
|
|
|
<!-- CSS général -->
|
|
|
|
|
|
<link rel="stylesheet" href="../css/style.css" />
|
|
|
|
|
|
</head>
|
|
|
|
|
|
|
|
|
|
|
|
<body class="bg-slate-900 text-slate-100 min-h-screen flex flex-col">
|
|
|
|
|
|
<!-- =====================================================
|
|
|
|
|
|
HEADER
|
|
|
|
|
|
===================================================== -->
|
|
|
|
|
|
|
|
|
|
|
|
<header
|
|
|
|
|
|
class="max-w-7xl w-full mx-auto px-6 py-6 mt-4 bg-slate-800 border border-slate-700 rounded-2xl shadow-xl"
|
|
|
|
|
|
>
|
|
|
|
|
|
<div class="flex flex-col md:flex-row justify-between items-center gap-5">
|
|
|
|
|
|
<!-- Logo -->
|
|
|
|
|
|
|
|
|
|
|
|
<div class="flex items-center">
|
|
|
|
|
|
<img
|
|
|
|
|
|
src="../images/GFBlanc.png"
|
|
|
|
|
|
alt="Logo Giraud Finance"
|
|
|
|
|
|
class="h-12 w-auto object-contain"
|
|
|
|
|
|
/>
|
|
|
|
|
|
</div>
|
|
|
|
|
|
|
|
|
|
|
|
<!-- Titre -->
|
|
|
|
|
|
|
|
|
|
|
|
<div class="text-center">
|
|
|
|
|
|
<h1 class="text-xl font-bold text-white tracking-tight">
|
|
|
|
|
|
Gestion des Indices & Actions
|
|
|
|
|
|
</h1>
|
|
|
|
|
|
|
|
|
|
|
|
<p class="text-xs text-slate-400 mt-1">
|
|
|
|
|
|
Panneau de contrôle Giraud Finance
|
|
|
|
|
|
</p>
|
|
|
|
|
|
</div>
|
|
|
|
|
|
|
|
|
|
|
|
<!-- Retour -->
|
|
|
|
|
|
|
|
|
|
|
|
<div>
|
|
|
|
|
|
<a
|
|
|
|
|
|
href="./admin.html"
|
|
|
|
|
|
class="bg-slate-700 hover:bg-slate-600 text-white text-xs font-semibold px-4 py-2 rounded-xl transition-all border border-slate-600 flex items-center space-x-2"
|
|
|
|
|
|
>
|
|
|
|
|
|
<span>← Retour au menu</span>
|
|
|
|
|
|
</a>
|
|
|
|
|
|
</div>
|
|
|
|
|
|
</div>
|
|
|
|
|
|
</header>
|
|
|
|
|
|
|
|
|
|
|
|
<!-- =====================================================
|
|
|
|
|
|
CONTENU PRINCIPAL
|
|
|
|
|
|
===================================================== -->
|
|
|
|
|
|
|
|
|
|
|
|
<main class="flex-grow p-6">
|
|
|
|
|
|
<div
|
|
|
|
|
|
class="max-w-7xl mx-auto bg-slate-800 border border-slate-700 rounded-2xl shadow-2xl overflow-hidden"
|
|
|
|
|
|
>
|
|
|
|
|
|
<!-- =================================================
|
|
|
|
|
|
ENTÊTE TABLEAU
|
|
|
|
|
|
================================================= -->
|
|
|
|
|
|
|
|
|
|
|
|
<div
|
|
|
|
|
|
class="px-6 py-5 border-b border-slate-700 flex flex-col md:flex-row justify-between items-start md:items-center gap-4"
|
|
|
|
|
|
>
|
|
|
|
|
|
<!-- Titre + compteur -->
|
|
|
|
|
|
|
|
|
|
|
|
<div>
|
|
|
|
|
|
<h2 class="text-lg font-bold text-white">Indices & Actions</h2>
|
|
|
|
|
|
|
|
|
|
|
|
<p id="compteur" class="text-xs text-slate-400 mt-1">
|
|
|
|
|
|
Chargement...
|
|
|
|
|
|
</p>
|
|
|
|
|
|
</div>
|
|
|
|
|
|
|
|
|
|
|
|
<!-- ===============================================
|
|
|
|
|
|
FILTRE + NOUVEAU + ACTUALISER
|
|
|
|
|
|
=============================================== -->
|
|
|
|
|
|
|
|
|
|
|
|
<div class="flex flex-wrap items-center gap-3">
|
|
|
|
|
|
<!-- Filtre -->
|
|
|
|
|
|
|
|
|
|
|
|
<select
|
|
|
|
|
|
id="filtreIndice"
|
|
|
|
|
|
class="bg-slate-900 border border-slate-700 text-white text-xs rounded-xl px-4 py-2 focus:outline-none focus:border-emerald-500 focus:ring-1 focus:ring-emerald-500"
|
|
|
|
|
|
>
|
|
|
|
|
|
<option value="tout">Tout</option>
|
|
|
|
|
|
<option value="afficher">Afficher</option>
|
|
|
|
|
|
<option value="inactif">Inactif</option>
|
|
|
|
|
|
</select>
|
|
|
|
|
|
|
|
|
|
|
|
<!-- Nouveau -->
|
|
|
|
|
|
|
|
|
|
|
|
<button
|
|
|
|
|
|
id="btnNouveau"
|
|
|
|
|
|
type="button"
|
|
|
|
|
|
class="bg-emerald-600 hover:bg-emerald-500 text-white text-xs font-semibold px-4 py-2 rounded-xl transition-all border border-emerald-500 whitespace-nowrap"
|
|
|
|
|
|
>
|
|
|
|
|
|
+ Nouveau
|
|
|
|
|
|
</button>
|
|
|
|
|
|
|
|
|
|
|
|
<!-- Actualiser -->
|
|
|
|
|
|
|
|
|
|
|
|
<button
|
|
|
|
|
|
id="btnActualiser"
|
|
|
|
|
|
type="button"
|
|
|
|
|
|
class="bg-emerald-600 hover:bg-emerald-500 text-white text-xs font-semibold px-4 py-2 rounded-xl transition-all border border-emerald-500 whitespace-nowrap"
|
|
|
|
|
|
>
|
|
|
|
|
|
↻ Actualiser
|
|
|
|
|
|
</button>
|
|
|
|
|
|
</div>
|
|
|
|
|
|
</div>
|
|
|
|
|
|
|
|
|
|
|
|
<!-- =================================================
|
|
|
|
|
|
MESSAGE
|
|
|
|
|
|
================================================= -->
|
|
|
|
|
|
|
|
|
|
|
|
<div
|
|
|
|
|
|
id="message"
|
|
|
|
|
|
class="hidden mx-6 mt-5 px-4 py-3 rounded-xl text-sm font-medium"
|
|
|
|
|
|
></div>
|
|
|
|
|
|
|
|
|
|
|
|
<!-- =================================================
|
|
|
|
|
|
TABLEAU
|
|
|
|
|
|
================================================= -->
|
|
|
|
|
|
|
|
|
|
|
|
<div class="overflow-x-auto">
|
2026-08-20 18:04:52 +00:00
|
|
|
|
<table class="w-full min-w-[1000px] table-auto">
|
2026-08-20 17:28:26 +00:00
|
|
|
|
<!-- =================================================
|
|
|
|
|
|
EN-TÊTE
|
|
|
|
|
|
================================================= -->
|
|
|
|
|
|
|
|
|
|
|
|
<thead class="bg-slate-950">
|
|
|
|
|
|
<tr>
|
2026-08-20 18:04:52 +00:00
|
|
|
|
<!-- ID -->
|
|
|
|
|
|
|
2026-08-20 17:28:26 +00:00
|
|
|
|
<th
|
2026-08-20 18:04:52 +00:00
|
|
|
|
class="px-2 py-3 text-left text-[11px] font-semibold uppercase tracking-wider text-slate-400 whitespace-nowrap w-[55px]"
|
2026-08-20 17:28:26 +00:00
|
|
|
|
>
|
|
|
|
|
|
ID
|
|
|
|
|
|
</th>
|
|
|
|
|
|
|
2026-08-20 18:04:52 +00:00
|
|
|
|
<!-- Indice -->
|
|
|
|
|
|
|
2026-08-20 17:28:26 +00:00
|
|
|
|
<th
|
2026-08-20 18:04:52 +00:00
|
|
|
|
class="px-2 py-3 text-left text-[11px] font-semibold uppercase tracking-wider text-slate-400 whitespace-nowrap w-[100px]"
|
2026-08-20 17:28:26 +00:00
|
|
|
|
>
|
|
|
|
|
|
Indice
|
|
|
|
|
|
</th>
|
|
|
|
|
|
|
2026-08-20 18:04:52 +00:00
|
|
|
|
<!-- Nom -->
|
|
|
|
|
|
|
2026-08-20 17:28:26 +00:00
|
|
|
|
<th
|
2026-08-20 18:04:52 +00:00
|
|
|
|
class="px-2 py-3 text-left text-[11px] font-semibold uppercase tracking-wider text-slate-400 whitespace-nowrap"
|
2026-08-20 17:28:26 +00:00
|
|
|
|
>
|
|
|
|
|
|
Nom
|
|
|
|
|
|
</th>
|
|
|
|
|
|
|
2026-08-20 18:04:52 +00:00
|
|
|
|
<!-- ISIN -->
|
|
|
|
|
|
|
2026-08-20 17:28:26 +00:00
|
|
|
|
<th
|
2026-08-20 18:04:52 +00:00
|
|
|
|
class="px-2 py-3 text-left text-[11px] font-semibold uppercase tracking-wider text-slate-400 whitespace-nowrap w-[130px]"
|
2026-08-20 17:28:26 +00:00
|
|
|
|
>
|
|
|
|
|
|
ISIN
|
|
|
|
|
|
</th>
|
|
|
|
|
|
|
2026-08-20 18:04:52 +00:00
|
|
|
|
<!-- Symbole -->
|
|
|
|
|
|
|
2026-08-20 17:28:26 +00:00
|
|
|
|
<th
|
2026-08-20 18:04:52 +00:00
|
|
|
|
class="px-2 py-3 text-left text-[11px] font-semibold uppercase tracking-wider text-slate-400 whitespace-nowrap w-[80px]"
|
2026-08-20 17:28:26 +00:00
|
|
|
|
>
|
|
|
|
|
|
Symbole
|
|
|
|
|
|
</th>
|
|
|
|
|
|
|
2026-08-20 18:04:52 +00:00
|
|
|
|
<!-- Actif -->
|
|
|
|
|
|
|
2026-08-20 17:28:26 +00:00
|
|
|
|
<th
|
2026-08-20 18:04:52 +00:00
|
|
|
|
class="px-2 py-3 text-center text-[11px] font-semibold uppercase tracking-wider text-slate-400 whitespace-nowrap w-[65px]"
|
2026-08-20 17:28:26 +00:00
|
|
|
|
>
|
|
|
|
|
|
Actif
|
|
|
|
|
|
</th>
|
|
|
|
|
|
|
2026-08-20 18:04:52 +00:00
|
|
|
|
<!-- Afficher -->
|
|
|
|
|
|
|
2026-08-20 17:28:26 +00:00
|
|
|
|
<th
|
2026-08-20 18:04:52 +00:00
|
|
|
|
class="px-2 py-3 text-center text-[11px] font-semibold uppercase tracking-wider text-slate-400 whitespace-nowrap w-[75px]"
|
2026-08-20 17:28:26 +00:00
|
|
|
|
>
|
|
|
|
|
|
Afficher
|
|
|
|
|
|
</th>
|
|
|
|
|
|
|
2026-08-20 18:04:52 +00:00
|
|
|
|
<!-- Mis à jour -->
|
|
|
|
|
|
|
2026-08-20 17:28:26 +00:00
|
|
|
|
<th
|
2026-08-20 18:04:52 +00:00
|
|
|
|
class="px-2 py-3 text-left text-[11px] font-semibold uppercase tracking-wider text-slate-400 whitespace-nowrap w-[135px]"
|
2026-08-20 17:28:26 +00:00
|
|
|
|
>
|
|
|
|
|
|
Mis à jour
|
|
|
|
|
|
</th>
|
|
|
|
|
|
|
2026-08-20 18:04:52 +00:00
|
|
|
|
<!-- Créé le -->
|
|
|
|
|
|
|
2026-08-20 17:28:26 +00:00
|
|
|
|
<th
|
2026-08-20 18:04:52 +00:00
|
|
|
|
class="px-2 py-3 text-left text-[11px] font-semibold uppercase tracking-wider text-slate-400 whitespace-nowrap w-[135px]"
|
2026-08-20 17:28:26 +00:00
|
|
|
|
>
|
|
|
|
|
|
Créé le
|
|
|
|
|
|
</th>
|
2026-08-20 18:04:52 +00:00
|
|
|
|
|
|
|
|
|
|
<!-- Action -->
|
|
|
|
|
|
|
|
|
|
|
|
<th
|
|
|
|
|
|
class="px-2 py-3 text-center text-[11px] font-semibold uppercase tracking-wider text-slate-400 whitespace-nowrap w-[95px]"
|
|
|
|
|
|
>
|
|
|
|
|
|
Action
|
|
|
|
|
|
</th>
|
2026-08-20 17:28:26 +00:00
|
|
|
|
</tr>
|
|
|
|
|
|
</thead>
|
|
|
|
|
|
|
|
|
|
|
|
<!-- =================================================
|
|
|
|
|
|
CORPS
|
|
|
|
|
|
================================================= -->
|
|
|
|
|
|
|
|
|
|
|
|
<tbody
|
|
|
|
|
|
id="tableauIndices"
|
|
|
|
|
|
class="divide-y divide-slate-700"
|
|
|
|
|
|
></tbody>
|
|
|
|
|
|
</table>
|
|
|
|
|
|
</div>
|
|
|
|
|
|
</div>
|
|
|
|
|
|
</main>
|
|
|
|
|
|
|
|
|
|
|
|
<!-- =====================================================
|
|
|
|
|
|
POPUP NOUVEL ENREGISTREMENT
|
|
|
|
|
|
===================================================== -->
|
|
|
|
|
|
|
|
|
|
|
|
<div
|
|
|
|
|
|
id="modalNouvelEnregistrement"
|
|
|
|
|
|
class="fixed inset-0 z-50 hidden items-center justify-center bg-black/70 backdrop-blur-sm p-4"
|
|
|
|
|
|
>
|
|
|
|
|
|
<div
|
|
|
|
|
|
class="w-full max-w-2xl bg-slate-800 border border-slate-700 rounded-2xl shadow-2xl"
|
|
|
|
|
|
>
|
|
|
|
|
|
<!-- =================================================
|
|
|
|
|
|
EN-TÊTE POPUP
|
|
|
|
|
|
================================================= -->
|
|
|
|
|
|
|
|
|
|
|
|
<div
|
|
|
|
|
|
class="px-6 py-5 border-b border-slate-700 flex justify-between items-center"
|
|
|
|
|
|
>
|
|
|
|
|
|
<div>
|
2026-08-20 18:04:52 +00:00
|
|
|
|
<h2 class="text-lg font-bold text-white" id="titreModal">
|
|
|
|
|
|
Nouvel enregistrement
|
|
|
|
|
|
</h2>
|
2026-08-20 17:28:26 +00:00
|
|
|
|
|
2026-08-20 18:04:52 +00:00
|
|
|
|
<p class="text-xs text-slate-400 mt-1" id="sousTitreModal">
|
2026-08-20 17:28:26 +00:00
|
|
|
|
Ajouter une nouvelle action ou un indice
|
|
|
|
|
|
</p>
|
|
|
|
|
|
</div>
|
|
|
|
|
|
|
|
|
|
|
|
<!-- Fermer -->
|
|
|
|
|
|
|
|
|
|
|
|
<button
|
|
|
|
|
|
id="btnFermerModal"
|
|
|
|
|
|
type="button"
|
|
|
|
|
|
class="text-slate-400 hover:text-white text-2xl leading-none"
|
|
|
|
|
|
>
|
|
|
|
|
|
×
|
|
|
|
|
|
</button>
|
|
|
|
|
|
</div>
|
|
|
|
|
|
|
|
|
|
|
|
<!-- =================================================
|
|
|
|
|
|
FORMULAIRE
|
|
|
|
|
|
================================================= -->
|
|
|
|
|
|
|
|
|
|
|
|
<form id="formNouvelEnregistrement" class="p-6 space-y-5">
|
|
|
|
|
|
<!-- =================================================
|
|
|
|
|
|
INDICE
|
|
|
|
|
|
================================================= -->
|
|
|
|
|
|
|
|
|
|
|
|
<div>
|
|
|
|
|
|
<label
|
|
|
|
|
|
for="nouvelIndice"
|
|
|
|
|
|
class="block text-xs font-semibold text-slate-300 uppercase mb-2"
|
|
|
|
|
|
>
|
|
|
|
|
|
Indice
|
|
|
|
|
|
</label>
|
|
|
|
|
|
|
|
|
|
|
|
<input
|
|
|
|
|
|
type="text"
|
|
|
|
|
|
id="nouvelIndice"
|
|
|
|
|
|
required
|
|
|
|
|
|
autocomplete="off"
|
|
|
|
|
|
class="w-full bg-slate-900 border border-slate-700 rounded-xl px-4 py-3 text-sm text-white placeholder-slate-500 focus:outline-none focus:border-emerald-500 focus:ring-1 focus:ring-emerald-500"
|
|
|
|
|
|
placeholder="Exemple : CAC40"
|
|
|
|
|
|
/>
|
|
|
|
|
|
</div>
|
|
|
|
|
|
|
|
|
|
|
|
<!-- =================================================
|
|
|
|
|
|
NOM
|
|
|
|
|
|
================================================= -->
|
|
|
|
|
|
|
|
|
|
|
|
<div>
|
|
|
|
|
|
<label
|
|
|
|
|
|
for="nouveauNom"
|
|
|
|
|
|
class="block text-xs font-semibold text-slate-300 uppercase mb-2"
|
|
|
|
|
|
>
|
|
|
|
|
|
Nom
|
|
|
|
|
|
</label>
|
|
|
|
|
|
|
|
|
|
|
|
<input
|
|
|
|
|
|
type="text"
|
|
|
|
|
|
id="nouveauNom"
|
|
|
|
|
|
required
|
|
|
|
|
|
autocomplete="off"
|
|
|
|
|
|
class="w-full bg-slate-900 border border-slate-700 rounded-xl px-4 py-3 text-sm text-white placeholder-slate-500 focus:outline-none focus:border-emerald-500 focus:ring-1 focus:ring-emerald-500"
|
|
|
|
|
|
placeholder="Nom de l'action"
|
|
|
|
|
|
/>
|
|
|
|
|
|
</div>
|
|
|
|
|
|
|
|
|
|
|
|
<!-- =================================================
|
|
|
|
|
|
ISIN + SYMBOLE
|
|
|
|
|
|
================================================= -->
|
|
|
|
|
|
|
|
|
|
|
|
<div class="grid grid-cols-1 md:grid-cols-2 gap-4">
|
|
|
|
|
|
<!-- ISIN -->
|
|
|
|
|
|
|
|
|
|
|
|
<div>
|
|
|
|
|
|
<label
|
|
|
|
|
|
for="nouvelIsin"
|
|
|
|
|
|
class="block text-xs font-semibold text-slate-300 uppercase mb-2"
|
|
|
|
|
|
>
|
|
|
|
|
|
ISIN
|
|
|
|
|
|
</label>
|
|
|
|
|
|
|
|
|
|
|
|
<input
|
|
|
|
|
|
type="text"
|
|
|
|
|
|
id="nouvelIsin"
|
|
|
|
|
|
required
|
|
|
|
|
|
maxlength="12"
|
|
|
|
|
|
autocomplete="off"
|
|
|
|
|
|
class="w-full bg-slate-900 border border-slate-700 rounded-xl px-4 py-3 text-sm text-white font-mono uppercase placeholder-slate-500 focus:outline-none focus:border-emerald-500 focus:ring-1 focus:ring-emerald-500"
|
|
|
|
|
|
placeholder="FR0000120404"
|
|
|
|
|
|
/>
|
|
|
|
|
|
</div>
|
|
|
|
|
|
|
|
|
|
|
|
<!-- Symbole -->
|
|
|
|
|
|
|
|
|
|
|
|
<div>
|
|
|
|
|
|
<label
|
|
|
|
|
|
for="nouveauSymbole"
|
|
|
|
|
|
class="block text-xs font-semibold text-slate-300 uppercase mb-2"
|
|
|
|
|
|
>
|
|
|
|
|
|
Symbole
|
|
|
|
|
|
</label>
|
|
|
|
|
|
|
|
|
|
|
|
<input
|
|
|
|
|
|
type="text"
|
|
|
|
|
|
id="nouveauSymbole"
|
|
|
|
|
|
required
|
|
|
|
|
|
autocomplete="off"
|
2026-08-20 18:04:52 +00:00
|
|
|
|
class="w-full bg-slate-900 border border-slate-700 rounded-xl px-4 py-3 text-sm text-white uppercase placeholder-slate-500"
|
2026-08-20 17:28:26 +00:00
|
|
|
|
placeholder="AC"
|
|
|
|
|
|
/>
|
|
|
|
|
|
</div>
|
|
|
|
|
|
</div>
|
|
|
|
|
|
|
|
|
|
|
|
<!-- =================================================
|
|
|
|
|
|
ACTIF + AFFICHER
|
|
|
|
|
|
================================================= -->
|
|
|
|
|
|
|
|
|
|
|
|
<div class="grid grid-cols-1 md:grid-cols-2 gap-4">
|
|
|
|
|
|
<!-- Actif -->
|
|
|
|
|
|
|
|
|
|
|
|
<label
|
|
|
|
|
|
class="flex items-center justify-between bg-slate-900 border border-slate-700 rounded-xl px-4 py-3 cursor-pointer"
|
|
|
|
|
|
>
|
|
|
|
|
|
<div>
|
|
|
|
|
|
<div class="text-sm font-semibold text-white">Actif</div>
|
|
|
|
|
|
|
|
|
|
|
|
<div class="text-xs text-slate-500">Action active</div>
|
|
|
|
|
|
</div>
|
|
|
|
|
|
|
|
|
|
|
|
<input
|
|
|
|
|
|
type="checkbox"
|
|
|
|
|
|
id="nouvelActif"
|
|
|
|
|
|
checked
|
|
|
|
|
|
class="w-5 h-5 accent-emerald-500"
|
|
|
|
|
|
/>
|
|
|
|
|
|
</label>
|
|
|
|
|
|
|
|
|
|
|
|
<!-- Afficher -->
|
|
|
|
|
|
|
|
|
|
|
|
<label
|
|
|
|
|
|
class="flex items-center justify-between bg-slate-900 border border-slate-700 rounded-xl px-4 py-3 cursor-pointer"
|
|
|
|
|
|
>
|
|
|
|
|
|
<div>
|
|
|
|
|
|
<div class="text-sm font-semibold text-white">Afficher</div>
|
|
|
|
|
|
|
|
|
|
|
|
<div class="text-xs text-slate-500">Afficher sur le site</div>
|
|
|
|
|
|
</div>
|
|
|
|
|
|
|
|
|
|
|
|
<input
|
|
|
|
|
|
type="checkbox"
|
|
|
|
|
|
id="nouvelAfficher"
|
|
|
|
|
|
checked
|
|
|
|
|
|
class="w-5 h-5 accent-emerald-500"
|
|
|
|
|
|
/>
|
|
|
|
|
|
</label>
|
|
|
|
|
|
</div>
|
|
|
|
|
|
|
|
|
|
|
|
<!-- =================================================
|
|
|
|
|
|
MESSAGE FORMULAIRE
|
|
|
|
|
|
================================================= -->
|
|
|
|
|
|
|
|
|
|
|
|
<div
|
|
|
|
|
|
id="messageNouveau"
|
|
|
|
|
|
class="hidden px-4 py-3 rounded-xl text-sm"
|
|
|
|
|
|
></div>
|
|
|
|
|
|
|
|
|
|
|
|
<!-- =================================================
|
|
|
|
|
|
BOUTONS
|
|
|
|
|
|
================================================= -->
|
|
|
|
|
|
|
|
|
|
|
|
<div class="flex justify-end gap-3 pt-4 border-t border-slate-700">
|
|
|
|
|
|
<!-- Annuler -->
|
|
|
|
|
|
|
|
|
|
|
|
<button
|
|
|
|
|
|
id="btnAnnuler"
|
|
|
|
|
|
type="button"
|
|
|
|
|
|
class="bg-slate-700 hover:bg-slate-600 text-white text-xs font-semibold px-5 py-3 rounded-xl transition-all border border-slate-600"
|
|
|
|
|
|
>
|
|
|
|
|
|
Annuler
|
|
|
|
|
|
</button>
|
|
|
|
|
|
|
|
|
|
|
|
<!-- Sauvegarder -->
|
|
|
|
|
|
|
|
|
|
|
|
<button
|
|
|
|
|
|
id="btnSauvegarder"
|
|
|
|
|
|
type="submit"
|
|
|
|
|
|
class="bg-emerald-600 hover:bg-emerald-500 text-white text-xs font-semibold px-5 py-3 rounded-xl transition-all border border-emerald-500"
|
|
|
|
|
|
>
|
|
|
|
|
|
Sauvegarder
|
|
|
|
|
|
</button>
|
|
|
|
|
|
</div>
|
|
|
|
|
|
</form>
|
|
|
|
|
|
</div>
|
|
|
|
|
|
</div>
|
|
|
|
|
|
|
2026-08-20 18:04:52 +00:00
|
|
|
|
<!-- =====================================================
|
|
|
|
|
|
POPUP MODIFICATION
|
|
|
|
|
|
===================================================== -->
|
|
|
|
|
|
|
|
|
|
|
|
<div
|
|
|
|
|
|
id="modalModifierEnregistrement"
|
|
|
|
|
|
class="fixed inset-0 z-50 hidden items-center justify-center bg-black/70 backdrop-blur-sm p-4"
|
|
|
|
|
|
>
|
|
|
|
|
|
<div
|
|
|
|
|
|
class="w-full max-w-2xl bg-slate-800 border border-slate-700 rounded-2xl shadow-2xl"
|
|
|
|
|
|
>
|
|
|
|
|
|
<!-- =================================================
|
|
|
|
|
|
EN-TÊTE POPUP
|
|
|
|
|
|
================================================= -->
|
|
|
|
|
|
|
|
|
|
|
|
<div
|
|
|
|
|
|
class="px-6 py-5 border-b border-slate-700 flex justify-between items-center"
|
|
|
|
|
|
>
|
|
|
|
|
|
<div>
|
|
|
|
|
|
<h2 class="text-lg font-bold text-white">
|
|
|
|
|
|
Modifier l'enregistrement
|
|
|
|
|
|
</h2>
|
|
|
|
|
|
|
|
|
|
|
|
<p class="text-xs text-slate-400 mt-1">
|
|
|
|
|
|
Modifier les informations de l'action
|
|
|
|
|
|
</p>
|
|
|
|
|
|
</div>
|
|
|
|
|
|
|
|
|
|
|
|
<!-- Fermer -->
|
|
|
|
|
|
|
|
|
|
|
|
<button
|
|
|
|
|
|
id="btnFermerModalModifier"
|
|
|
|
|
|
type="button"
|
|
|
|
|
|
class="text-slate-400 hover:text-white text-2xl leading-none"
|
|
|
|
|
|
>
|
|
|
|
|
|
×
|
|
|
|
|
|
</button>
|
|
|
|
|
|
</div>
|
|
|
|
|
|
|
|
|
|
|
|
<!-- =================================================
|
|
|
|
|
|
FORMULAIRE
|
|
|
|
|
|
================================================= -->
|
|
|
|
|
|
|
|
|
|
|
|
<form id="formModifierEnregistrement" class="p-6 space-y-5">
|
|
|
|
|
|
<!-- ID caché -->
|
|
|
|
|
|
|
|
|
|
|
|
<input type="hidden" id="modifierId" />
|
|
|
|
|
|
|
|
|
|
|
|
<!-- =================================================
|
|
|
|
|
|
INDICE
|
|
|
|
|
|
================================================= -->
|
|
|
|
|
|
|
|
|
|
|
|
<div>
|
|
|
|
|
|
<label
|
|
|
|
|
|
for="modifierIndice"
|
|
|
|
|
|
class="block text-xs font-semibold text-slate-300 uppercase mb-2"
|
|
|
|
|
|
>
|
|
|
|
|
|
Indice
|
|
|
|
|
|
</label>
|
|
|
|
|
|
|
|
|
|
|
|
<input
|
|
|
|
|
|
type="text"
|
|
|
|
|
|
id="modifierIndice"
|
|
|
|
|
|
required
|
|
|
|
|
|
autocomplete="off"
|
|
|
|
|
|
class="w-full bg-slate-900 border border-slate-700 rounded-xl px-4 py-3 text-sm text-white placeholder-slate-500 focus:outline-none focus:border-blue-500 focus:ring-1 focus:ring-blue-500"
|
|
|
|
|
|
placeholder="Exemple : CAC40"
|
|
|
|
|
|
/>
|
|
|
|
|
|
</div>
|
|
|
|
|
|
|
|
|
|
|
|
<!-- =================================================
|
|
|
|
|
|
NOM
|
|
|
|
|
|
================================================= -->
|
|
|
|
|
|
|
|
|
|
|
|
<div>
|
|
|
|
|
|
<label
|
|
|
|
|
|
for="modifierNom"
|
|
|
|
|
|
class="block text-xs font-semibold text-slate-300 uppercase mb-2"
|
|
|
|
|
|
>
|
|
|
|
|
|
Nom
|
|
|
|
|
|
</label>
|
|
|
|
|
|
|
|
|
|
|
|
<input
|
|
|
|
|
|
type="text"
|
|
|
|
|
|
id="modifierNom"
|
|
|
|
|
|
required
|
|
|
|
|
|
autocomplete="off"
|
|
|
|
|
|
class="w-full bg-slate-900 border border-slate-700 rounded-xl px-4 py-3 text-sm text-white placeholder-slate-500 focus:outline-none focus:border-blue-500 focus:ring-1 focus:ring-blue-500"
|
|
|
|
|
|
placeholder="Nom de l'action"
|
|
|
|
|
|
/>
|
|
|
|
|
|
</div>
|
|
|
|
|
|
|
|
|
|
|
|
<!-- =================================================
|
|
|
|
|
|
ISIN + SYMBOLE
|
|
|
|
|
|
================================================= -->
|
|
|
|
|
|
|
|
|
|
|
|
<div class="grid grid-cols-1 md:grid-cols-2 gap-4">
|
|
|
|
|
|
<!-- ISIN -->
|
|
|
|
|
|
|
|
|
|
|
|
<div>
|
|
|
|
|
|
<label
|
|
|
|
|
|
for="modifierIsin"
|
|
|
|
|
|
class="block text-xs font-semibold text-slate-300 uppercase mb-2"
|
|
|
|
|
|
>
|
|
|
|
|
|
ISIN
|
|
|
|
|
|
</label>
|
|
|
|
|
|
|
|
|
|
|
|
<input
|
|
|
|
|
|
type="text"
|
|
|
|
|
|
id="modifierIsin"
|
|
|
|
|
|
required
|
|
|
|
|
|
maxlength="12"
|
|
|
|
|
|
autocomplete="off"
|
|
|
|
|
|
class="w-full bg-slate-900 border border-slate-700 rounded-xl px-4 py-3 text-sm text-white font-mono uppercase placeholder-slate-500 focus:outline-none focus:border-blue-500 focus:ring-1 focus:ring-blue-500"
|
|
|
|
|
|
placeholder="FR0000120404"
|
|
|
|
|
|
/>
|
|
|
|
|
|
</div>
|
|
|
|
|
|
|
|
|
|
|
|
<!-- Symbole -->
|
|
|
|
|
|
|
|
|
|
|
|
<div>
|
|
|
|
|
|
<label
|
|
|
|
|
|
for="modifierSymbole"
|
|
|
|
|
|
class="block text-xs font-semibold text-slate-300 uppercase mb-2"
|
|
|
|
|
|
>
|
|
|
|
|
|
Symbole
|
|
|
|
|
|
</label>
|
|
|
|
|
|
|
|
|
|
|
|
<input
|
|
|
|
|
|
type="text"
|
|
|
|
|
|
id="modifierSymbole"
|
|
|
|
|
|
required
|
|
|
|
|
|
autocomplete="off"
|
|
|
|
|
|
class="w-full bg-slate-900 border border-slate-700 rounded-xl px-4 py-3 text-sm text-white uppercase placeholder-slate-500 focus:outline-none focus:border-blue-500 focus:ring-1 focus:ring-blue-500"
|
|
|
|
|
|
placeholder="AC"
|
|
|
|
|
|
/>
|
|
|
|
|
|
</div>
|
|
|
|
|
|
</div>
|
|
|
|
|
|
|
|
|
|
|
|
<!-- =================================================
|
|
|
|
|
|
ACTIF + AFFICHER
|
|
|
|
|
|
================================================= -->
|
|
|
|
|
|
|
|
|
|
|
|
<div class="grid grid-cols-1 md:grid-cols-2 gap-4">
|
|
|
|
|
|
<!-- Actif -->
|
|
|
|
|
|
|
|
|
|
|
|
<label
|
|
|
|
|
|
class="flex items-center justify-between bg-slate-900 border border-slate-700 rounded-xl px-4 py-3 cursor-pointer"
|
|
|
|
|
|
>
|
|
|
|
|
|
<div>
|
|
|
|
|
|
<div class="text-sm font-semibold text-white">Actif</div>
|
|
|
|
|
|
|
|
|
|
|
|
<div class="text-xs text-slate-500">Action active</div>
|
|
|
|
|
|
</div>
|
|
|
|
|
|
|
|
|
|
|
|
<input
|
|
|
|
|
|
type="checkbox"
|
|
|
|
|
|
id="modifierActif"
|
|
|
|
|
|
class="w-5 h-5 accent-blue-500"
|
|
|
|
|
|
/>
|
|
|
|
|
|
</label>
|
|
|
|
|
|
|
|
|
|
|
|
<!-- Afficher -->
|
|
|
|
|
|
|
|
|
|
|
|
<label
|
|
|
|
|
|
class="flex items-center justify-between bg-slate-900 border border-slate-700 rounded-xl px-4 py-3 cursor-pointer"
|
|
|
|
|
|
>
|
|
|
|
|
|
<div>
|
|
|
|
|
|
<div class="text-sm font-semibold text-white">Afficher</div>
|
|
|
|
|
|
|
|
|
|
|
|
<div class="text-xs text-slate-500">Afficher sur le site</div>
|
|
|
|
|
|
</div>
|
|
|
|
|
|
|
|
|
|
|
|
<input
|
|
|
|
|
|
type="checkbox"
|
|
|
|
|
|
id="modifierAfficher"
|
|
|
|
|
|
class="w-5 h-5 accent-blue-500"
|
|
|
|
|
|
/>
|
|
|
|
|
|
</label>
|
|
|
|
|
|
</div>
|
|
|
|
|
|
|
|
|
|
|
|
<!-- =================================================
|
|
|
|
|
|
MESSAGE
|
|
|
|
|
|
================================================= -->
|
|
|
|
|
|
|
|
|
|
|
|
<div
|
|
|
|
|
|
id="messageModifier"
|
|
|
|
|
|
class="hidden px-4 py-3 rounded-xl text-sm"
|
|
|
|
|
|
></div>
|
|
|
|
|
|
|
|
|
|
|
|
<!-- =================================================
|
|
|
|
|
|
BOUTONS
|
|
|
|
|
|
================================================= -->
|
|
|
|
|
|
|
|
|
|
|
|
<div class="flex justify-end gap-3 pt-4 border-t border-slate-700">
|
|
|
|
|
|
<!-- Annuler -->
|
|
|
|
|
|
|
|
|
|
|
|
<button
|
|
|
|
|
|
id="btnAnnulerModifier"
|
|
|
|
|
|
type="button"
|
|
|
|
|
|
class="bg-slate-700 hover:bg-slate-600 text-white text-xs font-semibold px-5 py-3 rounded-xl transition-all border border-slate-600"
|
|
|
|
|
|
>
|
|
|
|
|
|
Annuler
|
|
|
|
|
|
</button>
|
|
|
|
|
|
|
|
|
|
|
|
<!-- Sauvegarder -->
|
|
|
|
|
|
|
|
|
|
|
|
<button
|
|
|
|
|
|
id="btnSauvegarderModifier"
|
|
|
|
|
|
type="submit"
|
|
|
|
|
|
class="bg-blue-600 hover:bg-blue-500 text-white text-xs font-semibold px-5 py-3 rounded-xl transition-all border border-blue-500"
|
|
|
|
|
|
>
|
|
|
|
|
|
Sauvegarder
|
|
|
|
|
|
</button>
|
|
|
|
|
|
</div>
|
|
|
|
|
|
</form>
|
|
|
|
|
|
</div>
|
|
|
|
|
|
</div>
|
|
|
|
|
|
|
2026-08-20 17:28:26 +00:00
|
|
|
|
<!-- =====================================================
|
|
|
|
|
|
FOOTER
|
|
|
|
|
|
===================================================== -->
|
|
|
|
|
|
|
|
|
|
|
|
<footer
|
|
|
|
|
|
class="h-12 bg-slate-950 flex items-center justify-center text-xs text-slate-400 tracking-wide border-t border-slate-900"
|
|
|
|
|
|
>
|
|
|
|
|
|
Copyright Jean-Francois GIRAUD 2026
|
|
|
|
|
|
</footer>
|
|
|
|
|
|
|
|
|
|
|
|
<!-- =====================================================
|
|
|
|
|
|
JAVASCRIPT
|
|
|
|
|
|
===================================================== -->
|
|
|
|
|
|
|
|
|
|
|
|
<script src="../js/tableindice.js"></script>
|
|
|
|
|
|
</body>
|
|
|
|
|
|
</html>
|
