pierre/SimpleClient-releases
1
0
Fork 0
Code Issues Pull Requests Actions Packages Projects Releases 7 Wiki Activity

checkbox clickable et modification des textes

Browse Source
This commit is contained in:
Pierre Marx
2025-09-04 14:34:54 -04:00
parent 5bfdb286db
commit ec0ea73e35
3 changed files with 148 additions and 116 deletions
Download Patch File Download Diff File Expand all files Collapse all files

54
index.html
View File

@@ -1,25 +1,37 @@
<!DOCTYPE html> <!DOCTYPE html>
<html lang="fr"> <html lang="fr">
<head> <head>
<meta charset="UTF-8"> <meta charset="UTF-8" />
<meta name="viewport" content="width=device-width, initial-scale=1.0"> <meta name="viewport" content="width=device-width, initial-scale=1.0" />
<title>SimpleConnect - Gestion Centralisée des Plannings</title> <title>SimpleConnect - Gestion Centralisée des Plannings</title>
<link rel="stylesheet" href="choices.min.css"> <link rel="stylesheet" href="choices.min.css" />
<link rel="stylesheet" href="styles.css"> <link rel="stylesheet" href="styles.css" />
</head> </head>
<body> <body>
<!-- Page de connexion --> <!-- Page de connexion -->
<div id="loginPage" class="page active"> <div id="loginPage" class="page active">
<div class="login-container"> <div class="login-container">
<h1>SimpleConnect</h1> <h1>SimpleConnect</h1>
<div class="signalr-status"> <div class="signalr-status">
<span class="signalr-indicator" id="signalrIndicator"></span> <span class="signalr-indicator" id="signalrIndicator"></span>
<span class="signalr-text" id="signalrText">Connexion au serveur...</span> <span class="signalr-text" id="signalrText"
>Connexion au serveur...</span
>
</div> </div>
<h2>Connexion Agent</h2> <h2>Connexion Agent</h2>
<form id="loginForm"> <form id="loginForm">
<input type="text" id="accessCode" placeholder="Code d'accès" required> <input
<input type="password" id="password" placeholder="Mot de passe" required> type="text"
id="accessCode"
placeholder="Code d'accès"
required
/>
<input
type="password"
id="password"
placeholder="Mot de passe"
required
/>
<select id="terminal" required> <select id="terminal" required>
<option value="" placeholder>Chargement des postes...</option> <option value="" placeholder>Chargement des postes...</option>
</select> </select>
@@ -27,10 +39,13 @@
<!-- Option de déconnexion forcée --> <!-- Option de déconnexion forcée -->
<div class="force-disconnect-container"> <div class="force-disconnect-container">
<label class="checkbox-label"> <label class="checkbox-label">
<input type="checkbox" id="forceDisconnect"> <input type="checkbox" id="forceDisconnect" />
<span>Déconnexion</span> <span>Déconnexion</span>
</label> </label>
<small class="checkbox-hint">Cochez si vous rencontrez des problèmes de connexion ou si votre session est bloquée</small> <small class="checkbox-hint"
>À cocher en cas de problème de connexion ou de session
bloquée.</small
>
</div> </div>
<button type="submit">Se connecter</button> <button type="submit">Se connecter</button>
@@ -54,7 +69,9 @@
</div> </div>
</div> </div>
<div class="header-right"> <div class="header-right">
<button id="simulateCallBtn" class="btn-secondary">Simuler un appel</button> <button id="simulateCallBtn" class="btn-secondary">
Simuler un appel
</button>
<button id="logoutBtn" class="btn-secondary">Déconnexion</button> <button id="logoutBtn" class="btn-secondary">Déconnexion</button>
</div> </div>
</header> </header>
@@ -106,7 +123,10 @@
<!-- Zone de notes rapides --> <!-- Zone de notes rapides -->
<div class="notes-section"> <div class="notes-section">
<h4>Notes rapides</h4> <h4>Notes rapides</h4>
<textarea id="quickNotes" placeholder="Prenez des notes ici..."></textarea> <textarea
id="quickNotes"
placeholder="Prenez des notes ici..."
></textarea>
<button id="saveNotesBtn" class="btn-small">Sauvegarder</button> <button id="saveNotesBtn" class="btn-small">Sauvegarder</button>
</div> </div>
</main> </main>
@@ -119,7 +139,9 @@
<span class="close">&times;</span> <span class="close">&times;</span>
<h2>Simuler un appel entrant</h2> <h2>Simuler un appel entrant</h2>
<div id="simulatedCallsList" class="simulated-calls-list"></div> <div id="simulatedCallsList" class="simulated-calls-list"></div>
<button id="customCallBtn" class="btn-secondary">Appel personnalisé</button> <button id="customCallBtn" class="btn-secondary">
Appel personnalisé
</button>
</div> </div>
</div> </div>
@@ -127,5 +149,5 @@
<script src="choices.min.js"></script> <script src="choices.min.js"></script>
<script src="renderer.js"></script> <script src="renderer.js"></script>
<script src="cti-simulator.js"></script> <script src="cti-simulator.js"></script>
</body> </body>
</html> </html>

2
renderer.js
View File

@@ -127,7 +127,7 @@ async function handleLogin(e) {
// Désactiver le bouton pendant la connexion // Désactiver le bouton pendant la connexion
loginBtn.disabled = true; loginBtn.disabled = true;
loginBtn.textContent = forceDisconnect ? 'Déconnexion forcée et reconnexion...' : 'Connexion en cours...'; loginBtn.textContent = forceDisconnect ? 'Reconnexion...' : 'Connexion en cours...';
errorDiv.textContent = ''; errorDiv.textContent = '';
try { try {

22
styles.css
View File

@@ -408,8 +408,11 @@ body {
position: absolute; position: absolute;
opacity: 0; opacity: 0;
cursor: pointer; cursor: pointer;
height: 0; height: 18px;
width: 0; width: 18px;
left: 0;
top: 1px;
z-index: 1;
} }
/* Checkbox personnalisée */ /* Checkbox personnalisée */
@@ -427,14 +430,21 @@ body {
flex-shrink: 0; flex-shrink: 0;
} }
/* Checkbox cochée */ /* Checkbox cochée - fond violet */
.checkbox-label input[type="checkbox"]:checked ~ ::before { .checkbox-label input[type="checkbox"]:checked + span::before {
content: '';
position: absolute;
left: 0;
top: 1px;
width: 18px;
height: 18px;
background: #667eea; background: #667eea;
border-color: #667eea; border: 2px solid #667eea;
border-radius: 4px;
} }
/* Icône de check */ /* Icône de check */
.checkbox-label input[type="checkbox"]:checked ~ ::after { .checkbox-label input[type="checkbox"]:checked + span::after {
content: ''; content: '';
position: absolute; position: absolute;
left: 6px; left: 6px;