first version
This commit is contained in:
Julien Denizot
@@ -0,0 +1,4 @@
|
|||||||
|
DATABASE_URL=sqlite:///chemin/absolu/vers/quiz.db
|
||||||
|
SESSION_PASSWORD=changeme
|
||||||
|
ADMIN_PASSWORD=admin
|
||||||
|
LEPTOS_TAILWIND_VERSION=v4.1.13
|
||||||
+17
@@ -0,0 +1,17 @@
|
|||||||
|
# Generated by Cargo
|
||||||
|
# will have compiled files and executables
|
||||||
|
debug/
|
||||||
|
target/
|
||||||
|
|
||||||
|
# Remove Cargo.lock from gitignore if creating an executable, leave it for libraries
|
||||||
|
# More information here https://doc.rust-lang.org/cargo/guide/cargo-toml-vs-cargo-lock.html
|
||||||
|
Cargo.lock
|
||||||
|
|
||||||
|
# These are backup files generated by rustfmt
|
||||||
|
**/*.rs.bk
|
||||||
|
|
||||||
|
# MSVC Windows builds of rustc generate these, which store debugging information
|
||||||
|
*.pdb
|
||||||
|
.env
|
||||||
|
quiz.db
|
||||||
|
*.db
|
||||||
+122
@@ -0,0 +1,122 @@
|
|||||||
|
[package]
|
||||||
|
name = "enuxia-quiz"
|
||||||
|
version = "0.1.0"
|
||||||
|
edition = "2021"
|
||||||
|
|
||||||
|
[lib]
|
||||||
|
crate-type = ["cdylib", "rlib"]
|
||||||
|
|
||||||
|
[dependencies]
|
||||||
|
leptos = { version = "0.8.0" }
|
||||||
|
leptos_router = { version = "0.8.0" }
|
||||||
|
axum = { version = "0.8.0", optional = true }
|
||||||
|
console_error_panic_hook = { version = "0.1", optional = true }
|
||||||
|
leptos_axum = { version = "0.8.0", optional = true }
|
||||||
|
leptos_meta = { version = "0.8.0" }
|
||||||
|
tokio = { version = "1", features = ["rt-multi-thread"], optional = true }
|
||||||
|
wasm-bindgen = { version = "0.2.106", optional = true }
|
||||||
|
chrono = { version = "0.4", features = ["serde"] }
|
||||||
|
serde = { version = "1.0", features = ["derive"] }
|
||||||
|
serde_json = { version = "1", optional = true }
|
||||||
|
anyhow = { version = "1", optional = true }
|
||||||
|
sqlx = { version = "0.8", features = ["runtime-tokio-rustls", "sqlite", "chrono"], optional = true }
|
||||||
|
axum-extra = { version = "0.12.5", features = ["cookie", "cookie-signed"], optional = true }
|
||||||
|
time = { version = "0.3", optional = true }
|
||||||
|
web-sys = { version = "0.3", features = ["Window", "HtmlInputElement"], optional = true }
|
||||||
|
dotenvy = { version = "0.15", optional = true }
|
||||||
|
gloo-timers = { version = "0.4.0", features = ["futures"], optional = true }
|
||||||
|
|
||||||
|
[features]
|
||||||
|
hydrate = [
|
||||||
|
"leptos/hydrate",
|
||||||
|
"dep:console_error_panic_hook",
|
||||||
|
"dep:wasm-bindgen",
|
||||||
|
"dep:gloo-timers",
|
||||||
|
]
|
||||||
|
ssr = [
|
||||||
|
"dep:axum",
|
||||||
|
"dep:tokio",
|
||||||
|
"dep:leptos_axum",
|
||||||
|
"leptos/ssr",
|
||||||
|
"leptos_meta/ssr",
|
||||||
|
"leptos_router/ssr",
|
||||||
|
"dep:sqlx",
|
||||||
|
"dep:anyhow",
|
||||||
|
"dep:axum-extra",
|
||||||
|
"dep:time",
|
||||||
|
"dep:web-sys",
|
||||||
|
"dep:dotenvy",
|
||||||
|
"dep:serde_json",
|
||||||
|
]
|
||||||
|
|
||||||
|
# Defines a size-optimized profile for the WASM bundle in release mode
|
||||||
|
[profile.wasm-release]
|
||||||
|
inherits = "release"
|
||||||
|
opt-level = 'z'
|
||||||
|
lto = true
|
||||||
|
codegen-units = 1
|
||||||
|
panic = "abort"
|
||||||
|
|
||||||
|
[package.metadata.leptos]
|
||||||
|
# The name used by wasm-bindgen/cargo-leptos for the JS/WASM bundle. Defaults to the crate name
|
||||||
|
output-name = "enuxia-quiz"
|
||||||
|
|
||||||
|
# The site root folder is where cargo-leptos generate all output. WARNING: all content of this folder will be erased on a rebuild. Use it in your server setup.
|
||||||
|
site-root = "target/site"
|
||||||
|
|
||||||
|
# The site-root relative folder where all compiled output (JS, WASM and CSS) is written
|
||||||
|
# Defaults to pkg
|
||||||
|
site-pkg-dir = "pkg"
|
||||||
|
|
||||||
|
# [Optional] The source CSS file. If it ends with .sass or .scss then it will be compiled by dart-sass into CSS. The CSS is optimized by Lightning CSS before being written to <site-root>/<site-pkg>/enuxia-quiz.css
|
||||||
|
style-file = "style/main.css"
|
||||||
|
# Assets source dir. All files found here will be copied and synchronized to site-root.
|
||||||
|
# The assets-dir cannot have a sub directory with the same name/path as site-pkg-dir.
|
||||||
|
#
|
||||||
|
# Optional. Env: LEPTOS_ASSETS_DIR.
|
||||||
|
tailwind-input-file = "style/main.css"
|
||||||
|
tailwind-config-file = "tailwind.config.js"
|
||||||
|
assets-dir = "public"
|
||||||
|
|
||||||
|
# The IP and port (ex: 127.0.0.1:3000) where the server serves the content. Use it in your server setup.
|
||||||
|
site-addr = "127.0.0.1:3000"
|
||||||
|
|
||||||
|
# The port to use for automatic reload monitoring
|
||||||
|
reload-port = 3001
|
||||||
|
|
||||||
|
# [Optional] Command to use when running end2end tests. It will run in the end2end dir.
|
||||||
|
# [Windows] for non-WSL use "npx.cmd playwright test"
|
||||||
|
# This binary name can be checked in Powershell with Get-Command npx
|
||||||
|
end2end-cmd = "npx playwright test"
|
||||||
|
end2end-dir = "end2end"
|
||||||
|
|
||||||
|
# The browserlist query used for optimizing the CSS.
|
||||||
|
browserquery = "defaults"
|
||||||
|
|
||||||
|
# The environment Leptos will run in, usually either "DEV" or "PROD"
|
||||||
|
env = "DEV"
|
||||||
|
|
||||||
|
# The features to use when compiling the bin target
|
||||||
|
#
|
||||||
|
# Optional. Can be over-ridden with the command line parameter --bin-features
|
||||||
|
bin-features = ["ssr"]
|
||||||
|
|
||||||
|
# If the --no-default-features flag should be used when compiling the bin target
|
||||||
|
#
|
||||||
|
# Optional. Defaults to false.
|
||||||
|
bin-default-features = false
|
||||||
|
|
||||||
|
# The features to use when compiling the lib target
|
||||||
|
#
|
||||||
|
# Optional. Can be over-ridden with the command line parameter --lib-features
|
||||||
|
lib-features = ["hydrate"]
|
||||||
|
|
||||||
|
# If the --no-default-features flag should be used when compiling the lib target
|
||||||
|
#
|
||||||
|
# Optional. Defaults to false.
|
||||||
|
lib-default-features = false
|
||||||
|
|
||||||
|
# The profile to use for the lib target when compiling for release
|
||||||
|
#
|
||||||
|
# Optional. Defaults to "release".
|
||||||
|
lib-profile-release = "wasm-release"
|
||||||
@@ -0,0 +1,24 @@
|
|||||||
|
This is free and unencumbered software released into the public domain.
|
||||||
|
|
||||||
|
Anyone is free to copy, modify, publish, use, compile, sell, or
|
||||||
|
distribute this software, either in source code form or as a compiled
|
||||||
|
binary, for any purpose, commercial or non-commercial, and by any
|
||||||
|
means.
|
||||||
|
|
||||||
|
In jurisdictions that recognize copyright laws, the author or authors
|
||||||
|
of this software dedicate any and all copyright interest in the
|
||||||
|
software to the public domain. We make this dedication for the benefit
|
||||||
|
of the public at large and to the detriment of our heirs and
|
||||||
|
successors. We intend this dedication to be an overt act of
|
||||||
|
relinquishment in perpetuity of all present and future rights to this
|
||||||
|
software under copyright law.
|
||||||
|
|
||||||
|
THE SOFTWARE IS PROVIDED "AS IS", WITHOUT WARRANTY OF ANY KIND,
|
||||||
|
EXPRESS OR IMPLIED, INCLUDING BUT NOT LIMITED TO THE WARRANTIES OF
|
||||||
|
MERCHANTABILITY, FITNESS FOR A PARTICULAR PURPOSE AND NONINFRINGEMENT.
|
||||||
|
IN NO EVENT SHALL THE AUTHORS BE LIABLE FOR ANY CLAIM, DAMAGES OR
|
||||||
|
OTHER LIABILITY, WHETHER IN AN ACTION OF CONTRACT, TORT OR OTHERWISE,
|
||||||
|
ARISING FROM, OUT OF OR IN CONNECTION WITH THE SOFTWARE OR THE USE OR
|
||||||
|
OTHER DEALINGS IN THE SOFTWARE.
|
||||||
|
|
||||||
|
For more information, please refer to <https://unlicense.org>
|
||||||
@@ -0,0 +1,104 @@
|
|||||||
|
# Enuxia Quiz
|
||||||
|
|
||||||
|
Application de quiz pédagogique **souveraine et auto-hébergée**, construite en Rust full-stack.
|
||||||
|
|
||||||
|
Conçue pour un usage en présentiel (cours, examens): les étudiants passent le quiz depuis leur navigateur, le professeur consulte les résultats et les statistiques depuis une interface d'administration protégée.
|
||||||
|
|
||||||
|
## Stack technique
|
||||||
|
|
||||||
|
| Composant | Technologie |
|
||||||
|
|-----------|-------------|
|
||||||
|
| Frontend + Backend | Leptos 0.8 SSR + Axum |
|
||||||
|
| Base de données | SQLite via SQLx |
|
||||||
|
| CSS | Tailwind v4 |
|
||||||
|
| Compilation WASM | wasm-bindgen |
|
||||||
|
| Déploiement cible | Raspberry Pi 5 (ARM64) |
|
||||||
|
| Reverse proxy | Traefik |
|
||||||
|
|
||||||
|
## Fonctionnalités
|
||||||
|
|
||||||
|
### Côté étudiant
|
||||||
|
- Accès protégé par un code de session distribué le jour J
|
||||||
|
- Sélection du quiz, saisie du prénom et nom
|
||||||
|
- Navigation avant/arrière entre les questions
|
||||||
|
- Minuteur optionnel avec soumission automatique
|
||||||
|
- Correction détaillée avec les bonnes réponses après soumission
|
||||||
|
|
||||||
|
### Côté administration
|
||||||
|
- Création et édition de quiz (questions, réponses, options)
|
||||||
|
- Ordre aléatoire des questions et/ou des réponses par quiz
|
||||||
|
- Blocage anti-doublon — un étudiant ne peut pas repasser sans autorisation
|
||||||
|
- Reset individuel — le professeur autorise une nouvelle tentative
|
||||||
|
- Statistiques — moyenne, distribution des scores, taux de réussite par question
|
||||||
|
- Export CSV des résultats
|
||||||
|
- Configuration des codes d'accès en live sans recompilation
|
||||||
|
|
||||||
|
### Sécurité
|
||||||
|
- Interface admin accessible uniquement via VPN (conseillé)
|
||||||
|
- Cookies de session httponly
|
||||||
|
- Normalisation des noms (lowercase + trim) pour l'anti-doublon
|
||||||
|
|
||||||
|
## Architecture de déploiement optimale
|
||||||
|
|
||||||
|
```
|
||||||
|
Internet
|
||||||
|
│
|
||||||
|
▼
|
||||||
|
Traefik Gateway (VM OVH)
|
||||||
|
├── quiz.enuxia.fr → étudiants (public)
|
||||||
|
└── admin-quiz.enuxia.fr → professeur (VPN uniquement)
|
||||||
|
│
|
||||||
|
▼
|
||||||
|
Raspberry Pi 5
|
||||||
|
└── enuxia-quiz (binaire Rust)
|
||||||
|
└── quiz.db (SQLite local)
|
||||||
|
```
|
||||||
|
|
||||||
|
## Installation
|
||||||
|
|
||||||
|
### Prérequis
|
||||||
|
|
||||||
|
```bash
|
||||||
|
rustup target add wasm32-unknown-unknown
|
||||||
|
cargo install cargo-leptos
|
||||||
|
```
|
||||||
|
|
||||||
|
### Développement
|
||||||
|
|
||||||
|
```bash
|
||||||
|
git clone https://git.enuxia.fr/Enuxia-Public/enuxia-quiz
|
||||||
|
cd enuxia-quiz
|
||||||
|
cp .env.example .env
|
||||||
|
# Éditez .env avec vos valeurs
|
||||||
|
touch quiz.db
|
||||||
|
cargo leptos serve
|
||||||
|
```
|
||||||
|
|
||||||
|
### Production (binaire)
|
||||||
|
|
||||||
|
```bash
|
||||||
|
cargo leptos build --release
|
||||||
|
# Le binaire est dans target/release/enuxia-quiz
|
||||||
|
# Les assets sont dans target/site/
|
||||||
|
```
|
||||||
|
|
||||||
|
## Configuration
|
||||||
|
|
||||||
|
Créez un fichier `.env` à la racine :
|
||||||
|
|
||||||
|
```env
|
||||||
|
DATABASE_URL=sqlite:///chemin/absolu/vers/quiz.db
|
||||||
|
SESSION_PASSWORD=code_distribué_aux_étudiants
|
||||||
|
ADMIN_PASSWORD=mot_de_passe_admin
|
||||||
|
LEPTOS_TAILWIND_VERSION=v4.1.13
|
||||||
|
```
|
||||||
|
|
||||||
|
Les mots de passe sont également modifiables en live depuis `/admin/config` sans redémarrer l'application.
|
||||||
|
|
||||||
|
## Licence
|
||||||
|
|
||||||
|
MIT — libre d'utilisation, de modification et de déploiement.
|
||||||
|
|
||||||
|
---
|
||||||
|
|
||||||
|
Construit par [Enuxia](https://enuxia.fr) — systèmes intelligents souverains sur mesure.
|
||||||
@@ -0,0 +1,3 @@
|
|||||||
|
node_modules
|
||||||
|
playwright-report
|
||||||
|
test-results
|
||||||
Generated
+167
@@ -0,0 +1,167 @@
|
|||||||
|
{
|
||||||
|
"name": "end2end",
|
||||||
|
"version": "1.0.0",
|
||||||
|
"lockfileVersion": 2,
|
||||||
|
"requires": true,
|
||||||
|
"packages": {
|
||||||
|
"": {
|
||||||
|
"name": "end2end",
|
||||||
|
"version": "1.0.0",
|
||||||
|
"license": "ISC",
|
||||||
|
"devDependencies": {
|
||||||
|
"@playwright/test": "^1.44.1",
|
||||||
|
"@types/node": "^20.12.12",
|
||||||
|
"typescript": "^5.4.5"
|
||||||
|
}
|
||||||
|
},
|
||||||
|
"node_modules/@playwright/test": {
|
||||||
|
"version": "1.44.1",
|
||||||
|
"resolved": "https://registry.npmjs.org/@playwright/test/-/test-1.44.1.tgz",
|
||||||
|
"integrity": "sha512-1hZ4TNvD5z9VuhNJ/walIjvMVvYkZKf71axoF/uiAqpntQJXpG64dlXhoDXE3OczPuTuvjf/M5KWFg5VAVUS3Q==",
|
||||||
|
"dev": true,
|
||||||
|
"license": "Apache-2.0",
|
||||||
|
"dependencies": {
|
||||||
|
"playwright": "1.44.1"
|
||||||
|
},
|
||||||
|
"bin": {
|
||||||
|
"playwright": "cli.js"
|
||||||
|
},
|
||||||
|
"engines": {
|
||||||
|
"node": ">=16"
|
||||||
|
}
|
||||||
|
},
|
||||||
|
"node_modules/@types/node": {
|
||||||
|
"version": "20.12.12",
|
||||||
|
"resolved": "https://registry.npmjs.org/@types/node/-/node-20.12.12.tgz",
|
||||||
|
"integrity": "sha512-eWLDGF/FOSPtAvEqeRAQ4C8LSA7M1I7i0ky1I8U7kD1J5ITyW3AsRhQrKVoWf5pFKZ2kILsEGJhsI9r93PYnOw==",
|
||||||
|
"dev": true,
|
||||||
|
"license": "MIT",
|
||||||
|
"dependencies": {
|
||||||
|
"undici-types": "~5.26.4"
|
||||||
|
}
|
||||||
|
},
|
||||||
|
"node_modules/fsevents": {
|
||||||
|
"version": "2.3.2",
|
||||||
|
"resolved": "https://registry.npmjs.org/fsevents/-/fsevents-2.3.2.tgz",
|
||||||
|
"integrity": "sha512-xiqMQR4xAeHTuB9uWm+fFRcIOgKBMiOBP+eXiyT7jsgVCq1bkVygt00oASowB7EdtpOHaaPgKt812P9ab+DDKA==",
|
||||||
|
"dev": true,
|
||||||
|
"hasInstallScript": true,
|
||||||
|
"license": "MIT",
|
||||||
|
"optional": true,
|
||||||
|
"os": [
|
||||||
|
"darwin"
|
||||||
|
],
|
||||||
|
"engines": {
|
||||||
|
"node": "^8.16.0 || ^10.6.0 || >=11.0.0"
|
||||||
|
}
|
||||||
|
},
|
||||||
|
"node_modules/playwright": {
|
||||||
|
"version": "1.44.1",
|
||||||
|
"resolved": "https://registry.npmjs.org/playwright/-/playwright-1.44.1.tgz",
|
||||||
|
"integrity": "sha512-qr/0UJ5CFAtloI3avF95Y0L1xQo6r3LQArLIg/z/PoGJ6xa+EwzrwO5lpNr/09STxdHuUoP2mvuELJS+hLdtgg==",
|
||||||
|
"dev": true,
|
||||||
|
"license": "Apache-2.0",
|
||||||
|
"dependencies": {
|
||||||
|
"playwright-core": "1.44.1"
|
||||||
|
},
|
||||||
|
"bin": {
|
||||||
|
"playwright": "cli.js"
|
||||||
|
},
|
||||||
|
"engines": {
|
||||||
|
"node": ">=16"
|
||||||
|
},
|
||||||
|
"optionalDependencies": {
|
||||||
|
"fsevents": "2.3.2"
|
||||||
|
}
|
||||||
|
},
|
||||||
|
"node_modules/playwright-core": {
|
||||||
|
"version": "1.44.1",
|
||||||
|
"resolved": "https://registry.npmjs.org/playwright-core/-/playwright-core-1.44.1.tgz",
|
||||||
|
"integrity": "sha512-wh0JWtYTrhv1+OSsLPgFzGzt67Y7BE/ZS3jEqgGBlp2ppp1ZDj8c+9IARNW4dwf1poq5MgHreEM2KV/GuR4cFA==",
|
||||||
|
"dev": true,
|
||||||
|
"license": "Apache-2.0",
|
||||||
|
"bin": {
|
||||||
|
"playwright-core": "cli.js"
|
||||||
|
},
|
||||||
|
"engines": {
|
||||||
|
"node": ">=16"
|
||||||
|
}
|
||||||
|
},
|
||||||
|
"node_modules/typescript": {
|
||||||
|
"version": "5.4.5",
|
||||||
|
"resolved": "https://registry.npmjs.org/typescript/-/typescript-5.4.5.tgz",
|
||||||
|
"integrity": "sha512-vcI4UpRgg81oIRUFwR0WSIHKt11nJ7SAVlYNIu+QpqeyXP+gpQJy/Z4+F0aGxSE4MqwjyXvW/TzgkLAx2AGHwQ==",
|
||||||
|
"dev": true,
|
||||||
|
"license": "Apache-2.0",
|
||||||
|
"bin": {
|
||||||
|
"tsc": "bin/tsc",
|
||||||
|
"tsserver": "bin/tsserver"
|
||||||
|
},
|
||||||
|
"engines": {
|
||||||
|
"node": ">=14.17"
|
||||||
|
}
|
||||||
|
},
|
||||||
|
"node_modules/undici-types": {
|
||||||
|
"version": "5.26.5",
|
||||||
|
"resolved": "https://registry.npmjs.org/undici-types/-/undici-types-5.26.5.tgz",
|
||||||
|
"integrity": "sha512-JlCMO+ehdEIKqlFxk6IfVoAUVmgz7cU7zD/h9XZ0qzeosSHmUJVOzSQvvYSYWXkFXC+IfLKSIffhv0sVZup6pA==",
|
||||||
|
"dev": true,
|
||||||
|
"license": "MIT"
|
||||||
|
}
|
||||||
|
},
|
||||||
|
"dependencies": {
|
||||||
|
"@playwright/test": {
|
||||||
|
"version": "1.44.1",
|
||||||
|
"resolved": "https://registry.npmjs.org/@playwright/test/-/test-1.44.1.tgz",
|
||||||
|
"integrity": "sha512-1hZ4TNvD5z9VuhNJ/walIjvMVvYkZKf71axoF/uiAqpntQJXpG64dlXhoDXE3OczPuTuvjf/M5KWFg5VAVUS3Q==",
|
||||||
|
"dev": true,
|
||||||
|
"requires": {
|
||||||
|
"playwright": "1.44.1"
|
||||||
|
}
|
||||||
|
},
|
||||||
|
"@types/node": {
|
||||||
|
"version": "20.12.12",
|
||||||
|
"resolved": "https://registry.npmjs.org/@types/node/-/node-20.12.12.tgz",
|
||||||
|
"integrity": "sha512-eWLDGF/FOSPtAvEqeRAQ4C8LSA7M1I7i0ky1I8U7kD1J5ITyW3AsRhQrKVoWf5pFKZ2kILsEGJhsI9r93PYnOw==",
|
||||||
|
"dev": true,
|
||||||
|
"requires": {
|
||||||
|
"undici-types": "~5.26.4"
|
||||||
|
}
|
||||||
|
},
|
||||||
|
"fsevents": {
|
||||||
|
"version": "2.3.2",
|
||||||
|
"resolved": "https://registry.npmjs.org/fsevents/-/fsevents-2.3.2.tgz",
|
||||||
|
"integrity": "sha512-xiqMQR4xAeHTuB9uWm+fFRcIOgKBMiOBP+eXiyT7jsgVCq1bkVygt00oASowB7EdtpOHaaPgKt812P9ab+DDKA==",
|
||||||
|
"dev": true,
|
||||||
|
"optional": true
|
||||||
|
},
|
||||||
|
"playwright": {
|
||||||
|
"version": "1.44.1",
|
||||||
|
"resolved": "https://registry.npmjs.org/playwright/-/playwright-1.44.1.tgz",
|
||||||
|
"integrity": "sha512-qr/0UJ5CFAtloI3avF95Y0L1xQo6r3LQArLIg/z/PoGJ6xa+EwzrwO5lpNr/09STxdHuUoP2mvuELJS+hLdtgg==",
|
||||||
|
"dev": true,
|
||||||
|
"requires": {
|
||||||
|
"fsevents": "2.3.2",
|
||||||
|
"playwright-core": "1.44.1"
|
||||||
|
}
|
||||||
|
},
|
||||||
|
"playwright-core": {
|
||||||
|
"version": "1.44.1",
|
||||||
|
"resolved": "https://registry.npmjs.org/playwright-core/-/playwright-core-1.44.1.tgz",
|
||||||
|
"integrity": "sha512-wh0JWtYTrhv1+OSsLPgFzGzt67Y7BE/ZS3jEqgGBlp2ppp1ZDj8c+9IARNW4dwf1poq5MgHreEM2KV/GuR4cFA==",
|
||||||
|
"dev": true
|
||||||
|
},
|
||||||
|
"typescript": {
|
||||||
|
"version": "5.4.5",
|
||||||
|
"resolved": "https://registry.npmjs.org/typescript/-/typescript-5.4.5.tgz",
|
||||||
|
"integrity": "sha512-vcI4UpRgg81oIRUFwR0WSIHKt11nJ7SAVlYNIu+QpqeyXP+gpQJy/Z4+F0aGxSE4MqwjyXvW/TzgkLAx2AGHwQ==",
|
||||||
|
"dev": true
|
||||||
|
},
|
||||||
|
"undici-types": {
|
||||||
|
"version": "5.26.5",
|
||||||
|
"resolved": "https://registry.npmjs.org/undici-types/-/undici-types-5.26.5.tgz",
|
||||||
|
"integrity": "sha512-JlCMO+ehdEIKqlFxk6IfVoAUVmgz7cU7zD/h9XZ0qzeosSHmUJVOzSQvvYSYWXkFXC+IfLKSIffhv0sVZup6pA==",
|
||||||
|
"dev": true
|
||||||
|
}
|
||||||
|
}
|
||||||
|
}
|
||||||
@@ -0,0 +1,15 @@
|
|||||||
|
{
|
||||||
|
"name": "end2end",
|
||||||
|
"version": "1.0.0",
|
||||||
|
"description": "",
|
||||||
|
"main": "index.js",
|
||||||
|
"scripts": {},
|
||||||
|
"keywords": [],
|
||||||
|
"author": "",
|
||||||
|
"license": "ISC",
|
||||||
|
"devDependencies": {
|
||||||
|
"@playwright/test": "^1.59.1",
|
||||||
|
"@types/node": "^25.6.0",
|
||||||
|
"typescript": "^6.0.2"
|
||||||
|
}
|
||||||
|
}
|
||||||
@@ -0,0 +1,105 @@
|
|||||||
|
import type { PlaywrightTestConfig } from "@playwright/test";
|
||||||
|
import { devices, defineConfig } from "@playwright/test";
|
||||||
|
|
||||||
|
/**
|
||||||
|
* Read environment variables from file.
|
||||||
|
* https://github.com/motdotla/dotenv
|
||||||
|
*/
|
||||||
|
// require('dotenv').config();
|
||||||
|
|
||||||
|
/**
|
||||||
|
* See https://playwright.dev/docs/test-configuration.
|
||||||
|
*/
|
||||||
|
export default defineConfig({
|
||||||
|
testDir: "./tests",
|
||||||
|
/* Maximum time one test can run for. */
|
||||||
|
timeout: 30 * 1000,
|
||||||
|
expect: {
|
||||||
|
/**
|
||||||
|
* Maximum time expect() should wait for the condition to be met.
|
||||||
|
* For example in `await expect(locator).toHaveText();`
|
||||||
|
*/
|
||||||
|
timeout: 5000,
|
||||||
|
},
|
||||||
|
/* Run tests in files in parallel */
|
||||||
|
fullyParallel: true,
|
||||||
|
/* Fail the build on CI if you accidentally left test.only in the source code. */
|
||||||
|
forbidOnly: !!process.env.CI,
|
||||||
|
/* Retry on CI only */
|
||||||
|
retries: process.env.CI ? 2 : 0,
|
||||||
|
/* Opt out of parallel tests on CI. */
|
||||||
|
workers: process.env.CI ? 1 : undefined,
|
||||||
|
/* Reporter to use. See https://playwright.dev/docs/test-reporters */
|
||||||
|
reporter: "html",
|
||||||
|
/* Shared settings for all the projects below. See https://playwright.dev/docs/api/class-testoptions. */
|
||||||
|
use: {
|
||||||
|
/* Maximum time each action such as `click()` can take. Defaults to 0 (no limit). */
|
||||||
|
actionTimeout: 0,
|
||||||
|
/* Base URL to use in actions like `await page.goto('/')`. */
|
||||||
|
// baseURL: 'http://localhost:3000',
|
||||||
|
|
||||||
|
/* Collect trace when retrying the failed test. See https://playwright.dev/docs/trace-viewer */
|
||||||
|
trace: "on-first-retry",
|
||||||
|
},
|
||||||
|
|
||||||
|
/* Configure projects for major browsers */
|
||||||
|
projects: [
|
||||||
|
{
|
||||||
|
name: "chromium",
|
||||||
|
use: {
|
||||||
|
...devices["Desktop Chrome"],
|
||||||
|
},
|
||||||
|
},
|
||||||
|
|
||||||
|
{
|
||||||
|
name: "firefox",
|
||||||
|
use: {
|
||||||
|
...devices["Desktop Firefox"],
|
||||||
|
},
|
||||||
|
},
|
||||||
|
|
||||||
|
{
|
||||||
|
name: "webkit",
|
||||||
|
use: {
|
||||||
|
...devices["Desktop Safari"],
|
||||||
|
},
|
||||||
|
},
|
||||||
|
|
||||||
|
/* Test against mobile viewports. */
|
||||||
|
// {
|
||||||
|
// name: 'Mobile Chrome',
|
||||||
|
// use: {
|
||||||
|
// ...devices['Pixel 5'],
|
||||||
|
// },
|
||||||
|
// },
|
||||||
|
// {
|
||||||
|
// name: 'Mobile Safari',
|
||||||
|
// use: {
|
||||||
|
// ...devices['iPhone 12'],
|
||||||
|
// },
|
||||||
|
// },
|
||||||
|
|
||||||
|
/* Test against branded browsers. */
|
||||||
|
// {
|
||||||
|
// name: 'Microsoft Edge',
|
||||||
|
// use: {
|
||||||
|
// channel: 'msedge',
|
||||||
|
// },
|
||||||
|
// },
|
||||||
|
// {
|
||||||
|
// name: 'Google Chrome',
|
||||||
|
// use: {
|
||||||
|
// channel: 'chrome',
|
||||||
|
// },
|
||||||
|
// },
|
||||||
|
],
|
||||||
|
|
||||||
|
/* Folder for test artifacts such as screenshots, videos, traces, etc. */
|
||||||
|
// outputDir: 'test-results/',
|
||||||
|
|
||||||
|
/* Run your local dev server before starting the tests */
|
||||||
|
// webServer: {
|
||||||
|
// command: 'npm run start',
|
||||||
|
// port: 3000,
|
||||||
|
// },
|
||||||
|
});
|
||||||
@@ -0,0 +1,9 @@
|
|||||||
|
import { test, expect } from "@playwright/test";
|
||||||
|
|
||||||
|
test("homepage has title and heading text", async ({ page }) => {
|
||||||
|
await page.goto("http://localhost:3000/");
|
||||||
|
|
||||||
|
await expect(page).toHaveTitle("Welcome to Leptos");
|
||||||
|
|
||||||
|
await expect(page.locator("h1")).toHaveText("Welcome to Leptos!");
|
||||||
|
});
|
||||||
@@ -0,0 +1,109 @@
|
|||||||
|
{
|
||||||
|
"compilerOptions": {
|
||||||
|
/* Visit https://aka.ms/tsconfig to read more about this file */
|
||||||
|
|
||||||
|
/* Projects */
|
||||||
|
// "incremental": true, /* Save .tsbuildinfo files to allow for incremental compilation of projects. */
|
||||||
|
// "composite": true, /* Enable constraints that allow a TypeScript project to be used with project references. */
|
||||||
|
// "tsBuildInfoFile": "./.tsbuildinfo", /* Specify the path to .tsbuildinfo incremental compilation file. */
|
||||||
|
// "disableSourceOfProjectReferenceRedirect": true, /* Disable preferring source files instead of declaration files when referencing composite projects. */
|
||||||
|
// "disableSolutionSearching": true, /* Opt a project out of multi-project reference checking when editing. */
|
||||||
|
// "disableReferencedProjectLoad": true, /* Reduce the number of projects loaded automatically by TypeScript. */
|
||||||
|
|
||||||
|
/* Language and Environment */
|
||||||
|
"target": "es2016", /* Set the JavaScript language version for emitted JavaScript and include compatible library declarations. */
|
||||||
|
// "lib": [], /* Specify a set of bundled library declaration files that describe the target runtime environment. */
|
||||||
|
// "jsx": "preserve", /* Specify what JSX code is generated. */
|
||||||
|
// "experimentalDecorators": true, /* Enable experimental support for legacy experimental decorators. */
|
||||||
|
// "emitDecoratorMetadata": true, /* Emit design-type metadata for decorated declarations in source files. */
|
||||||
|
// "jsxFactory": "", /* Specify the JSX factory function used when targeting React JSX emit, e.g. 'React.createElement' or 'h'. */
|
||||||
|
// "jsxFragmentFactory": "", /* Specify the JSX Fragment reference used for fragments when targeting React JSX emit e.g. 'React.Fragment' or 'Fragment'. */
|
||||||
|
// "jsxImportSource": "", /* Specify module specifier used to import the JSX factory functions when using 'jsx: react-jsx*'. */
|
||||||
|
// "reactNamespace": "", /* Specify the object invoked for 'createElement'. This only applies when targeting 'react' JSX emit. */
|
||||||
|
// "noLib": true, /* Disable including any library files, including the default lib.d.ts. */
|
||||||
|
// "useDefineForClassFields": true, /* Emit ECMAScript-standard-compliant class fields. */
|
||||||
|
// "moduleDetection": "auto", /* Control what method is used to detect module-format JS files. */
|
||||||
|
|
||||||
|
/* Modules */
|
||||||
|
"module": "commonjs", /* Specify what module code is generated. */
|
||||||
|
// "rootDir": "./", /* Specify the root folder within your source files. */
|
||||||
|
// "moduleResolution": "node10", /* Specify how TypeScript looks up a file from a given module specifier. */
|
||||||
|
// "baseUrl": "./", /* Specify the base directory to resolve non-relative module names. */
|
||||||
|
// "paths": {}, /* Specify a set of entries that re-map imports to additional lookup locations. */
|
||||||
|
// "rootDirs": [], /* Allow multiple folders to be treated as one when resolving modules. */
|
||||||
|
// "typeRoots": [], /* Specify multiple folders that act like './node_modules/@types'. */
|
||||||
|
// "types": [], /* Specify type package names to be included without being referenced in a source file. */
|
||||||
|
// "allowUmdGlobalAccess": true, /* Allow accessing UMD globals from modules. */
|
||||||
|
// "moduleSuffixes": [], /* List of file name suffixes to search when resolving a module. */
|
||||||
|
// "allowImportingTsExtensions": true, /* Allow imports to include TypeScript file extensions. Requires '--moduleResolution bundler' and either '--noEmit' or '--emitDeclarationOnly' to be set. */
|
||||||
|
// "resolvePackageJsonExports": true, /* Use the package.json 'exports' field when resolving package imports. */
|
||||||
|
// "resolvePackageJsonImports": true, /* Use the package.json 'imports' field when resolving imports. */
|
||||||
|
// "customConditions": [], /* Conditions to set in addition to the resolver-specific defaults when resolving imports. */
|
||||||
|
// "resolveJsonModule": true, /* Enable importing .json files. */
|
||||||
|
// "allowArbitraryExtensions": true, /* Enable importing files with any extension, provided a declaration file is present. */
|
||||||
|
// "noResolve": true, /* Disallow 'import's, 'require's or '<reference>'s from expanding the number of files TypeScript should add to a project. */
|
||||||
|
|
||||||
|
/* JavaScript Support */
|
||||||
|
// "allowJs": true, /* Allow JavaScript files to be a part of your program. Use the 'checkJS' option to get errors from these files. */
|
||||||
|
// "checkJs": true, /* Enable error reporting in type-checked JavaScript files. */
|
||||||
|
// "maxNodeModuleJsDepth": 1, /* Specify the maximum folder depth used for checking JavaScript files from 'node_modules'. Only applicable with 'allowJs'. */
|
||||||
|
|
||||||
|
/* Emit */
|
||||||
|
// "declaration": true, /* Generate .d.ts files from TypeScript and JavaScript files in your project. */
|
||||||
|
// "declarationMap": true, /* Create sourcemaps for d.ts files. */
|
||||||
|
// "emitDeclarationOnly": true, /* Only output d.ts files and not JavaScript files. */
|
||||||
|
// "sourceMap": true, /* Create source map files for emitted JavaScript files. */
|
||||||
|
// "inlineSourceMap": true, /* Include sourcemap files inside the emitted JavaScript. */
|
||||||
|
// "outFile": "./", /* Specify a file that bundles all outputs into one JavaScript file. If 'declaration' is true, also designates a file that bundles all .d.ts output. */
|
||||||
|
// "outDir": "./", /* Specify an output folder for all emitted files. */
|
||||||
|
// "removeComments": true, /* Disable emitting comments. */
|
||||||
|
// "noEmit": true, /* Disable emitting files from a compilation. */
|
||||||
|
// "importHelpers": true, /* Allow importing helper functions from tslib once per project, instead of including them per-file. */
|
||||||
|
// "importsNotUsedAsValues": "remove", /* Specify emit/checking behavior for imports that are only used for types. */
|
||||||
|
// "downlevelIteration": true, /* Emit more compliant, but verbose and less performant JavaScript for iteration. */
|
||||||
|
// "sourceRoot": "", /* Specify the root path for debuggers to find the reference source code. */
|
||||||
|
// "mapRoot": "", /* Specify the location where debugger should locate map files instead of generated locations. */
|
||||||
|
// "inlineSources": true, /* Include source code in the sourcemaps inside the emitted JavaScript. */
|
||||||
|
// "emitBOM": true, /* Emit a UTF-8 Byte Order Mark (BOM) in the beginning of output files. */
|
||||||
|
// "newLine": "crlf", /* Set the newline character for emitting files. */
|
||||||
|
// "stripInternal": true, /* Disable emitting declarations that have '@internal' in their JSDoc comments. */
|
||||||
|
// "noEmitHelpers": true, /* Disable generating custom helper functions like '__extends' in compiled output. */
|
||||||
|
// "noEmitOnError": true, /* Disable emitting files if any type checking errors are reported. */
|
||||||
|
// "preserveConstEnums": true, /* Disable erasing 'const enum' declarations in generated code. */
|
||||||
|
// "declarationDir": "./", /* Specify the output directory for generated declaration files. */
|
||||||
|
// "preserveValueImports": true, /* Preserve unused imported values in the JavaScript output that would otherwise be removed. */
|
||||||
|
|
||||||
|
/* Interop Constraints */
|
||||||
|
// "isolatedModules": true, /* Ensure that each file can be safely transpiled without relying on other imports. */
|
||||||
|
// "verbatimModuleSyntax": true, /* Do not transform or elide any imports or exports not marked as type-only, ensuring they are written in the output file's format based on the 'module' setting. */
|
||||||
|
// "allowSyntheticDefaultImports": true, /* Allow 'import x from y' when a module doesn't have a default export. */
|
||||||
|
"esModuleInterop": true, /* Emit additional JavaScript to ease support for importing CommonJS modules. This enables 'allowSyntheticDefaultImports' for type compatibility. */
|
||||||
|
// "preserveSymlinks": true, /* Disable resolving symlinks to their realpath. This correlates to the same flag in node. */
|
||||||
|
"forceConsistentCasingInFileNames": true, /* Ensure that casing is correct in imports. */
|
||||||
|
|
||||||
|
/* Type Checking */
|
||||||
|
"strict": true, /* Enable all strict type-checking options. */
|
||||||
|
// "noImplicitAny": true, /* Enable error reporting for expressions and declarations with an implied 'any' type. */
|
||||||
|
// "strictNullChecks": true, /* When type checking, take into account 'null' and 'undefined'. */
|
||||||
|
// "strictFunctionTypes": true, /* When assigning functions, check to ensure parameters and the return values are subtype-compatible. */
|
||||||
|
// "strictBindCallApply": true, /* Check that the arguments for 'bind', 'call', and 'apply' methods match the original function. */
|
||||||
|
// "strictPropertyInitialization": true, /* Check for class properties that are declared but not set in the constructor. */
|
||||||
|
// "noImplicitThis": true, /* Enable error reporting when 'this' is given the type 'any'. */
|
||||||
|
// "useUnknownInCatchVariables": true, /* Default catch clause variables as 'unknown' instead of 'any'. */
|
||||||
|
// "alwaysStrict": true, /* Ensure 'use strict' is always emitted. */
|
||||||
|
// "noUnusedLocals": true, /* Enable error reporting when local variables aren't read. */
|
||||||
|
// "noUnusedParameters": true, /* Raise an error when a function parameter isn't read. */
|
||||||
|
// "exactOptionalPropertyTypes": true, /* Interpret optional property types as written, rather than adding 'undefined'. */
|
||||||
|
// "noImplicitReturns": true, /* Enable error reporting for codepaths that do not explicitly return in a function. */
|
||||||
|
// "noFallthroughCasesInSwitch": true, /* Enable error reporting for fallthrough cases in switch statements. */
|
||||||
|
// "noUncheckedIndexedAccess": true, /* Add 'undefined' to a type when accessed using an index. */
|
||||||
|
// "noImplicitOverride": true, /* Ensure overriding members in derived classes are marked with an override modifier. */
|
||||||
|
// "noPropertyAccessFromIndexSignature": true, /* Enforces using indexed accessors for keys declared using an indexed type. */
|
||||||
|
// "allowUnusedLabels": true, /* Disable error reporting for unused labels. */
|
||||||
|
// "allowUnreachableCode": true, /* Disable error reporting for unreachable code. */
|
||||||
|
|
||||||
|
/* Completeness */
|
||||||
|
// "skipDefaultLibCheck": true, /* Skip type checking .d.ts files that are included with TypeScript. */
|
||||||
|
"skipLibCheck": true /* Skip type checking all .d.ts files. */
|
||||||
|
}
|
||||||
|
}
|
||||||
Binary file not shown.
|
After Width: | Height: | Size: 15 KiB |
@@ -0,0 +1 @@
|
|||||||
|
<?xml version="1.0" encoding="UTF-8"?><svg id="Calque_1" xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink" viewBox="0 0 75.83 102.78"><defs><style>.cls-1{fill:url(#Nouvelle_nuance_de_dégradé_1_2);}.cls-2{fill:#fff;}.cls-3{fill:url(#Dégradé_sans_nom_10);}</style><linearGradient id="Nouvelle_nuance_de_dégradé_1_2" x1="2.13" y1="44.89" x2="70.39" y2="44.89" gradientUnits="userSpaceOnUse"><stop offset="0" stop-color="#1e90ff"/><stop offset=".88" stop-color="#8b5cf6"/></linearGradient><linearGradient id="Dégradé_sans_nom_10" x1="7.43" y1="69.85" x2="64.02" y2="69.85" gradientUnits="userSpaceOnUse"><stop offset="0" stop-color="#1e90ff"/><stop offset=".88" stop-color="#8b5cf6"/></linearGradient></defs><path class="cls-1" d="M68.17,0c-.76,4.39-2.46,9.91-6.23,15.24-4.74,6.7-10.65,10.14-14.29,12.21-2.09,1.18-5.07,2.43-11.04,4.93-7.83,3.28-9.14,3.42-13.36,5.58-4.22,2.17-7.3,3.75-10.54,6.75-5.99,5.56-8.3,12.07-8.96,14.16-1.23,3.86-3.24,12.62.65,21.95,1.5,3.61,4.15,7.28,5.58,8.96-1.05-2.27-3.6-8.09-3.12-14.29.6-7.74,4.45-12.82,5.19-13.77,2.89-3.7,6.13-5.56,9.09-7.27,2.91-1.68,4.53-2.14,11.56-4.68,8.02-2.9,12.03-4.35,14.41-5.47,5.32-2.51,9.5-4.48,13.64-8.68,5.66-5.75,7.72-12.12,8.31-14.16,2.9-9.98.23-18.42-.91-21.47"/><path class="cls-3" d="M64.02,40.04s-3.72,5.03-11.17,9.74c-3.18,2.01-6,3.04-8.7,4.03-5.18,1.89-6.27,1.47-13.38,3.51-5.43,1.56-8.14,2.34-11.3,4.16-2.8,1.62-6.44,3.77-9.09,8.18-.55.91-2.51,4.34-2.86,9.22-.15,2.2-.49,7.04,2.47,10.91.45.59,1.25,1.3,2.86,2.73.98.87,3.45,3,7.14,5.32.53.33,3.41,1.82,3.41,1.82,0,0-5.77-3.21-8.21-9.22-.45-1.11-1.64-4.16-.78-7.79,1.17-4.9,5.28-7.47,6.62-8.31,1.73-1.08,3.17-1.52,5.97-2.34,4.79-1.4,7.81-1.68,10.26-2.13,1.93-.36,9.29-1.8,15.84-7.09,1.12-.9,5.79-4.8,8.83-11.6,2.05-4.59,2.08-11.12,2.08-11.12Z"/><path class="cls-2" d="M64.02,72.12s3.06-.36,6.92-.26c2.07.05,3.77.17,4.9.26-1.02,2.72-3.85,9.14-10.65,14.03-1.38.99-5.84,4.02-12.47,5.19-2.38.42-9.48,1.95-17.79-2.08-6.17-2.99-10.46-7.17-10.26-7.45.15-.22,2.77,2.18,7.27,3.69,6.57,2.2,12.46.93,14.29.52,3.39-.77,7.59-2.46,11.11-5.25,3.98-3.15,6.68-8.64,6.68-8.64Z"/><path class="cls-2" d="M18.43,79.91s2.96,4.55,9.09,9.35c4.85,3.8,9.83,5.05,12.03,5.58,1.89.46,6.77,1.59,12.38.65,11.31-1.89,18.45-10.13,18.45-10.13,0,0-3.86,5.8-10.79,10.47-2.99,2.01-8.08,5.37-15.58,6.5-2.58.39-7.99,1.14-14.29-1-3.1-1.05-6.59-2.75-9.74-6.1-6.23-6.62-1.56-15.32-1.56-15.32Z"/><path class="cls-2" d="M46.57,24.43s-6.81-1.21-11.87-.39c-4.61.74-10.03,1.61-16.04,5.35-6.72,4.17-10.23,9.46-11.87,12-1.71,2.64-4.35,7.37-5.74,13.83-.67,3.12-1.97,9.48,0,17.22.92,3.64,3.36,8.38,3.36,8.38-1.44-3.73-3.49-10.64-2.28-19.08.34-2.38,1.09-7.23,4.26-12.52,2.78-4.64,6.06-7.33,8.35-9.18,5.41-4.36,10.86-6.51,14.74-8.04,2.96-1.17-.52.2,8.48-3.13,5.17-1.92,8.61-4.43,8.61-4.43Z"/></svg>
|
||||||
|
After Width: | Height: | Size: 2.7 KiB |
+57
@@ -0,0 +1,57 @@
|
|||||||
|
use leptos::prelude::*;
|
||||||
|
use leptos_meta::{provide_meta_context, MetaTags, Stylesheet, Title};
|
||||||
|
use leptos_router::{
|
||||||
|
components::{Route, Router, Routes},
|
||||||
|
path,
|
||||||
|
};
|
||||||
|
|
||||||
|
pub fn shell(options: LeptosOptions) -> impl IntoView {
|
||||||
|
view! {
|
||||||
|
<!DOCTYPE html>
|
||||||
|
<html lang="fr">
|
||||||
|
<head>
|
||||||
|
<meta charset="utf-8"/>
|
||||||
|
<meta name="viewport" content="width=device-width, initial-scale=1"/>
|
||||||
|
<link rel="icon" type="image/png" href="/favicon.png"/>
|
||||||
|
<AutoReload options=options.clone() />
|
||||||
|
<HydrationScripts options/>
|
||||||
|
<MetaTags/>
|
||||||
|
</head>
|
||||||
|
<body>
|
||||||
|
<App/>
|
||||||
|
</body>
|
||||||
|
</html>
|
||||||
|
}
|
||||||
|
}
|
||||||
|
|
||||||
|
#[component]
|
||||||
|
pub fn App() -> impl IntoView {
|
||||||
|
provide_meta_context();
|
||||||
|
|
||||||
|
view! {
|
||||||
|
<Stylesheet id="leptos" href="/pkg/enuxia-quiz.css"/>
|
||||||
|
<Title text="Enuxia Quiz"/>
|
||||||
|
<Router>
|
||||||
|
<main>
|
||||||
|
<Routes fallback=|| "Page introuvable.".into_view()>
|
||||||
|
// ── Auth ─────────────────────────────────────────
|
||||||
|
<Route path=path!("/login") view=crate::pages::login::LoginPage/>
|
||||||
|
<Route path=path!("/admin/login") view=crate::pages::login::AdminLoginPage/>
|
||||||
|
<Route path=path!("/admin/config") view=crate::pages::admin::config::ConfigPage/>
|
||||||
|
// ── Étudiant ──────────────────────────────────────
|
||||||
|
<Route path=path!("/") view=crate::pages::student::home::HomePage/>
|
||||||
|
<Route path=path!("/quiz/:quiz_id") view=crate::pages::student::quiz::QuizPage/>
|
||||||
|
<Route path=path!("/result/:submission_id") view=crate::pages::student::result::ResultPage/>
|
||||||
|
|
||||||
|
// ── Admin ─────────────────────────────────────────
|
||||||
|
<Route path=path!("/admin") view=crate::pages::admin::dashboard::DashboardPage/>
|
||||||
|
<Route path=path!("/admin/quiz/new") view=crate::pages::admin::quiz_edit::QuizEditPage/>
|
||||||
|
<Route path=path!("/admin/quiz/:quiz_id/edit") view=crate::pages::admin::quiz_edit::QuizEditPage/>
|
||||||
|
<Route path=path!("/admin/quiz/:quiz_id/results") view=crate::pages::admin::quiz_results::QuizResultsPage/>
|
||||||
|
<Route path=path!("/admin/quiz/:quiz_id/stats") view=crate::pages::admin::quiz_stats::QuizStatsPage/>
|
||||||
|
<Route path=path!("/admin/submission/:submission_id") view=crate::pages::admin::student_detail::StudentDetailPage/>
|
||||||
|
</Routes>
|
||||||
|
</main>
|
||||||
|
</Router>
|
||||||
|
}
|
||||||
|
}
|
||||||
@@ -0,0 +1,82 @@
|
|||||||
|
use sqlx::{SqlitePool, sqlite::SqlitePoolOptions};
|
||||||
|
use anyhow::Result;
|
||||||
|
|
||||||
|
pub async fn init_db(database_url: &str) -> Result<SqlitePool> {
|
||||||
|
let pool = SqlitePoolOptions::new()
|
||||||
|
.max_connections(5)
|
||||||
|
.connect(database_url)
|
||||||
|
.await?;
|
||||||
|
|
||||||
|
// Tables de base
|
||||||
|
sqlx::query(
|
||||||
|
r#"
|
||||||
|
CREATE TABLE IF NOT EXISTS quizzes (
|
||||||
|
id INTEGER PRIMARY KEY AUTOINCREMENT,
|
||||||
|
title TEXT NOT NULL,
|
||||||
|
description TEXT NOT NULL DEFAULT '',
|
||||||
|
active BOOLEAN NOT NULL DEFAULT 1,
|
||||||
|
shuffle_questions BOOLEAN NOT NULL DEFAULT 0,
|
||||||
|
shuffle_answers BOOLEAN NOT NULL DEFAULT 0,
|
||||||
|
time_limit_seconds INTEGER DEFAULT NULL,
|
||||||
|
created_at TEXT NOT NULL DEFAULT (datetime('now'))
|
||||||
|
);
|
||||||
|
CREATE TABLE IF NOT EXISTS questions (
|
||||||
|
id INTEGER PRIMARY KEY AUTOINCREMENT,
|
||||||
|
quiz_id INTEGER NOT NULL REFERENCES quizzes(id) ON DELETE CASCADE,
|
||||||
|
text TEXT NOT NULL,
|
||||||
|
section TEXT NOT NULL DEFAULT '',
|
||||||
|
position INTEGER NOT NULL DEFAULT 0
|
||||||
|
);
|
||||||
|
CREATE TABLE IF NOT EXISTS answers (
|
||||||
|
id INTEGER PRIMARY KEY AUTOINCREMENT,
|
||||||
|
question_id INTEGER NOT NULL REFERENCES questions(id) ON DELETE CASCADE,
|
||||||
|
label TEXT NOT NULL,
|
||||||
|
text TEXT NOT NULL,
|
||||||
|
correct BOOLEAN NOT NULL DEFAULT 0
|
||||||
|
);
|
||||||
|
CREATE TABLE IF NOT EXISTS submissions (
|
||||||
|
id INTEGER PRIMARY KEY AUTOINCREMENT,
|
||||||
|
quiz_id INTEGER NOT NULL REFERENCES quizzes(id),
|
||||||
|
first_name TEXT NOT NULL,
|
||||||
|
last_name TEXT NOT NULL,
|
||||||
|
score INTEGER NOT NULL DEFAULT 0,
|
||||||
|
total INTEGER NOT NULL DEFAULT 0,
|
||||||
|
submitted_at TEXT NOT NULL DEFAULT (datetime('now'))
|
||||||
|
);
|
||||||
|
CREATE TABLE IF NOT EXISTS student_answers (
|
||||||
|
id INTEGER PRIMARY KEY AUTOINCREMENT,
|
||||||
|
submission_id INTEGER NOT NULL REFERENCES submissions(id) ON DELETE CASCADE,
|
||||||
|
question_id INTEGER NOT NULL,
|
||||||
|
answer_id INTEGER NOT NULL,
|
||||||
|
correct BOOLEAN NOT NULL DEFAULT 0
|
||||||
|
);
|
||||||
|
CREATE TABLE IF NOT EXISTS config (
|
||||||
|
key TEXT PRIMARY KEY,
|
||||||
|
value TEXT NOT NULL
|
||||||
|
);
|
||||||
|
CREATE TABLE IF NOT EXISTS resets (
|
||||||
|
id INTEGER PRIMARY KEY AUTOINCREMENT,
|
||||||
|
quiz_id INTEGER NOT NULL,
|
||||||
|
first_name TEXT NOT NULL,
|
||||||
|
last_name TEXT NOT NULL,
|
||||||
|
used BOOLEAN NOT NULL DEFAULT 0,
|
||||||
|
created_at TEXT NOT NULL DEFAULT (datetime('now'))
|
||||||
|
);
|
||||||
|
INSERT OR IGNORE INTO config (key, value) VALUES ('session_password', 'changeme');
|
||||||
|
INSERT OR IGNORE INTO config (key, value) VALUES ('admin_password', 'admin');
|
||||||
|
"#,
|
||||||
|
)
|
||||||
|
.execute(&pool)
|
||||||
|
.await?;
|
||||||
|
|
||||||
|
// Migrations pour base existante
|
||||||
|
for migration in [
|
||||||
|
"ALTER TABLE quizzes ADD COLUMN shuffle_questions BOOLEAN NOT NULL DEFAULT 0",
|
||||||
|
"ALTER TABLE quizzes ADD COLUMN shuffle_answers BOOLEAN NOT NULL DEFAULT 0",
|
||||||
|
"ALTER TABLE quizzes ADD COLUMN time_limit_seconds INTEGER DEFAULT NULL",
|
||||||
|
] {
|
||||||
|
sqlx::query(migration).execute(&pool).await.ok();
|
||||||
|
}
|
||||||
|
|
||||||
|
Ok(pool)
|
||||||
|
}
|
||||||
+18
@@ -0,0 +1,18 @@
|
|||||||
|
pub mod app;
|
||||||
|
pub mod models;
|
||||||
|
pub mod pages;
|
||||||
|
pub mod server;
|
||||||
|
|
||||||
|
#[cfg(feature = "ssr")]
|
||||||
|
pub mod db;
|
||||||
|
|
||||||
|
#[cfg(feature = "ssr")]
|
||||||
|
pub mod middleware;
|
||||||
|
|
||||||
|
#[cfg(feature = "hydrate")]
|
||||||
|
#[wasm_bindgen::prelude::wasm_bindgen]
|
||||||
|
pub fn hydrate() {
|
||||||
|
use crate::app::*;
|
||||||
|
console_error_panic_hook::set_once();
|
||||||
|
leptos::mount::hydrate_body(App);
|
||||||
|
}
|
||||||
+44
@@ -0,0 +1,44 @@
|
|||||||
|
#[cfg(feature = "ssr")]
|
||||||
|
#[tokio::main]
|
||||||
|
async fn main() {
|
||||||
|
use axum::{Router, Extension};
|
||||||
|
use leptos::logging::log;
|
||||||
|
use leptos::prelude::*;
|
||||||
|
use leptos_axum::{generate_route_list, LeptosRoutes};
|
||||||
|
use enuxia_quiz::app::*;
|
||||||
|
use enuxia_quiz::db::init_db;
|
||||||
|
|
||||||
|
dotenvy::dotenv().ok();
|
||||||
|
|
||||||
|
let database_url = std::env::var("DATABASE_URL")
|
||||||
|
.unwrap_or_else(|_| "sqlite://quiz.db".to_string());
|
||||||
|
|
||||||
|
let pool: sqlx::SqlitePool = init_db(&database_url).await
|
||||||
|
.expect("Impossible d'initialiser la base de données");
|
||||||
|
|
||||||
|
log!("Base de données initialisée : {}", database_url);
|
||||||
|
|
||||||
|
let conf = get_configuration(None).unwrap();
|
||||||
|
let addr = conf.leptos_options.site_addr;
|
||||||
|
let leptos_options = conf.leptos_options;
|
||||||
|
|
||||||
|
let routes = generate_route_list(App);
|
||||||
|
|
||||||
|
let app = Router::new()
|
||||||
|
.leptos_routes(&leptos_options, routes, {
|
||||||
|
let leptos_options = leptos_options.clone();
|
||||||
|
move || shell(leptos_options.clone())
|
||||||
|
})
|
||||||
|
.fallback(leptos_axum::file_and_error_handler(shell))
|
||||||
|
.layer(Extension(pool))
|
||||||
|
.with_state(leptos_options);
|
||||||
|
|
||||||
|
log!("listening on http://{}", &addr);
|
||||||
|
let listener = tokio::net::TcpListener::bind(&addr).await.unwrap();
|
||||||
|
axum::serve(listener, app.into_make_service())
|
||||||
|
.await
|
||||||
|
.unwrap();
|
||||||
|
}
|
||||||
|
|
||||||
|
#[cfg(not(feature = "ssr"))]
|
||||||
|
pub fn main() {}
|
||||||
@@ -0,0 +1,41 @@
|
|||||||
|
use axum::{
|
||||||
|
extract::Request,
|
||||||
|
middleware::Next,
|
||||||
|
response::{IntoResponse, Redirect, Response},
|
||||||
|
};
|
||||||
|
use axum_extra::extract::CookieJar;
|
||||||
|
|
||||||
|
pub const SESSION_COOKIE: &str = "eq_session";
|
||||||
|
pub const ADMIN_COOKIE: &str = "eq_admin";
|
||||||
|
|
||||||
|
#[cfg(feature = "ssr")]
|
||||||
|
pub async fn check_session() -> bool {
|
||||||
|
use leptos_axum::extract;
|
||||||
|
use axum::Extension;
|
||||||
|
use sqlx::SqlitePool;
|
||||||
|
|
||||||
|
let Ok(jar): Result<CookieJar, _> = extract().await else { return false };
|
||||||
|
let Ok(Extension(pool)): Result<Extension<SqlitePool>, _> = extract().await else { return false };
|
||||||
|
|
||||||
|
let expected = crate::server::get_config_value(&pool, "session_password", "changeme").await;
|
||||||
|
|
||||||
|
jar.get(SESSION_COOKIE)
|
||||||
|
.map(|c| c.value() == expected)
|
||||||
|
.unwrap_or(false)
|
||||||
|
}
|
||||||
|
|
||||||
|
#[cfg(feature = "ssr")]
|
||||||
|
pub async fn check_admin() -> bool {
|
||||||
|
use leptos_axum::extract;
|
||||||
|
use axum::Extension;
|
||||||
|
use sqlx::SqlitePool;
|
||||||
|
|
||||||
|
let Ok(jar): Result<CookieJar, _> = extract().await else { return false };
|
||||||
|
let Ok(Extension(pool)): Result<Extension<SqlitePool>, _> = extract().await else { return false };
|
||||||
|
|
||||||
|
let expected = crate::server::get_config_value(&pool, "admin_password", "admin").await;
|
||||||
|
|
||||||
|
jar.get(ADMIN_COOKIE)
|
||||||
|
.map(|c| c.value() == expected)
|
||||||
|
.unwrap_or(false)
|
||||||
|
}
|
||||||
+103
@@ -0,0 +1,103 @@
|
|||||||
|
use serde::{Deserialize, Serialize};
|
||||||
|
use chrono::{DateTime, Utc};
|
||||||
|
|
||||||
|
#[derive(Debug, Clone, Serialize, Deserialize)]
|
||||||
|
#[cfg_attr(feature = "ssr", derive(sqlx::FromRow))]
|
||||||
|
pub struct Quiz {
|
||||||
|
pub id: i64,
|
||||||
|
pub title: String,
|
||||||
|
pub description: String,
|
||||||
|
pub active: bool,
|
||||||
|
pub shuffle_questions: bool,
|
||||||
|
pub shuffle_answers: bool,
|
||||||
|
pub time_limit_seconds: Option<i64>,
|
||||||
|
pub created_at: DateTime<Utc>,
|
||||||
|
}
|
||||||
|
|
||||||
|
#[derive(Debug, Clone, Serialize, Deserialize)]
|
||||||
|
#[cfg_attr(feature = "ssr", derive(sqlx::FromRow))]
|
||||||
|
pub struct Question {
|
||||||
|
pub id: i64,
|
||||||
|
pub quiz_id: i64,
|
||||||
|
pub text: String,
|
||||||
|
pub section: String,
|
||||||
|
pub position: i64,
|
||||||
|
}
|
||||||
|
|
||||||
|
#[derive(Debug, Clone, Serialize, Deserialize)]
|
||||||
|
#[cfg_attr(feature = "ssr", derive(sqlx::FromRow))]
|
||||||
|
pub struct Answer {
|
||||||
|
pub id: i64,
|
||||||
|
pub question_id: i64,
|
||||||
|
pub label: String,
|
||||||
|
pub text: String,
|
||||||
|
pub correct: bool,
|
||||||
|
}
|
||||||
|
|
||||||
|
#[derive(Debug, Clone, Serialize, Deserialize)]
|
||||||
|
pub struct QuestionWithAnswers {
|
||||||
|
pub question: Question,
|
||||||
|
pub answers: Vec<Answer>,
|
||||||
|
}
|
||||||
|
|
||||||
|
#[derive(Debug, Clone, Serialize, Deserialize)]
|
||||||
|
#[cfg_attr(feature = "ssr", derive(sqlx::FromRow))]
|
||||||
|
pub struct QuizSubmission {
|
||||||
|
pub id: i64,
|
||||||
|
pub quiz_id: i64,
|
||||||
|
pub first_name: String,
|
||||||
|
pub last_name: String,
|
||||||
|
pub score: i64,
|
||||||
|
pub total: i64,
|
||||||
|
pub submitted_at: DateTime<Utc>,
|
||||||
|
}
|
||||||
|
|
||||||
|
#[derive(Debug, Clone, Serialize, Deserialize)]
|
||||||
|
#[cfg_attr(feature = "ssr", derive(sqlx::FromRow))]
|
||||||
|
pub struct SubmissionAnswer {
|
||||||
|
pub id: i64,
|
||||||
|
pub submission_id: i64,
|
||||||
|
pub question_id: i64,
|
||||||
|
pub answer_id: i64,
|
||||||
|
pub correct: bool,
|
||||||
|
}
|
||||||
|
|
||||||
|
#[derive(Debug, Clone, Serialize, Deserialize)]
|
||||||
|
pub struct ResultDetail {
|
||||||
|
pub question_text: String,
|
||||||
|
pub section: String,
|
||||||
|
pub chosen_label: String,
|
||||||
|
pub chosen_text: String,
|
||||||
|
pub correct_label: String,
|
||||||
|
pub correct_text: String,
|
||||||
|
pub is_correct: bool,
|
||||||
|
}
|
||||||
|
|
||||||
|
#[derive(Debug, Clone, Serialize, Deserialize)]
|
||||||
|
#[cfg_attr(feature = "ssr", derive(sqlx::FromRow))]
|
||||||
|
pub struct Reset {
|
||||||
|
pub id: i64,
|
||||||
|
pub quiz_id: i64,
|
||||||
|
pub first_name: String,
|
||||||
|
pub last_name: String,
|
||||||
|
pub used: bool,
|
||||||
|
}
|
||||||
|
|
||||||
|
#[derive(Debug, Clone, Serialize, Deserialize)]
|
||||||
|
pub struct QuizStats {
|
||||||
|
pub total_submissions: i64,
|
||||||
|
pub average_score: f64,
|
||||||
|
pub average_pct: f64,
|
||||||
|
pub score_distribution: Vec<(i64, i64)>,
|
||||||
|
pub question_stats: Vec<QuestionStat>,
|
||||||
|
}
|
||||||
|
|
||||||
|
#[derive(Debug, Clone, Serialize, Deserialize)]
|
||||||
|
pub struct QuestionStat {
|
||||||
|
pub question_id: i64,
|
||||||
|
pub question_text: String,
|
||||||
|
pub section: String,
|
||||||
|
pub correct_count: i64,
|
||||||
|
pub total_count: i64,
|
||||||
|
pub success_rate: f64,
|
||||||
|
}
|
||||||
@@ -0,0 +1,123 @@
|
|||||||
|
use leptos::prelude::*;
|
||||||
|
use crate::server::{check_admin_valid, get_config, set_config};
|
||||||
|
|
||||||
|
#[component]
|
||||||
|
pub fn ConfigPage() -> impl IntoView {
|
||||||
|
let session = Resource::new(|| (), |_| check_admin_valid());
|
||||||
|
|
||||||
|
let session_pwd = RwSignal::new(String::new());
|
||||||
|
let admin_pwd = RwSignal::new(String::new());
|
||||||
|
let saved = RwSignal::new(false);
|
||||||
|
|
||||||
|
// Charge les valeurs actuelles
|
||||||
|
let current_session = Resource::new(|| (), |_| get_config("session_password".to_string()));
|
||||||
|
let current_admin = Resource::new(|| (), |_| get_config("admin_password".to_string()));
|
||||||
|
|
||||||
|
Effect::new(move |_| {
|
||||||
|
if let Some(Ok(v)) = current_session.get() {
|
||||||
|
session_pwd.set(v);
|
||||||
|
}
|
||||||
|
});
|
||||||
|
|
||||||
|
Effect::new(move |_| {
|
||||||
|
if let Some(Ok(v)) = current_admin.get() {
|
||||||
|
admin_pwd.set(v);
|
||||||
|
}
|
||||||
|
});
|
||||||
|
|
||||||
|
let save_action = Action::new(move |_: &()| {
|
||||||
|
let sp = session_pwd.get();
|
||||||
|
let ap = admin_pwd.get();
|
||||||
|
async move {
|
||||||
|
let _ = set_config("session_password".to_string(), sp).await;
|
||||||
|
let _ = set_config("admin_password".to_string(), ap).await;
|
||||||
|
saved.set(true);
|
||||||
|
}
|
||||||
|
});
|
||||||
|
|
||||||
|
view! {
|
||||||
|
<Suspense fallback=|| view! { <div class="admin-page"><p>"Vérification..."</p></div> }>
|
||||||
|
{move || session.get().map(|result| {
|
||||||
|
match result {
|
||||||
|
Ok(true) => view! {
|
||||||
|
<div class="admin-page">
|
||||||
|
<div class="admin-topbar">
|
||||||
|
<div>
|
||||||
|
<h1 style="
|
||||||
|
background:linear-gradient(135deg,#4F8EFF,#8B5CF6);
|
||||||
|
-webkit-background-clip:text;
|
||||||
|
-webkit-text-fill-color:transparent;
|
||||||
|
background-clip:text;
|
||||||
|
">"Configuration"</h1>
|
||||||
|
<p style="font-size:13px;color:var(--color-enuxia-muted);margin-top:2px;">
|
||||||
|
"Modifiez les codes d'accès sans recompiler l'application."
|
||||||
|
</p>
|
||||||
|
</div>
|
||||||
|
<div class="topbar-actions">
|
||||||
|
{move || saved.get().then(|| view! {
|
||||||
|
<span style="font-size:13px;font-weight:600;color:var(--color-enuxia-green);">
|
||||||
|
"✓ Sauvegardé"
|
||||||
|
</span>
|
||||||
|
})}
|
||||||
|
<a href="/admin" class="btn-ghost">"← Dashboard"</a>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
|
||||||
|
<div class="quiz-meta-card">
|
||||||
|
<div style="display:flex;flex-direction:column;gap:6px;">
|
||||||
|
<label class="field-label">"Code de session étudiant"</label>
|
||||||
|
<p style="font-size:12px;color:var(--color-enuxia-muted);">
|
||||||
|
"Les étudiants entrent ce code pour accéder aux quiz."
|
||||||
|
</p>
|
||||||
|
<input
|
||||||
|
type="text"
|
||||||
|
placeholder="Code de session"
|
||||||
|
prop:value=move || session_pwd.get()
|
||||||
|
on:input=move |e| {
|
||||||
|
session_pwd.set(event_target_value(&e));
|
||||||
|
saved.set(false);
|
||||||
|
}
|
||||||
|
/>
|
||||||
|
</div>
|
||||||
|
|
||||||
|
<div style="height:1px;background:var(--color-enuxia-border);"/>
|
||||||
|
|
||||||
|
<div style="display:flex;flex-direction:column;gap:6px;">
|
||||||
|
<label class="field-label">"Mot de passe administrateur"</label>
|
||||||
|
<p style="font-size:12px;color:var(--color-enuxia-muted);">
|
||||||
|
"Votre mot de passe pour accéder à l'interface d'administration."
|
||||||
|
</p>
|
||||||
|
<input
|
||||||
|
type="text"
|
||||||
|
placeholder="Mot de passe admin"
|
||||||
|
prop:value=move || admin_pwd.get()
|
||||||
|
on:input=move |e| {
|
||||||
|
admin_pwd.set(event_target_value(&e));
|
||||||
|
saved.set(false);
|
||||||
|
}
|
||||||
|
/>
|
||||||
|
<p style="font-size:12px;color:#f87171;">
|
||||||
|
"⚠ Attention : après modification, vous devrez vous reconnecter."
|
||||||
|
</p>
|
||||||
|
</div>
|
||||||
|
|
||||||
|
<div class="save-row">
|
||||||
|
<span/>
|
||||||
|
<button
|
||||||
|
class="btn-primary"
|
||||||
|
on:click=move |_| { save_action.dispatch(()); }
|
||||||
|
>
|
||||||
|
"Sauvegarder"
|
||||||
|
</button>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
}.into_any(),
|
||||||
|
_ => view! {
|
||||||
|
<script>"window.location.href='/admin/login';"</script>
|
||||||
|
}.into_any(),
|
||||||
|
}
|
||||||
|
})}
|
||||||
|
</Suspense>
|
||||||
|
}
|
||||||
|
}
|
||||||
@@ -0,0 +1,160 @@
|
|||||||
|
use leptos::prelude::*;
|
||||||
|
use leptos::web_sys;
|
||||||
|
use crate::server::{check_admin_valid, admin::{get_all_quizzes, delete_quiz}};
|
||||||
|
|
||||||
|
#[component]
|
||||||
|
pub fn DashboardPage() -> impl IntoView {
|
||||||
|
let session = Resource::new(|| (), |_| check_admin_valid());
|
||||||
|
let refresh = RwSignal::new(0u32);
|
||||||
|
|
||||||
|
let delete_action = Action::new(move |id: &i64| {
|
||||||
|
let id = *id;
|
||||||
|
async move {
|
||||||
|
let _ = delete_quiz(id).await;
|
||||||
|
refresh.update(|r| *r += 1);
|
||||||
|
}
|
||||||
|
});
|
||||||
|
|
||||||
|
let quizzes = Resource::new(
|
||||||
|
move || refresh.get(),
|
||||||
|
|_| get_all_quizzes()
|
||||||
|
);
|
||||||
|
|
||||||
|
view! {
|
||||||
|
<Suspense fallback=|| view! {
|
||||||
|
<div class="admin-page">
|
||||||
|
<p style="color:var(--color-enuxia-muted);">"Vérification..."</p>
|
||||||
|
</div>
|
||||||
|
}>
|
||||||
|
{move || session.get().map(|result| {
|
||||||
|
match result {
|
||||||
|
Ok(true) => view! {
|
||||||
|
<div class="admin-page">
|
||||||
|
|
||||||
|
// ── Topbar ───────────────────────────────────────
|
||||||
|
<div class="admin-topbar">
|
||||||
|
<div>
|
||||||
|
<h1 style="
|
||||||
|
background:linear-gradient(135deg,#4F8EFF,#8B5CF6);
|
||||||
|
-webkit-background-clip:text;
|
||||||
|
-webkit-text-fill-color:transparent;
|
||||||
|
background-clip:text;
|
||||||
|
">
|
||||||
|
"Quiz"
|
||||||
|
</h1>
|
||||||
|
<p style="font-size:13px;color:var(--color-enuxia-muted);margin-top:2px;">
|
||||||
|
"Gérez vos quiz et consultez les résultats."
|
||||||
|
</p>
|
||||||
|
</div>
|
||||||
|
<div class="topbar-actions">
|
||||||
|
<a href="/admin/config" class="btn-ghost">"⚙ Config"</a>
|
||||||
|
<a href="/admin/quiz/new" class="btn-green">
|
||||||
|
"+ Nouveau quiz"
|
||||||
|
</a>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
|
||||||
|
// ── Table ────────────────────────────────────────
|
||||||
|
<Suspense fallback=|| view! {
|
||||||
|
<p style="color:var(--color-enuxia-muted);font-size:14px;">
|
||||||
|
"Chargement..."
|
||||||
|
</p>
|
||||||
|
}>
|
||||||
|
{move || quizzes.get().map(|result| {
|
||||||
|
match result {
|
||||||
|
Ok(list) if list.is_empty() => view! {
|
||||||
|
<div style="
|
||||||
|
text-align:center; padding:60px 24px;
|
||||||
|
border-radius:16px;
|
||||||
|
background:var(--color-enuxia-dark-3);
|
||||||
|
border:1px solid var(--color-enuxia-border);
|
||||||
|
">
|
||||||
|
<p style="font-size:32px;margin-bottom:12px;">"📋"</p>
|
||||||
|
<p style="font-size:16px;font-weight:600;color:var(--color-enuxia-text);">
|
||||||
|
"Aucun quiz pour l'instant"
|
||||||
|
</p>
|
||||||
|
<p style="font-size:13px;color:var(--color-enuxia-muted);margin-top:4px;">
|
||||||
|
"Créez votre premier quiz pour commencer."
|
||||||
|
</p>
|
||||||
|
</div>
|
||||||
|
}.into_any(),
|
||||||
|
Ok(list) => view! {
|
||||||
|
<table class="data-table">
|
||||||
|
<thead>
|
||||||
|
<tr>
|
||||||
|
<th>"Titre"</th>
|
||||||
|
<th>"Description"</th>
|
||||||
|
<th>"Statut"</th>
|
||||||
|
<th>"Actions"</th>
|
||||||
|
</tr>
|
||||||
|
</thead>
|
||||||
|
<tbody>
|
||||||
|
{list.into_iter().map(|quiz| {
|
||||||
|
let qid = quiz.id;
|
||||||
|
view! {
|
||||||
|
<tr>
|
||||||
|
<td style="font-weight:600;">
|
||||||
|
{quiz.title.clone()}
|
||||||
|
</td>
|
||||||
|
<td style="color:var(--color-enuxia-muted);">
|
||||||
|
{quiz.description.clone()}
|
||||||
|
</td>
|
||||||
|
<td>
|
||||||
|
{if quiz.active {
|
||||||
|
view! {
|
||||||
|
<span class="badge-on">"Actif"</span>
|
||||||
|
}.into_any()
|
||||||
|
} else {
|
||||||
|
view! {
|
||||||
|
<span class="badge-off">"Inactif"</span>
|
||||||
|
}.into_any()
|
||||||
|
}}
|
||||||
|
</td>
|
||||||
|
<td>
|
||||||
|
<div class="table-actions">
|
||||||
|
<a href=format!("/admin/quiz/{}/edit", qid)
|
||||||
|
class="table-link">
|
||||||
|
"Éditer"
|
||||||
|
</a>
|
||||||
|
<a href=format!("/admin/quiz/{}/results", qid)
|
||||||
|
class="table-link">
|
||||||
|
"Résultats"
|
||||||
|
</a>
|
||||||
|
<button
|
||||||
|
class="btn-danger"
|
||||||
|
on:click=move |_| {
|
||||||
|
if web_sys::window()
|
||||||
|
.unwrap()
|
||||||
|
.confirm_with_message("Supprimer ce quiz et toutes ses données ?")
|
||||||
|
.unwrap_or(false)
|
||||||
|
{
|
||||||
|
delete_action.dispatch(qid);
|
||||||
|
}
|
||||||
|
}
|
||||||
|
>
|
||||||
|
"Supprimer"
|
||||||
|
</button>
|
||||||
|
</div>
|
||||||
|
</td>
|
||||||
|
</tr>
|
||||||
|
}
|
||||||
|
}).collect_view()}
|
||||||
|
</tbody>
|
||||||
|
</table>
|
||||||
|
}.into_any(),
|
||||||
|
Err(_) => view! {
|
||||||
|
<div class="field-error">"Erreur de chargement."</div>
|
||||||
|
}.into_any(),
|
||||||
|
}
|
||||||
|
})}
|
||||||
|
</Suspense>
|
||||||
|
</div>
|
||||||
|
}.into_any(),
|
||||||
|
_ => view! {
|
||||||
|
<script>"window.location.href='/admin/login';"</script>
|
||||||
|
}.into_any(),
|
||||||
|
}
|
||||||
|
})}
|
||||||
|
</Suspense>
|
||||||
|
}
|
||||||
|
}
|
||||||
@@ -0,0 +1,6 @@
|
|||||||
|
pub mod dashboard;
|
||||||
|
pub mod quiz_edit;
|
||||||
|
pub mod quiz_results;
|
||||||
|
pub mod quiz_stats;
|
||||||
|
pub mod student_detail;
|
||||||
|
pub mod config;
|
||||||
@@ -0,0 +1,324 @@
|
|||||||
|
use leptos::prelude::*;
|
||||||
|
use leptos::web_sys;
|
||||||
|
use leptos_router::hooks::use_params_map;
|
||||||
|
use crate::server::admin::*;
|
||||||
|
use crate::server::student::get_quiz_with_questions;
|
||||||
|
use crate::models::*;
|
||||||
|
|
||||||
|
#[component]
|
||||||
|
pub fn QuizEditPage() -> impl IntoView {
|
||||||
|
let params = use_params_map();
|
||||||
|
let quiz_id = move || params.get().get("quiz_id").and_then(|s| s.parse::<i64>().ok());
|
||||||
|
let is_new = move || quiz_id().is_none();
|
||||||
|
let title = RwSignal::new(String::new());
|
||||||
|
let description = RwSignal::new(String::new());
|
||||||
|
let active = RwSignal::new(true);
|
||||||
|
let shuffle_questions = RwSignal::new(false);
|
||||||
|
let shuffle_answers = RwSignal::new(false);
|
||||||
|
let time_limit = RwSignal::new(Option::<i64>::None);
|
||||||
|
let saved_quiz_id = RwSignal::new(Option::<i64>::None);
|
||||||
|
let questions = RwSignal::new(Vec::<QuestionWithAnswers>::new());
|
||||||
|
let saved_notice = RwSignal::new(false);
|
||||||
|
|
||||||
|
let existing = Resource::new(quiz_id, |id| async move {
|
||||||
|
match id {
|
||||||
|
Some(id) => get_quiz_with_questions(id).await,
|
||||||
|
None => Ok(None),
|
||||||
|
}
|
||||||
|
});
|
||||||
|
|
||||||
|
Effect::new(move |_| {
|
||||||
|
if let Some(Ok(Some((quiz, qs)))) = existing.get() {
|
||||||
|
title.set(quiz.title.clone());
|
||||||
|
description.set(quiz.description.clone());
|
||||||
|
active.set(quiz.active);
|
||||||
|
shuffle_questions.set(quiz.shuffle_questions);
|
||||||
|
shuffle_answers.set(quiz.shuffle_answers);
|
||||||
|
time_limit.set(quiz.time_limit_seconds);
|
||||||
|
saved_quiz_id.set(Some(quiz.id));
|
||||||
|
questions.set(qs);
|
||||||
|
}
|
||||||
|
});
|
||||||
|
|
||||||
|
let save_quiz = Action::new(move |_: &()| {
|
||||||
|
let t = title.get();
|
||||||
|
let d = description.get();
|
||||||
|
let a = active.get();
|
||||||
|
let sq = shuffle_questions.get();
|
||||||
|
let sa = shuffle_answers.get();
|
||||||
|
let tl = time_limit.get();
|
||||||
|
async move {
|
||||||
|
match saved_quiz_id.get() {
|
||||||
|
Some(id) => { let _ = update_quiz(id, t, d, a, sq, sa, tl).await; }
|
||||||
|
None => {
|
||||||
|
if let Ok(id) = create_quiz(t, d).await {
|
||||||
|
saved_quiz_id.set(Some(id));
|
||||||
|
}
|
||||||
|
}
|
||||||
|
}
|
||||||
|
saved_notice.set(true);
|
||||||
|
}
|
||||||
|
});
|
||||||
|
|
||||||
|
let add_question_action = Action::new(move |_: &()| {
|
||||||
|
let qid = saved_quiz_id.get();
|
||||||
|
async move {
|
||||||
|
let Some(quiz_id) = qid else { return };
|
||||||
|
let pos = questions.get().len() as i64;
|
||||||
|
if let Ok(id) = add_question(quiz_id, String::new(), String::new(), pos).await {
|
||||||
|
for label in ["A", "B", "C", "D"] {
|
||||||
|
let _ = add_answer(id, label.to_string(), String::new(), false).await;
|
||||||
|
}
|
||||||
|
if let Ok(Some((_, qs))) = get_quiz_with_questions(quiz_id).await {
|
||||||
|
questions.set(qs);
|
||||||
|
}
|
||||||
|
}
|
||||||
|
}
|
||||||
|
});
|
||||||
|
|
||||||
|
view! {
|
||||||
|
<div class="admin-page">
|
||||||
|
|
||||||
|
// ── Topbar ───────────────────────────────────────────────────────
|
||||||
|
<div class="admin-topbar">
|
||||||
|
<div>
|
||||||
|
<h1 style="
|
||||||
|
background:linear-gradient(135deg,#4F8EFF,#8B5CF6);
|
||||||
|
-webkit-background-clip:text;
|
||||||
|
-webkit-text-fill-color:transparent;
|
||||||
|
background-clip:text;
|
||||||
|
">
|
||||||
|
{move || if is_new() { "Nouveau quiz" } else { "Éditer le quiz" }}
|
||||||
|
</h1>
|
||||||
|
</div>
|
||||||
|
<div class="topbar-actions">
|
||||||
|
{move || saved_notice.get().then(|| view! {
|
||||||
|
<span style="font-size:13px;font-weight:600;color:var(--color-enuxia-green);">
|
||||||
|
"✓ Sauvegardé"
|
||||||
|
</span>
|
||||||
|
})}
|
||||||
|
<a href="/admin" class="btn-ghost">"← Dashboard"</a>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
|
||||||
|
// ── Infos du quiz ────────────────────────────────────────────────
|
||||||
|
<div class="quiz-meta-card">
|
||||||
|
<input
|
||||||
|
type="text"
|
||||||
|
placeholder="Titre du quiz"
|
||||||
|
prop:value=move || title.get()
|
||||||
|
on:input=move |e| title.set(event_target_value(&e))
|
||||||
|
/>
|
||||||
|
<textarea
|
||||||
|
placeholder="Description (optionnelle)"
|
||||||
|
prop:value=move || description.get()
|
||||||
|
on:input=move |e| description.set(event_target_value(&e))
|
||||||
|
/>
|
||||||
|
|
||||||
|
// ── Options avancées ─────────────────────────────────────────
|
||||||
|
<div style="display:flex;flex-direction:column;gap:10px;padding-top:8px;border-top:1px solid var(--color-enuxia-border);">
|
||||||
|
<label class="checkbox-row">
|
||||||
|
<input
|
||||||
|
type="checkbox"
|
||||||
|
prop:checked=move || active.get()
|
||||||
|
on:change=move |e| {
|
||||||
|
let target = event_target::<web_sys::HtmlInputElement>(&e);
|
||||||
|
active.set(target.checked());
|
||||||
|
}
|
||||||
|
/>
|
||||||
|
"Quiz actif — visible par les étudiants"
|
||||||
|
</label>
|
||||||
|
<label class="checkbox-row">
|
||||||
|
<input
|
||||||
|
type="checkbox"
|
||||||
|
prop:checked=move || shuffle_questions.get()
|
||||||
|
on:change=move |e| {
|
||||||
|
let target = event_target::<web_sys::HtmlInputElement>(&e);
|
||||||
|
shuffle_questions.set(target.checked());
|
||||||
|
}
|
||||||
|
/>
|
||||||
|
"Ordre des questions aléatoire"
|
||||||
|
</label>
|
||||||
|
<label class="checkbox-row">
|
||||||
|
<input
|
||||||
|
type="checkbox"
|
||||||
|
prop:checked=move || shuffle_answers.get()
|
||||||
|
on:change=move |e| {
|
||||||
|
let target = event_target::<web_sys::HtmlInputElement>(&e);
|
||||||
|
shuffle_answers.set(target.checked());
|
||||||
|
}
|
||||||
|
/>
|
||||||
|
"Ordre des réponses aléatoire"
|
||||||
|
</label>
|
||||||
|
|
||||||
|
// ── Minuteur ─────────────────────────────────────────────
|
||||||
|
<div style="display:flex;align-items:center;gap:12px;">
|
||||||
|
<label class="checkbox-row" style="white-space:nowrap;">
|
||||||
|
<input
|
||||||
|
type="checkbox"
|
||||||
|
prop:checked=move || time_limit.get().is_some()
|
||||||
|
on:change=move |e| {
|
||||||
|
let target = event_target::<web_sys::HtmlInputElement>(&e);
|
||||||
|
if target.checked() {
|
||||||
|
time_limit.set(Some(600));
|
||||||
|
} else {
|
||||||
|
time_limit.set(None);
|
||||||
|
}
|
||||||
|
}
|
||||||
|
/>
|
||||||
|
"Activer un minuteur"
|
||||||
|
</label>
|
||||||
|
{move || time_limit.get().map(|_secs| view! {
|
||||||
|
<div style="display:flex;align-items:center;gap:8px;">
|
||||||
|
<input
|
||||||
|
type="number"
|
||||||
|
placeholder="Secondes"
|
||||||
|
style="width:100px;"
|
||||||
|
prop:value=move || time_limit.get().unwrap_or(600).to_string()
|
||||||
|
on:input=move |e| {
|
||||||
|
let v = event_target_value(&e)
|
||||||
|
.parse::<i64>()
|
||||||
|
.unwrap_or(600);
|
||||||
|
time_limit.set(Some(v));
|
||||||
|
}
|
||||||
|
/>
|
||||||
|
<span style="font-size:13px;color:var(--color-enuxia-muted);">
|
||||||
|
{move || {
|
||||||
|
let s = time_limit.get().unwrap_or(0);
|
||||||
|
format!("= {}min {}s", s / 60, s % 60)
|
||||||
|
}}
|
||||||
|
</span>
|
||||||
|
</div>
|
||||||
|
})}
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
|
||||||
|
<div class="save-row">
|
||||||
|
<span/>
|
||||||
|
<button
|
||||||
|
class="btn-primary"
|
||||||
|
on:click=move |_| { save_quiz.dispatch(()); }
|
||||||
|
>
|
||||||
|
{move || if is_new() { "Créer le quiz" } else { "Sauvegarder" }}
|
||||||
|
</button>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
|
||||||
|
// ── Questions ────────────────────────────────────────────────────
|
||||||
|
{move || saved_quiz_id.get().map(|_| view! {
|
||||||
|
<div class="quiz-editor">
|
||||||
|
<div class="questions-header">
|
||||||
|
<h2>"Questions"</h2>
|
||||||
|
<button
|
||||||
|
class="btn-green"
|
||||||
|
on:click=move |_| { add_question_action.dispatch(()); }
|
||||||
|
>
|
||||||
|
"+ Ajouter une question"
|
||||||
|
</button>
|
||||||
|
</div>
|
||||||
|
|
||||||
|
{move || questions.get().into_iter().enumerate().map(|(idx, qwa)| {
|
||||||
|
let q_id = qwa.question.id;
|
||||||
|
let q_text = RwSignal::new(qwa.question.text.clone());
|
||||||
|
let q_section = RwSignal::new(qwa.question.section.clone());
|
||||||
|
let answers = StoredValue::new(qwa.answers.clone());
|
||||||
|
|
||||||
|
view! {
|
||||||
|
<div class="question-card">
|
||||||
|
<div class="qcard-header">
|
||||||
|
<span class="q-badge">{format!("Q{}", idx + 1)}</span>
|
||||||
|
<button
|
||||||
|
class="btn-danger"
|
||||||
|
on:click=move |_| {
|
||||||
|
let qid_saved = saved_quiz_id.get();
|
||||||
|
leptos::task::spawn_local(async move {
|
||||||
|
let _ = delete_question(q_id).await;
|
||||||
|
if let Some(qzid) = qid_saved {
|
||||||
|
if let Ok(Some((_, qs))) = get_quiz_with_questions(qzid).await {
|
||||||
|
questions.set(qs);
|
||||||
|
}
|
||||||
|
}
|
||||||
|
});
|
||||||
|
}
|
||||||
|
>"✕ Supprimer"</button>
|
||||||
|
</div>
|
||||||
|
|
||||||
|
<input
|
||||||
|
type="text"
|
||||||
|
placeholder="Section (ex: Cours 1 — Interopérabilité)"
|
||||||
|
prop:value=move || q_section.get()
|
||||||
|
on:input=move |e| q_section.set(event_target_value(&e))
|
||||||
|
on:blur=move |_| {
|
||||||
|
let t = q_text.get();
|
||||||
|
let s = q_section.get();
|
||||||
|
leptos::task::spawn_local(async move {
|
||||||
|
let _ = update_question(q_id, t, s, idx as i64).await;
|
||||||
|
});
|
||||||
|
}
|
||||||
|
/>
|
||||||
|
<input
|
||||||
|
type="text"
|
||||||
|
placeholder="Texte de la question"
|
||||||
|
prop:value=move || q_text.get()
|
||||||
|
on:input=move |e| q_text.set(event_target_value(&e))
|
||||||
|
on:blur=move |_| {
|
||||||
|
let t = q_text.get();
|
||||||
|
let s = q_section.get();
|
||||||
|
leptos::task::spawn_local(async move {
|
||||||
|
let _ = update_question(q_id, t, s, idx as i64).await;
|
||||||
|
});
|
||||||
|
}
|
||||||
|
/>
|
||||||
|
|
||||||
|
<div class="answers-editor">
|
||||||
|
{answers.get_value().into_iter().map(|answer| {
|
||||||
|
let a_id = answer.id;
|
||||||
|
let a_text = RwSignal::new(answer.text.clone());
|
||||||
|
let a_correct = RwSignal::new(answer.correct);
|
||||||
|
let a_label = StoredValue::new(answer.label.clone());
|
||||||
|
|
||||||
|
view! {
|
||||||
|
<div class="answer-editor-row">
|
||||||
|
<span class="answer-letter">{answer.label.clone()}</span>
|
||||||
|
<input
|
||||||
|
type="text"
|
||||||
|
placeholder=format!("Réponse {}", answer.label.clone())
|
||||||
|
prop:value=move || a_text.get()
|
||||||
|
on:input=move |e| a_text.set(event_target_value(&e))
|
||||||
|
on:blur=move |_| {
|
||||||
|
let t = a_text.get();
|
||||||
|
let c = a_correct.get();
|
||||||
|
let lbl = a_label.get_value();
|
||||||
|
leptos::task::spawn_local(async move {
|
||||||
|
let _ = update_answer(a_id, lbl, t, c).await;
|
||||||
|
});
|
||||||
|
}
|
||||||
|
/>
|
||||||
|
<label class="radio-correct">
|
||||||
|
<input
|
||||||
|
type="radio"
|
||||||
|
name=format!("correct-{}", q_id)
|
||||||
|
prop:checked=move || a_correct.get()
|
||||||
|
on:change=move |_| {
|
||||||
|
let t = a_text.get();
|
||||||
|
let lbl = a_label.get_value();
|
||||||
|
leptos::task::spawn_local(async move {
|
||||||
|
let _ = update_answer(a_id, lbl, t, true).await;
|
||||||
|
});
|
||||||
|
a_correct.set(true);
|
||||||
|
}
|
||||||
|
/>
|
||||||
|
"Correcte"
|
||||||
|
</label>
|
||||||
|
</div>
|
||||||
|
}
|
||||||
|
}).collect_view()}
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
}
|
||||||
|
}).collect_view()}
|
||||||
|
</div>
|
||||||
|
})}
|
||||||
|
</div>
|
||||||
|
}
|
||||||
|
}
|
||||||
@@ -0,0 +1,135 @@
|
|||||||
|
use leptos::prelude::*;
|
||||||
|
use leptos_router::hooks::use_params_map;
|
||||||
|
use crate::server::admin::{get_quiz_submissions, export_submissions_csv};
|
||||||
|
|
||||||
|
#[component]
|
||||||
|
pub fn QuizResultsPage() -> impl IntoView {
|
||||||
|
let params = use_params_map();
|
||||||
|
let quiz_id = move || params.get().get("quiz_id").and_then(|s| s.parse::<i64>().ok()).unwrap_or(0);
|
||||||
|
let submissions = Resource::new(quiz_id, |id| get_quiz_submissions(id));
|
||||||
|
let csv_data = RwSignal::new(Option::<String>::None);
|
||||||
|
|
||||||
|
let export_action = Action::new(move |_: &()| {
|
||||||
|
let id = quiz_id();
|
||||||
|
async move {
|
||||||
|
if let Ok(csv) = export_submissions_csv(id).await {
|
||||||
|
csv_data.set(Some(csv));
|
||||||
|
}
|
||||||
|
}
|
||||||
|
});
|
||||||
|
|
||||||
|
view! {
|
||||||
|
<div class="admin-page">
|
||||||
|
<div class="admin-topbar">
|
||||||
|
<div>
|
||||||
|
<h1 style="
|
||||||
|
background:linear-gradient(135deg,#4F8EFF,#8B5CF6);
|
||||||
|
-webkit-background-clip:text;
|
||||||
|
-webkit-text-fill-color:transparent;
|
||||||
|
background-clip:text;
|
||||||
|
">"Résultats"</h1>
|
||||||
|
<p style="font-size:13px;color:var(--color-enuxia-muted);margin-top:2px;">
|
||||||
|
"Liste des soumissions pour ce quiz."
|
||||||
|
</p>
|
||||||
|
</div>
|
||||||
|
<div class="topbar-actions">
|
||||||
|
<button
|
||||||
|
class="btn-purple"
|
||||||
|
on:click=move |_| { export_action.dispatch(()); }
|
||||||
|
>
|
||||||
|
"↓ Exporter CSV"
|
||||||
|
</button>
|
||||||
|
<a href=move || format!("/admin/quiz/{}/stats", quiz_id())
|
||||||
|
class="btn-ghost">"📊 Stats"</a>
|
||||||
|
<a href="/admin" class="btn-ghost">"← Dashboard"</a>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
|
||||||
|
// CSV export
|
||||||
|
{move || csv_data.get().map(|csv| view! {
|
||||||
|
<div class="csv-box">
|
||||||
|
<p>"✓ CSV généré — copiez le contenu ci-dessous"</p>
|
||||||
|
<textarea readonly rows="8">{csv}</textarea>
|
||||||
|
</div>
|
||||||
|
})}
|
||||||
|
|
||||||
|
<Suspense fallback=|| view! {
|
||||||
|
<p style="color:var(--color-enuxia-muted);font-size:14px;">"Chargement..."</p>
|
||||||
|
}>
|
||||||
|
{move || submissions.get().map(|result| {
|
||||||
|
match result {
|
||||||
|
Ok(list) if list.is_empty() => view! {
|
||||||
|
<div style="
|
||||||
|
text-align:center; padding:60px 24px;
|
||||||
|
border-radius:16px;
|
||||||
|
background:var(--color-enuxia-dark-3);
|
||||||
|
border:1px solid var(--color-enuxia-border);
|
||||||
|
">
|
||||||
|
<p style="font-size:32px;margin-bottom:12px;">"📭"</p>
|
||||||
|
<p style="font-size:16px;font-weight:600;color:var(--color-enuxia-text);">
|
||||||
|
"Aucune soumission"
|
||||||
|
</p>
|
||||||
|
<p style="font-size:13px;color:var(--color-enuxia-muted);margin-top:4px;">
|
||||||
|
"Les résultats apparaîtront ici quand des étudiants auront passé le quiz."
|
||||||
|
</p>
|
||||||
|
</div>
|
||||||
|
}.into_any(),
|
||||||
|
Ok(list) => view! {
|
||||||
|
<table class="data-table">
|
||||||
|
<thead>
|
||||||
|
<tr>
|
||||||
|
<th>"Nom"</th>
|
||||||
|
<th>"Prénom"</th>
|
||||||
|
<th>"Score"</th>
|
||||||
|
<th>"%"</th>
|
||||||
|
<th>"Date"</th>
|
||||||
|
<th>"Détail"</th>
|
||||||
|
</tr>
|
||||||
|
</thead>
|
||||||
|
<tbody>
|
||||||
|
{list.into_iter().map(|s| {
|
||||||
|
let pct = if s.total > 0 {
|
||||||
|
(s.score * 100) / s.total
|
||||||
|
} else { 0 };
|
||||||
|
let sid = s.id;
|
||||||
|
|
||||||
|
let pct_color = if pct >= 80 { "#22C55E" }
|
||||||
|
else if pct >= 50 { "#4F8EFF" }
|
||||||
|
else { "#f87171" };
|
||||||
|
|
||||||
|
view! {
|
||||||
|
<tr>
|
||||||
|
<td style="font-weight:600;">{s.last_name.clone()}</td>
|
||||||
|
<td>{s.first_name.clone()}</td>
|
||||||
|
<td>{format!("{} / {}", s.score, s.total)}</td>
|
||||||
|
<td>
|
||||||
|
<span style=format!(
|
||||||
|
"font-weight:700;color:{};", pct_color
|
||||||
|
)>
|
||||||
|
{format!("{}%", pct)}
|
||||||
|
</span>
|
||||||
|
</td>
|
||||||
|
<td style="color:var(--color-enuxia-muted);font-size:13px;">
|
||||||
|
{s.submitted_at.format("%d/%m/%Y %H:%M").to_string()}
|
||||||
|
</td>
|
||||||
|
<td>
|
||||||
|
<a href=format!("/admin/submission/{}", sid)
|
||||||
|
class="table-link">
|
||||||
|
"Voir →"
|
||||||
|
</a>
|
||||||
|
</td>
|
||||||
|
</tr>
|
||||||
|
}
|
||||||
|
}).collect_view()}
|
||||||
|
</tbody>
|
||||||
|
</table>
|
||||||
|
}.into_any(),
|
||||||
|
Err(_) => view! {
|
||||||
|
<div class="field-error">"Erreur de chargement."</div>
|
||||||
|
}.into_any(),
|
||||||
|
}
|
||||||
|
})}
|
||||||
|
</Suspense>
|
||||||
|
</div>
|
||||||
|
}
|
||||||
|
}
|
||||||
@@ -0,0 +1,320 @@
|
|||||||
|
use leptos::prelude::*;
|
||||||
|
use leptos_router::hooks::use_params_map;
|
||||||
|
use crate::server::admin::{get_quiz_stats, reset_student, get_quiz_submissions};
|
||||||
|
|
||||||
|
#[component]
|
||||||
|
pub fn QuizStatsPage() -> impl IntoView {
|
||||||
|
let params = use_params_map();
|
||||||
|
let quiz_id = move || {
|
||||||
|
params.get().get("quiz_id")
|
||||||
|
.and_then(|s| s.parse::<i64>().ok())
|
||||||
|
.unwrap_or(0)
|
||||||
|
};
|
||||||
|
|
||||||
|
let stats = Resource::new(quiz_id, |id| get_quiz_stats(id));
|
||||||
|
let submissions = Resource::new(quiz_id, |id| get_quiz_submissions(id));
|
||||||
|
let refresh = RwSignal::new(0u32);
|
||||||
|
|
||||||
|
let reset_fn = RwSignal::new(String::new());
|
||||||
|
let reset_ln = RwSignal::new(String::new());
|
||||||
|
let reset_msg = RwSignal::new(Option::<String>::None);
|
||||||
|
|
||||||
|
let reset_action = Action::new(move |_: &()| {
|
||||||
|
let fn_ = reset_fn.get();
|
||||||
|
let ln = reset_ln.get();
|
||||||
|
let qid = quiz_id();
|
||||||
|
async move {
|
||||||
|
match reset_student(qid, fn_.clone(), ln.clone()).await {
|
||||||
|
Ok(_) => {
|
||||||
|
reset_msg.set(Some(format!("✓ {} {} peut repasser le quiz.", fn_, ln)));
|
||||||
|
reset_fn.set(String::new());
|
||||||
|
reset_ln.set(String::new());
|
||||||
|
refresh.update(|r| *r += 1);
|
||||||
|
}
|
||||||
|
Err(e) => {
|
||||||
|
reset_msg.set(Some(format!("Erreur : {}", e)));
|
||||||
|
}
|
||||||
|
}
|
||||||
|
}
|
||||||
|
});
|
||||||
|
|
||||||
|
// Recharge les soumissions quand refresh change
|
||||||
|
let submissions = Resource::new(
|
||||||
|
move || refresh.get(),
|
||||||
|
move |_| get_quiz_submissions(quiz_id())
|
||||||
|
);
|
||||||
|
|
||||||
|
view! {
|
||||||
|
<div class="admin-page">
|
||||||
|
<div class="admin-topbar">
|
||||||
|
<div>
|
||||||
|
<h1 style="
|
||||||
|
background:linear-gradient(135deg,#4F8EFF,#8B5CF6);
|
||||||
|
-webkit-background-clip:text;
|
||||||
|
-webkit-text-fill-color:transparent;
|
||||||
|
background-clip:text;
|
||||||
|
">"Statistiques"</h1>
|
||||||
|
<p style="font-size:13px;color:var(--color-enuxia-muted);margin-top:2px;">
|
||||||
|
"Analyse des résultats et gestion des étudiants."
|
||||||
|
</p>
|
||||||
|
</div>
|
||||||
|
<div class="topbar-actions">
|
||||||
|
<a href=move || format!("/admin/quiz/{}/results", quiz_id())
|
||||||
|
class="btn-ghost">"← Résultats"</a>
|
||||||
|
<a href="/admin" class="btn-ghost">"Dashboard"</a>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
|
||||||
|
<Suspense fallback=|| view! {
|
||||||
|
<p style="color:var(--color-enuxia-muted);">"Chargement..."</p>
|
||||||
|
}>
|
||||||
|
{move || stats.get().map(|result| {
|
||||||
|
match result {
|
||||||
|
Ok(s) if s.total_submissions == 0 => view! {
|
||||||
|
<div style="
|
||||||
|
text-align:center;padding:60px;
|
||||||
|
border-radius:16px;
|
||||||
|
background:var(--color-enuxia-dark-3);
|
||||||
|
border:1px solid var(--color-enuxia-border);
|
||||||
|
">
|
||||||
|
<p style="font-size:32px;margin-bottom:8px;">"📊"</p>
|
||||||
|
<p style="font-weight:600;color:var(--color-enuxia-text);">
|
||||||
|
"Aucune soumission pour l'instant."
|
||||||
|
</p>
|
||||||
|
</div>
|
||||||
|
}.into_any(),
|
||||||
|
Ok(s) => view! {
|
||||||
|
<div style="display:flex;flex-direction:column;gap:24px;">
|
||||||
|
|
||||||
|
// ── Chiffres clés ─────────────────────────────
|
||||||
|
<div style="
|
||||||
|
display:grid;
|
||||||
|
grid-template-columns:repeat(3,1fr);
|
||||||
|
gap:16px;
|
||||||
|
">
|
||||||
|
<div class="quiz-meta-card" style="text-align:center;">
|
||||||
|
<p style="font-size:11px;font-weight:700;letter-spacing:0.1em;text-transform:uppercase;color:var(--color-enuxia-muted);">
|
||||||
|
"Soumissions"
|
||||||
|
</p>
|
||||||
|
<p style="font-size:40px;font-weight:800;font-family:'Space Grotesk',sans-serif;color:var(--color-enuxia-blue);">
|
||||||
|
{s.total_submissions}
|
||||||
|
</p>
|
||||||
|
</div>
|
||||||
|
<div class="quiz-meta-card" style="text-align:center;">
|
||||||
|
<p style="font-size:11px;font-weight:700;letter-spacing:0.1em;text-transform:uppercase;color:var(--color-enuxia-muted);">
|
||||||
|
"Score moyen"
|
||||||
|
</p>
|
||||||
|
<p style="font-size:40px;font-weight:800;font-family:'Space Grotesk',sans-serif;color:var(--color-enuxia-purple);">
|
||||||
|
{format!("{:.1}", s.average_score)}
|
||||||
|
</p>
|
||||||
|
</div>
|
||||||
|
<div class="quiz-meta-card" style="text-align:center;">
|
||||||
|
<p style="font-size:11px;font-weight:700;letter-spacing:0.1em;text-transform:uppercase;color:var(--color-enuxia-muted);">
|
||||||
|
"Moyenne"
|
||||||
|
</p>
|
||||||
|
<p style=format!(
|
||||||
|
"font-size:40px;font-weight:800;font-family:'Space Grotesk',sans-serif;color:{};",
|
||||||
|
if s.average_pct >= 80.0 { "#22C55E" }
|
||||||
|
else if s.average_pct >= 50.0 { "#4F8EFF" }
|
||||||
|
else { "#f87171" }
|
||||||
|
)>
|
||||||
|
{format!("{:.0}%", s.average_pct)}
|
||||||
|
</p>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
|
||||||
|
// ── Distribution des scores ───────────────────
|
||||||
|
{if !s.score_distribution.is_empty() {
|
||||||
|
let max_count = s.score_distribution.iter().map(|(_, c)| *c).max().unwrap_or(1);
|
||||||
|
view! {
|
||||||
|
<div class="quiz-meta-card">
|
||||||
|
<h2 style="font-size:16px;font-weight:700;margin-bottom:16px;">
|
||||||
|
"Distribution des scores"
|
||||||
|
</h2>
|
||||||
|
<div style="display:flex;align-items:flex-end;gap:8px;height:80px;">
|
||||||
|
{s.score_distribution.into_iter().map(|(score, count)| {
|
||||||
|
let pct = (count as f64 / max_count as f64 * 100.0) as i64;
|
||||||
|
view! {
|
||||||
|
<div style="display:flex;flex-direction:column;align-items:center;gap:4px;flex:1;">
|
||||||
|
<span style="font-size:11px;color:var(--color-enuxia-muted);">
|
||||||
|
{count}
|
||||||
|
</span>
|
||||||
|
<div style=format!(
|
||||||
|
"width:100%;background:var(--color-enuxia-blue);
|
||||||
|
border-radius:4px 4px 0 0;height:{}px;
|
||||||
|
opacity:0.8;min-height:4px;",
|
||||||
|
(pct * 60) / 100
|
||||||
|
)/>
|
||||||
|
<span style="font-size:11px;font-weight:600;color:var(--color-enuxia-text);">
|
||||||
|
{score}
|
||||||
|
</span>
|
||||||
|
</div>
|
||||||
|
}
|
||||||
|
}).collect_view()}
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
}.into_any()
|
||||||
|
} else {
|
||||||
|
view! { <span/> }.into_any()
|
||||||
|
}}
|
||||||
|
|
||||||
|
// ── Stats par question ────────────────────────
|
||||||
|
<div class="quiz-meta-card">
|
||||||
|
<h2 style="font-size:16px;font-weight:700;margin-bottom:16px;">
|
||||||
|
"Taux de réussite par question"
|
||||||
|
</h2>
|
||||||
|
<div style="display:flex;flex-direction:column;gap:12px;">
|
||||||
|
{s.question_stats.into_iter().enumerate().map(|(idx, qs)| {
|
||||||
|
let color = if qs.success_rate >= 80.0 { "#22C55E" }
|
||||||
|
else if qs.success_rate >= 50.0 { "#4F8EFF" }
|
||||||
|
else { "#f87171" };
|
||||||
|
view! {
|
||||||
|
<div style="display:flex;flex-direction:column;gap:6px;">
|
||||||
|
<div style="display:flex;align-items:center;justify-content:space-between;gap:12px;">
|
||||||
|
<div style="display:flex;align-items:center;gap:8px;min-width:0;">
|
||||||
|
<span style="
|
||||||
|
font-size:10px;font-weight:700;
|
||||||
|
padding:2px 8px;border-radius:4px;
|
||||||
|
background:rgba(139,92,246,0.1);
|
||||||
|
color:#8B5CF6;flex-shrink:0;
|
||||||
|
">
|
||||||
|
{format!("Q{}", idx + 1)}
|
||||||
|
</span>
|
||||||
|
<span style="
|
||||||
|
font-size:13px;color:var(--color-enuxia-text);
|
||||||
|
overflow:hidden;text-overflow:ellipsis;
|
||||||
|
white-space:nowrap;
|
||||||
|
">
|
||||||
|
{qs.question_text.clone()}
|
||||||
|
</span>
|
||||||
|
</div>
|
||||||
|
<span style=format!(
|
||||||
|
"font-size:13px;font-weight:700;color:{};flex-shrink:0;",
|
||||||
|
color
|
||||||
|
)>
|
||||||
|
{format!("{:.0}% ({}/{})", qs.success_rate, qs.correct_count, qs.total_count)}
|
||||||
|
</span>
|
||||||
|
</div>
|
||||||
|
// Barre de progression
|
||||||
|
<div style="height:4px;border-radius:99px;background:var(--color-enuxia-border);">
|
||||||
|
<div style=format!(
|
||||||
|
"height:100%;border-radius:99px;width:{:.0}%;background:{};transition:width 0.4s;",
|
||||||
|
qs.success_rate, color
|
||||||
|
)/>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
}
|
||||||
|
}).collect_view()}
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
}.into_any(),
|
||||||
|
Err(e) => view! {
|
||||||
|
<div class="field-error">{e.to_string()}</div>
|
||||||
|
}.into_any(),
|
||||||
|
}
|
||||||
|
})}
|
||||||
|
</Suspense>
|
||||||
|
|
||||||
|
// ── Reset étudiant ────────────────────────────────────────────────
|
||||||
|
<div class="quiz-meta-card">
|
||||||
|
<h2 style="font-size:16px;font-weight:700;">"Réinitialiser un étudiant"</h2>
|
||||||
|
<p style="font-size:13px;color:var(--color-enuxia-muted);">
|
||||||
|
"Permet à un étudiant de repasser le quiz. Sa soumission existante sera supprimée."
|
||||||
|
</p>
|
||||||
|
|
||||||
|
<div style="display:flex;gap:10px;flex-wrap:wrap;">
|
||||||
|
<input
|
||||||
|
type="text"
|
||||||
|
placeholder="Prénom"
|
||||||
|
style="flex:1;min-width:140px;"
|
||||||
|
prop:value=move || reset_fn.get()
|
||||||
|
on:input=move |e| reset_fn.set(event_target_value(&e))
|
||||||
|
/>
|
||||||
|
<input
|
||||||
|
type="text"
|
||||||
|
placeholder="Nom"
|
||||||
|
style="flex:1;min-width:140px;"
|
||||||
|
prop:value=move || reset_ln.get()
|
||||||
|
on:input=move |e| reset_ln.set(event_target_value(&e))
|
||||||
|
/>
|
||||||
|
<button
|
||||||
|
class="btn-danger"
|
||||||
|
style="padding:10px 20px;font-size:14px;"
|
||||||
|
on:click=move |_| {
|
||||||
|
if !reset_fn.get().is_empty() && !reset_ln.get().is_empty() {
|
||||||
|
reset_action.dispatch(());
|
||||||
|
}
|
||||||
|
}
|
||||||
|
>
|
||||||
|
"Réinitialiser"
|
||||||
|
</button>
|
||||||
|
</div>
|
||||||
|
|
||||||
|
{move || reset_msg.get().map(|msg| {
|
||||||
|
let style_class = if msg.starts_with("✓") {
|
||||||
|
"background:rgba(34,197,94,0.1);color:#22C55E;border:1px solid rgba(34,197,94,0.2);"
|
||||||
|
} else {
|
||||||
|
"background:rgba(239,68,68,0.1);color:#f87171;border:1px solid rgba(239,68,68,0.2);"
|
||||||
|
};
|
||||||
|
view! {
|
||||||
|
<p style=format!(
|
||||||
|
"font-size:13px;font-weight:600;padding:10px 14px;border-radius:8px;{}",
|
||||||
|
style_class
|
||||||
|
)>
|
||||||
|
{msg}
|
||||||
|
</p>
|
||||||
|
}
|
||||||
|
})}
|
||||||
|
|
||||||
|
// Liste des soumissions pour faciliter le reset
|
||||||
|
<Suspense fallback=|| view! { <span/> }>
|
||||||
|
{move || submissions.get().map(|result| {
|
||||||
|
match result {
|
||||||
|
Ok(list) if !list.is_empty() => view! {
|
||||||
|
<div style="margin-top:8px;">
|
||||||
|
<p style="font-size:12px;font-weight:600;letter-spacing:0.06em;text-transform:uppercase;color:var(--color-enuxia-muted);margin-bottom:8px;">
|
||||||
|
"Soumissions existantes"
|
||||||
|
</p>
|
||||||
|
<div style="display:flex;flex-direction:column;gap:6px;">
|
||||||
|
{list.into_iter().map(|s| {
|
||||||
|
let fn_ = s.first_name.clone();
|
||||||
|
let ln = s.last_name.clone();
|
||||||
|
let fn2 = fn_.clone();
|
||||||
|
let ln2 = ln.clone();
|
||||||
|
let pct = if s.total > 0 { (s.score * 100) / s.total } else { 0 };
|
||||||
|
view! {
|
||||||
|
<div style="
|
||||||
|
display:flex;align-items:center;
|
||||||
|
justify-content:space-between;
|
||||||
|
padding:8px 12px;border-radius:8px;
|
||||||
|
background:var(--color-enuxia-dark);
|
||||||
|
border:1px solid var(--color-enuxia-border);
|
||||||
|
">
|
||||||
|
<span style="font-size:13px;font-weight:500;">
|
||||||
|
{format!("{} {} — {}/{} ({}%)", fn_.clone(), ln.clone(), s.score, s.total, pct)}
|
||||||
|
</span>
|
||||||
|
<button
|
||||||
|
class="btn-danger"
|
||||||
|
style="padding:4px 12px;font-size:12px;"
|
||||||
|
on:click=move |_| {
|
||||||
|
reset_fn.set(fn2.clone());
|
||||||
|
reset_ln.set(ln2.clone());
|
||||||
|
}
|
||||||
|
>
|
||||||
|
"Sélectionner"
|
||||||
|
</button>
|
||||||
|
</div>
|
||||||
|
}
|
||||||
|
}).collect_view()}
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
}.into_any(),
|
||||||
|
_ => view! { <span/> }.into_any(),
|
||||||
|
}
|
||||||
|
})}
|
||||||
|
</Suspense>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
}
|
||||||
|
}
|
||||||
@@ -0,0 +1,123 @@
|
|||||||
|
use leptos::prelude::*;
|
||||||
|
use leptos_router::hooks::use_params_map;
|
||||||
|
use crate::server::student::get_result_details;
|
||||||
|
|
||||||
|
#[component]
|
||||||
|
pub fn StudentDetailPage() -> impl IntoView {
|
||||||
|
let params = use_params_map();
|
||||||
|
|
||||||
|
let submission_id = move || {
|
||||||
|
params.get().get("submission_id")
|
||||||
|
.and_then(|s| s.parse::<i64>().ok())
|
||||||
|
.unwrap_or(0)
|
||||||
|
};
|
||||||
|
|
||||||
|
let result = Resource::new(submission_id, |id| get_result_details(id));
|
||||||
|
|
||||||
|
view! {
|
||||||
|
<Suspense fallback=|| view! {
|
||||||
|
<div class="admin-page">
|
||||||
|
<p style="color:var(--color-enuxia-muted);">"Chargement..."</p>
|
||||||
|
</div>
|
||||||
|
}>
|
||||||
|
{move || result.get().map(|data| {
|
||||||
|
match data {
|
||||||
|
Ok(Some((submission, details))) => {
|
||||||
|
let pct = if submission.total > 0 {
|
||||||
|
(submission.score * 100) / submission.total
|
||||||
|
} else { 0 };
|
||||||
|
|
||||||
|
let pct_color = if pct >= 80 { "#22C55E" }
|
||||||
|
else if pct >= 50 { "#4F8EFF" }
|
||||||
|
else { "#f87171" };
|
||||||
|
|
||||||
|
view! {
|
||||||
|
<div class="admin-page">
|
||||||
|
<div class="admin-topbar">
|
||||||
|
<div>
|
||||||
|
<h1 style="
|
||||||
|
background:linear-gradient(135deg,#4F8EFF,#8B5CF6);
|
||||||
|
-webkit-background-clip:text;
|
||||||
|
-webkit-text-fill-color:transparent;
|
||||||
|
background-clip:text;
|
||||||
|
">
|
||||||
|
{format!("{} {}", submission.first_name, submission.last_name)}
|
||||||
|
</h1>
|
||||||
|
<p style="font-size:13px;color:var(--color-enuxia-muted);margin-top:2px;">
|
||||||
|
{submission.submitted_at.format("Soumis le %d/%m/%Y à %H:%M").to_string()}
|
||||||
|
</p>
|
||||||
|
</div>
|
||||||
|
<a href="javascript:history.back()" class="btn-ghost">"← Retour"</a>
|
||||||
|
</div>
|
||||||
|
|
||||||
|
// Score bar
|
||||||
|
<div class="score-summary-bar">
|
||||||
|
<div style="display:flex;align-items:center;gap:16px;">
|
||||||
|
<span class="score-val">
|
||||||
|
{format!("{} / {}", submission.score, submission.total)}
|
||||||
|
</span>
|
||||||
|
<span style=format!(
|
||||||
|
"font-size:20px;font-weight:700;color:{};",
|
||||||
|
pct_color
|
||||||
|
)>
|
||||||
|
{format!("{}%", pct)}
|
||||||
|
</span>
|
||||||
|
</div>
|
||||||
|
<span style="font-size:13px;color:var(--color-enuxia-muted);">
|
||||||
|
{if pct >= 80 { "🎉 Excellent" }
|
||||||
|
else if pct >= 50 { "👍 Satisfaisant" }
|
||||||
|
else { "📚 À améliorer" }}
|
||||||
|
</span>
|
||||||
|
</div>
|
||||||
|
|
||||||
|
// Correction
|
||||||
|
<div class="correction-section">
|
||||||
|
<h2>"Détail des réponses"</h2>
|
||||||
|
{details.into_iter().enumerate().map(|(idx, d)| {
|
||||||
|
let item_class = if d.is_correct {
|
||||||
|
"correction-item is-correct"
|
||||||
|
} else {
|
||||||
|
"correction-item is-wrong"
|
||||||
|
};
|
||||||
|
view! {
|
||||||
|
<div class=item_class>
|
||||||
|
<div class="corr-meta">
|
||||||
|
<span class="corr-qnum">
|
||||||
|
{format!("Q{}", idx + 1)}
|
||||||
|
</span>
|
||||||
|
<span class="corr-section">
|
||||||
|
{d.section.clone()}
|
||||||
|
</span>
|
||||||
|
</div>
|
||||||
|
<p class="corr-question">{d.question_text.clone()}</p>
|
||||||
|
<p class="corr-chosen">
|
||||||
|
{if d.is_correct { "✅ " } else { "❌ " }}
|
||||||
|
{format!("{}) {}", d.chosen_label, d.chosen_text)}
|
||||||
|
</p>
|
||||||
|
{if !d.is_correct {
|
||||||
|
view! {
|
||||||
|
<p class="corr-right">
|
||||||
|
{format!("✔ Bonne réponse : {}) {}",
|
||||||
|
d.correct_label, d.correct_text)}
|
||||||
|
</p>
|
||||||
|
}.into_any()
|
||||||
|
} else {
|
||||||
|
view! { <span/> }.into_any()
|
||||||
|
}}
|
||||||
|
</div>
|
||||||
|
}
|
||||||
|
}).collect_view()}
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
}.into_any()
|
||||||
|
},
|
||||||
|
_ => view! {
|
||||||
|
<div class="admin-page">
|
||||||
|
<div class="field-error">"Résultats introuvables."</div>
|
||||||
|
</div>
|
||||||
|
}.into_any(),
|
||||||
|
}
|
||||||
|
})}
|
||||||
|
</Suspense>
|
||||||
|
}
|
||||||
|
}
|
||||||
@@ -0,0 +1,177 @@
|
|||||||
|
use leptos::prelude::*;
|
||||||
|
use leptos_router::hooks::use_query_map;
|
||||||
|
|
||||||
|
#[component]
|
||||||
|
pub fn LoginPage() -> impl IntoView {
|
||||||
|
let password = RwSignal::new(String::new());
|
||||||
|
let error = RwSignal::new(false);
|
||||||
|
let loading = RwSignal::new(false);
|
||||||
|
|
||||||
|
let login_action = Action::new(move |pwd: &String| {
|
||||||
|
let pwd = pwd.clone();
|
||||||
|
async move {
|
||||||
|
loading.set(true);
|
||||||
|
error.set(false);
|
||||||
|
match crate::server::login(pwd, false).await {
|
||||||
|
Ok(true) => {
|
||||||
|
let query = use_query_map().get();
|
||||||
|
let next = query.get("next").unwrap_or_else(|| "/".to_string());
|
||||||
|
leptos_router::hooks::use_navigate()(&next, Default::default());
|
||||||
|
}
|
||||||
|
_ => {
|
||||||
|
error.set(true);
|
||||||
|
loading.set(false);
|
||||||
|
}
|
||||||
|
}
|
||||||
|
}
|
||||||
|
});
|
||||||
|
|
||||||
|
view! {
|
||||||
|
<div class="login-page">
|
||||||
|
<div class="login-bg-glow"/>
|
||||||
|
<div class="login-card">
|
||||||
|
<div class="login-header">
|
||||||
|
<img src="/favicon.png" width="40" height="40" style="border-radius:10px;" alt="Enuxia"/>
|
||||||
|
<div>
|
||||||
|
<h1 class="login-title">"Enuxia Quiz"</h1>
|
||||||
|
<p class="login-sub">"Plateforme d'évaluation sécurisée"</p>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
|
||||||
|
<div class="login-divider"/>
|
||||||
|
|
||||||
|
<div class="login-form">
|
||||||
|
<label class="field-label">"Code de session"</label>
|
||||||
|
<input
|
||||||
|
type="password"
|
||||||
|
class="pwd-input"
|
||||||
|
placeholder="Entrez le code fourni par votre professeur"
|
||||||
|
prop:value=move || password.get()
|
||||||
|
on:input=move |e| {
|
||||||
|
password.set(event_target_value(&e));
|
||||||
|
error.set(false);
|
||||||
|
}
|
||||||
|
on:keydown=move |e| {
|
||||||
|
if e.key() == "Enter" && !loading.get() {
|
||||||
|
login_action.dispatch(password.get());
|
||||||
|
}
|
||||||
|
}
|
||||||
|
/>
|
||||||
|
|
||||||
|
{move || error.get().then(|| view! {
|
||||||
|
<div class="field-error">
|
||||||
|
<span>"⚠"</span>
|
||||||
|
" Code incorrect. Vérifiez auprès de votre professeur."
|
||||||
|
</div>
|
||||||
|
})}
|
||||||
|
|
||||||
|
<button
|
||||||
|
class=move || if loading.get() { "btn-submit loading" } else { "btn-submit" }
|
||||||
|
on:click=move |_| {
|
||||||
|
if !loading.get() && !password.get().is_empty() {
|
||||||
|
login_action.dispatch(password.get());
|
||||||
|
}
|
||||||
|
}
|
||||||
|
>
|
||||||
|
{move || if loading.get() {
|
||||||
|
view! { <span class="spinner"/> }.into_any()
|
||||||
|
} else {
|
||||||
|
view! { <span>"Accéder au quiz →"</span> }.into_any()
|
||||||
|
}}
|
||||||
|
</button>
|
||||||
|
</div>
|
||||||
|
|
||||||
|
<p class="login-footer">
|
||||||
|
"Professeur ? "
|
||||||
|
<a href="/admin/login">"Accès administration →"</a>
|
||||||
|
</p>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
}
|
||||||
|
}
|
||||||
|
|
||||||
|
#[component]
|
||||||
|
pub fn AdminLoginPage() -> impl IntoView {
|
||||||
|
let password = RwSignal::new(String::new());
|
||||||
|
let error = RwSignal::new(false);
|
||||||
|
let loading = RwSignal::new(false);
|
||||||
|
|
||||||
|
let login_action = Action::new(move |pwd: &String| {
|
||||||
|
let pwd = pwd.clone();
|
||||||
|
async move {
|
||||||
|
loading.set(true);
|
||||||
|
error.set(false);
|
||||||
|
match crate::server::login(pwd, true).await {
|
||||||
|
Ok(true) => {
|
||||||
|
leptos_router::hooks::use_navigate()("/admin", Default::default());
|
||||||
|
}
|
||||||
|
_ => {
|
||||||
|
error.set(true);
|
||||||
|
loading.set(false);
|
||||||
|
}
|
||||||
|
}
|
||||||
|
}
|
||||||
|
});
|
||||||
|
|
||||||
|
view! {
|
||||||
|
<div class="login-page">
|
||||||
|
<div class="login-bg-glow admin-glow"/>
|
||||||
|
<div class="login-card">
|
||||||
|
<div class="login-header">
|
||||||
|
<img src="/favicon.png" width="40" height="40" style="border-radius:10px;" alt="Enuxia"/>
|
||||||
|
<div>
|
||||||
|
<h1 class="login-title">"Administration"</h1>
|
||||||
|
<p class="login-sub">"Accès réservé au professeur"</p>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
|
||||||
|
<div class="login-divider"/>
|
||||||
|
|
||||||
|
<div class="login-form">
|
||||||
|
<label class="field-label">"Mot de passe"</label>
|
||||||
|
<input
|
||||||
|
type="password"
|
||||||
|
class="pwd-input"
|
||||||
|
placeholder="Mot de passe administrateur"
|
||||||
|
prop:value=move || password.get()
|
||||||
|
on:input=move |e| {
|
||||||
|
password.set(event_target_value(&e));
|
||||||
|
error.set(false);
|
||||||
|
}
|
||||||
|
on:keydown=move |e| {
|
||||||
|
if e.key() == "Enter" && !loading.get() {
|
||||||
|
login_action.dispatch(password.get());
|
||||||
|
}
|
||||||
|
}
|
||||||
|
/>
|
||||||
|
|
||||||
|
{move || error.get().then(|| view! {
|
||||||
|
<div class="field-error">
|
||||||
|
<span>"⚠"</span>
|
||||||
|
" Mot de passe incorrect."
|
||||||
|
</div>
|
||||||
|
})}
|
||||||
|
|
||||||
|
<button
|
||||||
|
class=move || if loading.get() { "btn-submit loading" } else { "btn-submit" }
|
||||||
|
on:click=move |_| {
|
||||||
|
if !loading.get() && !password.get().is_empty() {
|
||||||
|
login_action.dispatch(password.get());
|
||||||
|
}
|
||||||
|
}
|
||||||
|
>
|
||||||
|
{move || if loading.get() {
|
||||||
|
view! { <span class="spinner"/> }.into_any()
|
||||||
|
} else {
|
||||||
|
view! { <span>"Se connecter →"</span> }.into_any()
|
||||||
|
}}
|
||||||
|
</button>
|
||||||
|
</div>
|
||||||
|
|
||||||
|
<p class="login-footer">
|
||||||
|
<a href="/login">"← Retour à l'accueil étudiant"</a>
|
||||||
|
</p>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
}
|
||||||
|
}
|
||||||
@@ -0,0 +1,3 @@
|
|||||||
|
pub mod admin;
|
||||||
|
pub mod student;
|
||||||
|
pub mod login;
|
||||||
@@ -0,0 +1,195 @@
|
|||||||
|
use leptos::prelude::*;
|
||||||
|
use leptos_router::hooks::use_navigate;
|
||||||
|
use crate::server::{check_session_valid, student::{get_active_quizzes, check_already_done}};
|
||||||
|
|
||||||
|
#[component]
|
||||||
|
pub fn HomePage() -> impl IntoView {
|
||||||
|
let session = Resource::new(|| (), |_| check_session_valid());
|
||||||
|
let quizzes = Resource::new(|| (), |_| get_active_quizzes());
|
||||||
|
let first_name = RwSignal::new(String::new());
|
||||||
|
let last_name = RwSignal::new(String::new());
|
||||||
|
let selected_quiz = RwSignal::new(Option::<i64>::None);
|
||||||
|
let already_done = RwSignal::new(false);
|
||||||
|
|
||||||
|
view! {
|
||||||
|
<Suspense fallback=|| view! {
|
||||||
|
<div class="home-page">
|
||||||
|
<p style="text-align:center;color:var(--color-enuxia-muted);">"Chargement..."</p>
|
||||||
|
</div>
|
||||||
|
}>
|
||||||
|
{move || session.get().map(|result| {
|
||||||
|
match result {
|
||||||
|
Ok(true) => view! {
|
||||||
|
<div class="home-page">
|
||||||
|
<div style="display:flex;flex-direction:column;align-items:center;gap:12px;text-align:center;">
|
||||||
|
<span style="
|
||||||
|
display:inline-flex;align-items:center;gap:6px;
|
||||||
|
padding:5px 14px;border-radius:20px;
|
||||||
|
background:rgba(79,142,255,0.08);
|
||||||
|
border:1px solid rgba(79,142,255,0.18);
|
||||||
|
font-size:11px;font-weight:700;
|
||||||
|
color:#4F8EFF;letter-spacing:0.08em;
|
||||||
|
text-transform:uppercase;
|
||||||
|
">
|
||||||
|
<span style="width:6px;height:6px;border-radius:50%;background:#4F8EFF;display:inline-block;"/>
|
||||||
|
"Session active"
|
||||||
|
</span>
|
||||||
|
<h1 style="
|
||||||
|
font-family:'Space Grotesk',sans-serif;
|
||||||
|
font-size:34px;font-weight:800;
|
||||||
|
letter-spacing:-0.02em;margin:0;
|
||||||
|
background:linear-gradient(135deg,#4F8EFF,#8B5CF6);
|
||||||
|
-webkit-background-clip:text;
|
||||||
|
-webkit-text-fill-color:transparent;
|
||||||
|
background-clip:text;
|
||||||
|
">
|
||||||
|
"Choisissez votre quiz"
|
||||||
|
</h1>
|
||||||
|
<p style="font-size:14px;color:var(--color-enuxia-muted);max-width:400px;line-height:1.5;">
|
||||||
|
"Sélectionnez un quiz ci-dessous, renseignez vos informations et commencez."
|
||||||
|
</p>
|
||||||
|
</div>
|
||||||
|
|
||||||
|
<Suspense fallback=|| view! {
|
||||||
|
<p style="text-align:center;color:var(--color-enuxia-muted);font-size:14px;">
|
||||||
|
"Chargement des quiz..."
|
||||||
|
</p>
|
||||||
|
}>
|
||||||
|
{move || quizzes.get().map(|result| {
|
||||||
|
match result {
|
||||||
|
Ok(list) if list.is_empty() => view! {
|
||||||
|
<div style="
|
||||||
|
text-align:center;padding:48px 24px;
|
||||||
|
border-radius:16px;
|
||||||
|
background:var(--color-enuxia-dark-3);
|
||||||
|
border:1px solid var(--color-enuxia-border);
|
||||||
|
">
|
||||||
|
<p style="font-size:24px;margin-bottom:8px;">"📭"</p>
|
||||||
|
<p style="font-size:15px;font-weight:600;color:var(--color-enuxia-text);">
|
||||||
|
"Aucun quiz disponible"
|
||||||
|
</p>
|
||||||
|
<p style="font-size:13px;color:var(--color-enuxia-muted);margin-top:4px;">
|
||||||
|
"Votre professeur n'a pas encore publié de quiz."
|
||||||
|
</p>
|
||||||
|
</div>
|
||||||
|
}.into_any(),
|
||||||
|
Ok(list) => view! {
|
||||||
|
<div class="quiz-grid">
|
||||||
|
{list.into_iter().map(|quiz| {
|
||||||
|
let quiz_id = quiz.id;
|
||||||
|
let title = quiz.title.clone();
|
||||||
|
let desc = quiz.description.clone();
|
||||||
|
|
||||||
|
view! {
|
||||||
|
<div
|
||||||
|
class=move || {
|
||||||
|
if selected_quiz.get() == Some(quiz_id) {
|
||||||
|
"quiz-item selected"
|
||||||
|
} else {
|
||||||
|
"quiz-item"
|
||||||
|
}
|
||||||
|
}
|
||||||
|
on:click=move |_| {
|
||||||
|
selected_quiz.set(Some(quiz_id));
|
||||||
|
already_done.set(false);
|
||||||
|
}
|
||||||
|
>
|
||||||
|
<div style="flex:1;">
|
||||||
|
<div class="quiz-title">{title.clone()}</div>
|
||||||
|
<div class="quiz-desc">{desc.clone()}</div>
|
||||||
|
</div>
|
||||||
|
<span class="arrow">"→"</span>
|
||||||
|
</div>
|
||||||
|
}
|
||||||
|
}).collect_view()}
|
||||||
|
</div>
|
||||||
|
}.into_any(),
|
||||||
|
Err(_) => view! {
|
||||||
|
<div class="field-error">"Erreur lors du chargement des quiz."</div>
|
||||||
|
}.into_any(),
|
||||||
|
}
|
||||||
|
})}
|
||||||
|
</Suspense>
|
||||||
|
|
||||||
|
{move || selected_quiz.get().map(|quiz_id| {
|
||||||
|
let navigate = use_navigate();
|
||||||
|
view! {
|
||||||
|
<div class="identity-form">
|
||||||
|
<p class="form-title">"Vos informations"</p>
|
||||||
|
<p style="font-size:13px;color:var(--color-enuxia-muted);margin-top:-4px;">
|
||||||
|
"Ces informations seront visibles par votre professeur."
|
||||||
|
</p>
|
||||||
|
<input
|
||||||
|
type="text"
|
||||||
|
placeholder="Prénom"
|
||||||
|
prop:value=move || first_name.get()
|
||||||
|
on:input=move |e| {
|
||||||
|
first_name.set(event_target_value(&e));
|
||||||
|
already_done.set(false);
|
||||||
|
}
|
||||||
|
/>
|
||||||
|
<input
|
||||||
|
type="text"
|
||||||
|
placeholder="Nom de famille"
|
||||||
|
prop:value=move || last_name.get()
|
||||||
|
on:input=move |e| {
|
||||||
|
last_name.set(event_target_value(&e));
|
||||||
|
already_done.set(false);
|
||||||
|
}
|
||||||
|
/>
|
||||||
|
|
||||||
|
{move || already_done.get().then(|| view! {
|
||||||
|
<div style="
|
||||||
|
padding:12px 16px;border-radius:10px;
|
||||||
|
background:rgba(239,68,68,0.08);
|
||||||
|
border:1px solid rgba(239,68,68,0.2);
|
||||||
|
font-size:13px;color:#f87171;
|
||||||
|
display:flex;flex-direction:column;gap:4px;
|
||||||
|
">
|
||||||
|
<span style="font-weight:600;">"🔒 Quiz déjà passé"</span>
|
||||||
|
<span>"Contactez votre professeur pour une réinitialisation."</span>
|
||||||
|
</div>
|
||||||
|
})}
|
||||||
|
|
||||||
|
{move || (!already_done.get()).then(|| {
|
||||||
|
let navigate = navigate.clone();
|
||||||
|
view! {
|
||||||
|
<button
|
||||||
|
class="btn-start"
|
||||||
|
on:click=move |_| {
|
||||||
|
let fn_ = first_name.get();
|
||||||
|
let ln = last_name.get();
|
||||||
|
if fn_.is_empty() || ln.is_empty() { return; }
|
||||||
|
let navigate = navigate.clone();
|
||||||
|
leptos::task::spawn_local(async move {
|
||||||
|
match check_already_done(quiz_id, fn_.clone(), ln.clone()).await {
|
||||||
|
Ok(true) => {
|
||||||
|
already_done.set(true);
|
||||||
|
}
|
||||||
|
_ => {
|
||||||
|
navigate(
|
||||||
|
&format!("/quiz/{}?first_name={}&last_name={}", quiz_id, fn_, ln),
|
||||||
|
Default::default()
|
||||||
|
);
|
||||||
|
}
|
||||||
|
}
|
||||||
|
});
|
||||||
|
}
|
||||||
|
>
|
||||||
|
"Commencer le quiz →"
|
||||||
|
</button>
|
||||||
|
}
|
||||||
|
})}
|
||||||
|
</div>
|
||||||
|
}
|
||||||
|
})}
|
||||||
|
</div>
|
||||||
|
}.into_any(),
|
||||||
|
_ => view! {
|
||||||
|
<script>"window.location.href='/login';"</script>
|
||||||
|
}.into_any(),
|
||||||
|
}
|
||||||
|
})}
|
||||||
|
</Suspense>
|
||||||
|
}
|
||||||
|
}
|
||||||
@@ -0,0 +1,3 @@
|
|||||||
|
pub mod home;
|
||||||
|
pub mod quiz;
|
||||||
|
pub mod result;
|
||||||
@@ -0,0 +1,276 @@
|
|||||||
|
use leptos::prelude::*;
|
||||||
|
use leptos_router::hooks::{use_navigate, use_params_map, use_query_map};
|
||||||
|
use crate::server::student::{get_quiz_with_questions, submit_quiz};
|
||||||
|
|
||||||
|
#[cfg(feature = "hydrate")]
|
||||||
|
use gloo_timers::future::TimeoutFuture;
|
||||||
|
|
||||||
|
#[component]
|
||||||
|
pub fn QuizPage() -> impl IntoView {
|
||||||
|
let params = use_params_map();
|
||||||
|
let query = use_query_map();
|
||||||
|
|
||||||
|
let quiz_id = move || {
|
||||||
|
params.get().get("quiz_id")
|
||||||
|
.and_then(|s| s.parse::<i64>().ok())
|
||||||
|
.unwrap_or(0)
|
||||||
|
};
|
||||||
|
|
||||||
|
let first_name = move || query.get().get("first_name").unwrap_or_default();
|
||||||
|
let last_name = move || query.get().get("last_name").unwrap_or_default();
|
||||||
|
|
||||||
|
let quiz_data = Resource::new(quiz_id, |id| get_quiz_with_questions(id));
|
||||||
|
let answers = RwSignal::new(Vec::<(i64, i64)>::new());
|
||||||
|
let current = RwSignal::new(0usize);
|
||||||
|
let navigate = StoredValue::new(use_navigate());
|
||||||
|
let time_left = RwSignal::new(Option::<i64>::None);
|
||||||
|
let submitted = RwSignal::new(false);
|
||||||
|
|
||||||
|
view! {
|
||||||
|
<Suspense fallback=|| view! {
|
||||||
|
<div class="quiz-page">
|
||||||
|
<p style="text-align:center;color:var(--color-enuxia-muted);">"Chargement du quiz..."</p>
|
||||||
|
</div>
|
||||||
|
}>
|
||||||
|
{move || quiz_data.get().map(|result| {
|
||||||
|
match result {
|
||||||
|
Ok(Some((quiz, questions))) => {
|
||||||
|
let total = questions.len();
|
||||||
|
let questions = StoredValue::new(questions);
|
||||||
|
let quiz_title = quiz.title.clone();
|
||||||
|
|
||||||
|
// Minuteur
|
||||||
|
if let Some(secs) = quiz.time_limit_seconds {
|
||||||
|
if time_left.get().is_none() {
|
||||||
|
time_left.set(Some(secs));
|
||||||
|
leptos::task::spawn_local(async move {
|
||||||
|
loop {
|
||||||
|
#[cfg(feature = "hydrate")]
|
||||||
|
TimeoutFuture::new(1000).await;
|
||||||
|
#[cfg(not(feature = "hydrate"))]
|
||||||
|
break;
|
||||||
|
|
||||||
|
if submitted.get() { break; }
|
||||||
|
let t = time_left.get().unwrap_or(0);
|
||||||
|
if t <= 1 {
|
||||||
|
time_left.set(Some(0));
|
||||||
|
if !submitted.get() {
|
||||||
|
submitted.set(true);
|
||||||
|
let fn_ = first_name();
|
||||||
|
let ln = last_name();
|
||||||
|
let qid = quiz_id();
|
||||||
|
let ans = answers.get();
|
||||||
|
let nav = navigate.get_value();
|
||||||
|
if let Ok(sid) = submit_quiz(qid, fn_, ln, ans).await {
|
||||||
|
nav(&format!("/result/{}", sid), Default::default());
|
||||||
|
}
|
||||||
|
}
|
||||||
|
break;
|
||||||
|
}
|
||||||
|
time_left.set(Some(t - 1));
|
||||||
|
}
|
||||||
|
});
|
||||||
|
}
|
||||||
|
}
|
||||||
|
|
||||||
|
view! {
|
||||||
|
<div class="quiz-page">
|
||||||
|
|
||||||
|
// ── Topbar ────────────────────────────────────
|
||||||
|
<div class="quiz-topbar">
|
||||||
|
<span class="quiz-name">{quiz_title.clone()}</span>
|
||||||
|
<div style="display:flex;align-items:center;gap:12px;">
|
||||||
|
{move || time_left.get().map(|secs| {
|
||||||
|
let mins = secs / 60;
|
||||||
|
let s = secs % 60;
|
||||||
|
let color = if secs <= 30 { "#f87171" }
|
||||||
|
else if secs <= 60 { "#fb923c" }
|
||||||
|
else { "var(--color-enuxia-muted)" };
|
||||||
|
view! {
|
||||||
|
<span style=format!(
|
||||||
|
"font-size:13px;font-weight:700;color:{};
|
||||||
|
padding:4px 12px;border-radius:20px;
|
||||||
|
background:rgba(0,0,0,0.2);
|
||||||
|
border:1px solid currentColor;
|
||||||
|
font-variant-numeric:tabular-nums;",
|
||||||
|
color
|
||||||
|
)>
|
||||||
|
{format!("⏱ {:02}:{:02}", mins, s)}
|
||||||
|
</span>
|
||||||
|
}
|
||||||
|
})}
|
||||||
|
<span class="question-badge">
|
||||||
|
{move || format!("{} / {}", current.get() + 1, total)}
|
||||||
|
</span>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
|
||||||
|
// ── Barre de progression ──────────────────────
|
||||||
|
<div class="progress-track">
|
||||||
|
<div
|
||||||
|
class="progress-fill"
|
||||||
|
style=move || format!(
|
||||||
|
"width:{}%",
|
||||||
|
(current.get().min(total) * 100) / total.max(1)
|
||||||
|
)
|
||||||
|
/>
|
||||||
|
</div>
|
||||||
|
|
||||||
|
// ── Question ──────────────────────────────────
|
||||||
|
{move || {
|
||||||
|
let qs = questions.get_value();
|
||||||
|
let idx = current.get();
|
||||||
|
|
||||||
|
if idx >= qs.len() {
|
||||||
|
return view! { <span/> }.into_any();
|
||||||
|
}
|
||||||
|
|
||||||
|
let qwa = qs[idx].clone();
|
||||||
|
let question = qwa.question.clone();
|
||||||
|
let ans_list = qwa.answers.clone();
|
||||||
|
let q_id = question.id;
|
||||||
|
|
||||||
|
// Réponse actuellement sélectionnée pour cette question
|
||||||
|
let selected = move || {
|
||||||
|
answers.get().iter()
|
||||||
|
.find(|(qid, _)| *qid == q_id)
|
||||||
|
.map(|(_, aid)| *aid)
|
||||||
|
};
|
||||||
|
|
||||||
|
view! {
|
||||||
|
<div class="question-area">
|
||||||
|
<span class="question-section-tag">
|
||||||
|
{question.section.clone()}
|
||||||
|
</span>
|
||||||
|
<p class="question-text">{question.text.clone()}</p>
|
||||||
|
|
||||||
|
<div class="answers-list">
|
||||||
|
{ans_list.into_iter().map(|answer| {
|
||||||
|
let aid = answer.id;
|
||||||
|
let lbl = answer.label.clone();
|
||||||
|
let txt = answer.text.clone();
|
||||||
|
|
||||||
|
view! {
|
||||||
|
<button
|
||||||
|
class=move || {
|
||||||
|
if selected() == Some(aid) {
|
||||||
|
"answer-option selected"
|
||||||
|
} else {
|
||||||
|
"answer-option"
|
||||||
|
}
|
||||||
|
}
|
||||||
|
on:click=move |_| {
|
||||||
|
if submitted.get() { return; }
|
||||||
|
answers.update(|v| {
|
||||||
|
v.retain(|(q, _)| *q != q_id);
|
||||||
|
v.push((q_id, aid));
|
||||||
|
});
|
||||||
|
}
|
||||||
|
>
|
||||||
|
<span class="opt-label">{lbl.clone()}</span>
|
||||||
|
{txt.clone()}
|
||||||
|
</button>
|
||||||
|
}
|
||||||
|
}).collect_view()}
|
||||||
|
</div>
|
||||||
|
|
||||||
|
// ── Navigation ───────────────────
|
||||||
|
<div style="
|
||||||
|
display:flex;
|
||||||
|
align-items:center;
|
||||||
|
justify-content:space-between;
|
||||||
|
margin-top:8px;
|
||||||
|
gap:12px;
|
||||||
|
">
|
||||||
|
// Bouton précédent
|
||||||
|
{move || (current.get() > 0).then(|| view! {
|
||||||
|
<button
|
||||||
|
class="btn-ghost"
|
||||||
|
on:click=move |_| {
|
||||||
|
current.update(|c| *c -= 1);
|
||||||
|
}
|
||||||
|
>
|
||||||
|
"← Précédent"
|
||||||
|
</button>
|
||||||
|
})}
|
||||||
|
|
||||||
|
{move || (current.get() == 0).then(|| view! {
|
||||||
|
<span/>
|
||||||
|
})}
|
||||||
|
|
||||||
|
// Bouton suivant ou soumettre
|
||||||
|
{move || {
|
||||||
|
let idx = current.get();
|
||||||
|
let has_answer = selected().is_some();
|
||||||
|
|
||||||
|
if idx == total - 1 {
|
||||||
|
// Dernière question — bouton soumettre
|
||||||
|
view! {
|
||||||
|
<button
|
||||||
|
style=move || format!(
|
||||||
|
"opacity:{};",
|
||||||
|
if has_answer { "1" } else { "0.4" }
|
||||||
|
)
|
||||||
|
class="btn-primary"
|
||||||
|
on:click=move |_| {
|
||||||
|
if !has_answer || submitted.get() { return; }
|
||||||
|
submitted.set(true);
|
||||||
|
let fn_ = first_name();
|
||||||
|
let ln = last_name();
|
||||||
|
let qid = quiz_id();
|
||||||
|
let ans = answers.get();
|
||||||
|
let nav = navigate.get_value();
|
||||||
|
leptos::task::spawn_local(async move {
|
||||||
|
if let Ok(sid) = submit_quiz(qid, fn_, ln, ans).await {
|
||||||
|
nav(&format!("/result/{}", sid), Default::default());
|
||||||
|
}
|
||||||
|
});
|
||||||
|
}
|
||||||
|
>
|
||||||
|
"Soumettre le quiz →"
|
||||||
|
</button>
|
||||||
|
}.into_any()
|
||||||
|
} else {
|
||||||
|
// Question suivante
|
||||||
|
view! {
|
||||||
|
<button
|
||||||
|
style=move || format!(
|
||||||
|
"opacity:{};",
|
||||||
|
if has_answer { "1" } else { "0.4" }
|
||||||
|
)
|
||||||
|
class="btn-primary"
|
||||||
|
on:click=move |_| {
|
||||||
|
if !has_answer { return; }
|
||||||
|
current.update(|c| *c += 1);
|
||||||
|
}
|
||||||
|
>
|
||||||
|
"Suivant →"
|
||||||
|
</button>
|
||||||
|
}.into_any()
|
||||||
|
}
|
||||||
|
}}
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
}.into_any()
|
||||||
|
}}
|
||||||
|
|
||||||
|
// ── Envoi en cours ────────────────────────────
|
||||||
|
{move || submitted.get().then(|| view! {
|
||||||
|
<div style="text-align:center;padding:24px 0;color:var(--color-enuxia-muted);">
|
||||||
|
<div class="spinner" style="margin:0 auto 12px;"/>
|
||||||
|
<p>"Envoi de vos réponses..."</p>
|
||||||
|
</div>
|
||||||
|
})}
|
||||||
|
</div>
|
||||||
|
}.into_any()
|
||||||
|
},
|
||||||
|
_ => view! {
|
||||||
|
<div class="quiz-page">
|
||||||
|
<div class="field-error">"Quiz introuvable."</div>
|
||||||
|
</div>
|
||||||
|
}.into_any(),
|
||||||
|
}
|
||||||
|
})}
|
||||||
|
</Suspense>
|
||||||
|
}
|
||||||
|
}
|
||||||
@@ -0,0 +1,152 @@
|
|||||||
|
use leptos::prelude::*;
|
||||||
|
use leptos_router::hooks::use_params_map;
|
||||||
|
use crate::server::student::get_result_details;
|
||||||
|
|
||||||
|
#[component]
|
||||||
|
pub fn ResultPage() -> impl IntoView {
|
||||||
|
let params = use_params_map();
|
||||||
|
|
||||||
|
let submission_id = move || {
|
||||||
|
params.get().get("submission_id")
|
||||||
|
.and_then(|s| s.parse::<i64>().ok())
|
||||||
|
.unwrap_or(0)
|
||||||
|
};
|
||||||
|
|
||||||
|
let result = Resource::new(submission_id, |id| get_result_details(id));
|
||||||
|
|
||||||
|
view! {
|
||||||
|
<Suspense fallback=|| view! {
|
||||||
|
<div class="result-page">
|
||||||
|
<p style="text-align:center;color:var(--color-enuxia-muted);">"Chargement..."</p>
|
||||||
|
</div>
|
||||||
|
}>
|
||||||
|
{move || result.get().map(|data| {
|
||||||
|
match data {
|
||||||
|
Ok(Some((submission, details))) => {
|
||||||
|
let pct = if submission.total > 0 {
|
||||||
|
(submission.score * 100) / submission.total
|
||||||
|
} else { 0 };
|
||||||
|
|
||||||
|
let color = if pct >= 80 { "#22C55E" }
|
||||||
|
else if pct >= 50 { "#4F8EFF" }
|
||||||
|
else { "#f87171" };
|
||||||
|
|
||||||
|
let tag_class = if pct >= 80 { "result-tag tag-great" }
|
||||||
|
else if pct >= 50 { "result-tag tag-ok" }
|
||||||
|
else { "result-tag tag-bad" };
|
||||||
|
|
||||||
|
let tag_text = if pct >= 80 { "🎉 Excellent travail !" }
|
||||||
|
else if pct >= 50 { "👍 Bon effort, continuez !" }
|
||||||
|
else { "📚 Révisez les points manqués." };
|
||||||
|
|
||||||
|
let r = 80.0_f64;
|
||||||
|
let circumference = 2.0 * std::f64::consts::PI * r;
|
||||||
|
let dash = (pct as f64 / 100.0) * circumference;
|
||||||
|
|
||||||
|
view! {
|
||||||
|
<div class="result-page">
|
||||||
|
<div class="result-hero">
|
||||||
|
|
||||||
|
// Halo dynamique centré sur le cercle
|
||||||
|
<div style=format!(
|
||||||
|
"position:absolute;top:50%;left:50%;\
|
||||||
|
transform:translate(-50%,-50%);\
|
||||||
|
width:280px;height:280px;border-radius:50%;\
|
||||||
|
pointer-events:none;z-index:0;\
|
||||||
|
background:radial-gradient(ellipse, {}26 0%, transparent 65%);",
|
||||||
|
color
|
||||||
|
)/>
|
||||||
|
|
||||||
|
<p class="result-label" style="position:relative;z-index:1;">
|
||||||
|
"Résultats du quiz"
|
||||||
|
</p>
|
||||||
|
<p class="result-name" style="position:relative;z-index:1;">
|
||||||
|
{format!("{} {}", submission.first_name, submission.last_name)}
|
||||||
|
</p>
|
||||||
|
|
||||||
|
// Cercle SVG
|
||||||
|
<div class="score-ring-wrap" style="position:relative;z-index:1;">
|
||||||
|
<svg width="200" height="200" viewBox="0 0 200 200">
|
||||||
|
<circle
|
||||||
|
cx="100" cy="100" r="80"
|
||||||
|
fill="none"
|
||||||
|
stroke="#1A1D2E"
|
||||||
|
stroke-width="12"
|
||||||
|
/>
|
||||||
|
<circle
|
||||||
|
cx="100" cy="100" r="80"
|
||||||
|
fill="none"
|
||||||
|
stroke=color
|
||||||
|
stroke-width="12"
|
||||||
|
stroke-linecap="round"
|
||||||
|
stroke-dasharray=format!("{} {}", dash, circumference)
|
||||||
|
stroke-dashoffset="0"
|
||||||
|
transform="rotate(-90 100 100)"
|
||||||
|
/>
|
||||||
|
</svg>
|
||||||
|
<div class="score-ring-inner">
|
||||||
|
<span class="score-ring-num"
|
||||||
|
style=format!("color:{};", color)>
|
||||||
|
{format!("{}/{}", submission.score, submission.total)}
|
||||||
|
</span>
|
||||||
|
<span class="score-ring-pct">{format!("{}%", pct)}</span>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
|
||||||
|
<div class=tag_class style="position:relative;z-index:1;">
|
||||||
|
{tag_text}
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
|
||||||
|
<div class="correction-section">
|
||||||
|
<h2>"Correction détaillée"</h2>
|
||||||
|
{details.into_iter().enumerate().map(|(idx, d)| {
|
||||||
|
let item_class = if d.is_correct {
|
||||||
|
"correction-item is-correct"
|
||||||
|
} else {
|
||||||
|
"correction-item is-wrong"
|
||||||
|
};
|
||||||
|
view! {
|
||||||
|
<div class=item_class>
|
||||||
|
<div class="corr-meta">
|
||||||
|
<span class="corr-qnum">
|
||||||
|
{format!("Q{}", idx + 1)}
|
||||||
|
</span>
|
||||||
|
<span class="corr-section">
|
||||||
|
{d.section.clone()}
|
||||||
|
</span>
|
||||||
|
</div>
|
||||||
|
<p class="corr-question">{d.question_text.clone()}</p>
|
||||||
|
<p class="corr-chosen">
|
||||||
|
{if d.is_correct { "✅ " } else { "❌ " }}
|
||||||
|
{format!("{}) {}", d.chosen_label, d.chosen_text)}
|
||||||
|
</p>
|
||||||
|
{if !d.is_correct {
|
||||||
|
view! {
|
||||||
|
<p class="corr-right">
|
||||||
|
{format!("✔ Bonne réponse : {}) {}",
|
||||||
|
d.correct_label, d.correct_text)}
|
||||||
|
</p>
|
||||||
|
}.into_any()
|
||||||
|
} else {
|
||||||
|
view! { <span/> }.into_any()
|
||||||
|
}}
|
||||||
|
</div>
|
||||||
|
}
|
||||||
|
}).collect_view()}
|
||||||
|
</div>
|
||||||
|
|
||||||
|
<a href="/" class="btn-home-link">"← Retour à l'accueil"</a>
|
||||||
|
</div>
|
||||||
|
}.into_any()
|
||||||
|
},
|
||||||
|
_ => view! {
|
||||||
|
<div class="result-page">
|
||||||
|
<div class="field-error">"Résultats introuvables."</div>
|
||||||
|
</div>
|
||||||
|
}.into_any(),
|
||||||
|
}
|
||||||
|
})}
|
||||||
|
</Suspense>
|
||||||
|
}
|
||||||
|
}
|
||||||
@@ -0,0 +1,537 @@
|
|||||||
|
use leptos::prelude::*;
|
||||||
|
use crate::models::*;
|
||||||
|
|
||||||
|
#[server]
|
||||||
|
pub async fn get_all_quizzes() -> Result<Vec<Quiz>, ServerFnError> {
|
||||||
|
use axum::Extension;
|
||||||
|
use leptos_axum::extract;
|
||||||
|
use sqlx::SqlitePool;
|
||||||
|
|
||||||
|
let Extension(pool): Extension<SqlitePool> = extract().await?;
|
||||||
|
|
||||||
|
let quizzes = sqlx::query_as!(
|
||||||
|
Quiz,
|
||||||
|
r#"SELECT id, title, description,
|
||||||
|
active as "active: bool",
|
||||||
|
shuffle_questions as "shuffle_questions: bool",
|
||||||
|
shuffle_answers as "shuffle_answers: bool",
|
||||||
|
time_limit_seconds,
|
||||||
|
created_at as "created_at: chrono::DateTime<chrono::Utc>"
|
||||||
|
FROM quizzes ORDER BY created_at DESC"#
|
||||||
|
)
|
||||||
|
.fetch_all(&pool)
|
||||||
|
.await
|
||||||
|
.map_err(|e| ServerFnError::new(e.to_string()))?;
|
||||||
|
|
||||||
|
Ok(quizzes)
|
||||||
|
}
|
||||||
|
|
||||||
|
#[server]
|
||||||
|
pub async fn create_quiz(title: String, description: String) -> Result<i64, ServerFnError> {
|
||||||
|
use axum::Extension;
|
||||||
|
use leptos_axum::extract;
|
||||||
|
use sqlx::SqlitePool;
|
||||||
|
|
||||||
|
let Extension(pool): Extension<SqlitePool> = extract().await?;
|
||||||
|
|
||||||
|
let id = sqlx::query!(
|
||||||
|
"INSERT INTO quizzes (title, description) VALUES (?, ?)",
|
||||||
|
title, description
|
||||||
|
)
|
||||||
|
.execute(&pool)
|
||||||
|
.await
|
||||||
|
.map_err(|e| ServerFnError::new(e.to_string()))?
|
||||||
|
.last_insert_rowid();
|
||||||
|
|
||||||
|
Ok(id)
|
||||||
|
}
|
||||||
|
|
||||||
|
#[server]
|
||||||
|
pub async fn update_quiz(
|
||||||
|
id: i64,
|
||||||
|
title: String,
|
||||||
|
description: String,
|
||||||
|
active: bool,
|
||||||
|
shuffle_questions: bool,
|
||||||
|
shuffle_answers: bool,
|
||||||
|
time_limit_seconds: Option<i64>,
|
||||||
|
) -> Result<(), ServerFnError> {
|
||||||
|
use axum::Extension;
|
||||||
|
use leptos_axum::extract;
|
||||||
|
use sqlx::SqlitePool;
|
||||||
|
|
||||||
|
let Extension(pool): Extension<SqlitePool> = extract().await?;
|
||||||
|
|
||||||
|
sqlx::query!(
|
||||||
|
r#"UPDATE quizzes
|
||||||
|
SET title = ?, description = ?, active = ?,
|
||||||
|
shuffle_questions = ?, shuffle_answers = ?,
|
||||||
|
time_limit_seconds = ?
|
||||||
|
WHERE id = ?"#,
|
||||||
|
title, description, active,
|
||||||
|
shuffle_questions, shuffle_answers,
|
||||||
|
time_limit_seconds, id
|
||||||
|
)
|
||||||
|
.execute(&pool)
|
||||||
|
.await
|
||||||
|
.map_err(|e| ServerFnError::new(e.to_string()))?;
|
||||||
|
|
||||||
|
Ok(())
|
||||||
|
}
|
||||||
|
|
||||||
|
#[server]
|
||||||
|
pub async fn delete_quiz(id: i64) -> Result<(), ServerFnError> {
|
||||||
|
use axum::Extension;
|
||||||
|
use leptos_axum::extract;
|
||||||
|
use sqlx::SqlitePool;
|
||||||
|
|
||||||
|
let Extension(pool): Extension<SqlitePool> = extract().await?;
|
||||||
|
|
||||||
|
sqlx::query!("DELETE FROM quizzes WHERE id = ?", id)
|
||||||
|
.execute(&pool)
|
||||||
|
.await
|
||||||
|
.map_err(|e| ServerFnError::new(e.to_string()))?;
|
||||||
|
|
||||||
|
Ok(())
|
||||||
|
}
|
||||||
|
|
||||||
|
#[server]
|
||||||
|
pub async fn add_question(
|
||||||
|
quiz_id: i64,
|
||||||
|
text: String,
|
||||||
|
section: String,
|
||||||
|
position: i64,
|
||||||
|
) -> Result<i64, ServerFnError> {
|
||||||
|
use axum::Extension;
|
||||||
|
use leptos_axum::extract;
|
||||||
|
use sqlx::SqlitePool;
|
||||||
|
|
||||||
|
let Extension(pool): Extension<SqlitePool> = extract().await?;
|
||||||
|
|
||||||
|
let id = sqlx::query!(
|
||||||
|
"INSERT INTO questions (quiz_id, text, section, position) VALUES (?, ?, ?, ?)",
|
||||||
|
quiz_id, text, section, position
|
||||||
|
)
|
||||||
|
.execute(&pool)
|
||||||
|
.await
|
||||||
|
.map_err(|e| ServerFnError::new(e.to_string()))?
|
||||||
|
.last_insert_rowid();
|
||||||
|
|
||||||
|
Ok(id)
|
||||||
|
}
|
||||||
|
|
||||||
|
#[server]
|
||||||
|
pub async fn update_question(
|
||||||
|
id: i64,
|
||||||
|
text: String,
|
||||||
|
section: String,
|
||||||
|
position: i64,
|
||||||
|
) -> Result<(), ServerFnError> {
|
||||||
|
use axum::Extension;
|
||||||
|
use leptos_axum::extract;
|
||||||
|
use sqlx::SqlitePool;
|
||||||
|
|
||||||
|
let Extension(pool): Extension<SqlitePool> = extract().await?;
|
||||||
|
|
||||||
|
sqlx::query!(
|
||||||
|
"UPDATE questions SET text = ?, section = ?, position = ? WHERE id = ?",
|
||||||
|
text, section, position, id
|
||||||
|
)
|
||||||
|
.execute(&pool)
|
||||||
|
.await
|
||||||
|
.map_err(|e| ServerFnError::new(e.to_string()))?;
|
||||||
|
|
||||||
|
Ok(())
|
||||||
|
}
|
||||||
|
|
||||||
|
#[server]
|
||||||
|
pub async fn delete_question(id: i64) -> Result<(), ServerFnError> {
|
||||||
|
use axum::Extension;
|
||||||
|
use leptos_axum::extract;
|
||||||
|
use sqlx::SqlitePool;
|
||||||
|
|
||||||
|
let Extension(pool): Extension<SqlitePool> = extract().await?;
|
||||||
|
|
||||||
|
sqlx::query!("DELETE FROM questions WHERE id = ?", id)
|
||||||
|
.execute(&pool)
|
||||||
|
.await
|
||||||
|
.map_err(|e| ServerFnError::new(e.to_string()))?;
|
||||||
|
|
||||||
|
Ok(())
|
||||||
|
}
|
||||||
|
|
||||||
|
#[server]
|
||||||
|
pub async fn add_answer(
|
||||||
|
question_id: i64,
|
||||||
|
label: String,
|
||||||
|
text: String,
|
||||||
|
correct: bool,
|
||||||
|
) -> Result<i64, ServerFnError> {
|
||||||
|
use axum::Extension;
|
||||||
|
use leptos_axum::extract;
|
||||||
|
use sqlx::SqlitePool;
|
||||||
|
|
||||||
|
let Extension(pool): Extension<SqlitePool> = extract().await?;
|
||||||
|
|
||||||
|
let id = sqlx::query!(
|
||||||
|
"INSERT INTO answers (question_id, label, text, correct) VALUES (?, ?, ?, ?)",
|
||||||
|
question_id, label, text, correct
|
||||||
|
)
|
||||||
|
.execute(&pool)
|
||||||
|
.await
|
||||||
|
.map_err(|e| ServerFnError::new(e.to_string()))?
|
||||||
|
.last_insert_rowid();
|
||||||
|
|
||||||
|
Ok(id)
|
||||||
|
}
|
||||||
|
|
||||||
|
#[server]
|
||||||
|
pub async fn update_answer(
|
||||||
|
id: i64,
|
||||||
|
label: String,
|
||||||
|
text: String,
|
||||||
|
correct: bool,
|
||||||
|
) -> Result<(), ServerFnError> {
|
||||||
|
use axum::Extension;
|
||||||
|
use leptos_axum::extract;
|
||||||
|
use sqlx::SqlitePool;
|
||||||
|
|
||||||
|
let Extension(pool): Extension<SqlitePool> = extract().await?;
|
||||||
|
|
||||||
|
sqlx::query!(
|
||||||
|
"UPDATE answers SET label = ?, text = ?, correct = ? WHERE id = ?",
|
||||||
|
label, text, correct, id
|
||||||
|
)
|
||||||
|
.execute(&pool)
|
||||||
|
.await
|
||||||
|
.map_err(|e| ServerFnError::new(e.to_string()))?;
|
||||||
|
|
||||||
|
Ok(())
|
||||||
|
}
|
||||||
|
|
||||||
|
#[server]
|
||||||
|
pub async fn delete_answer(id: i64) -> Result<(), ServerFnError> {
|
||||||
|
use axum::Extension;
|
||||||
|
use leptos_axum::extract;
|
||||||
|
use sqlx::SqlitePool;
|
||||||
|
|
||||||
|
let Extension(pool): Extension<SqlitePool> = extract().await?;
|
||||||
|
|
||||||
|
sqlx::query!("DELETE FROM answers WHERE id = ?", id)
|
||||||
|
.execute(&pool)
|
||||||
|
.await
|
||||||
|
.map_err(|e| ServerFnError::new(e.to_string()))?;
|
||||||
|
|
||||||
|
Ok(())
|
||||||
|
}
|
||||||
|
|
||||||
|
#[server]
|
||||||
|
pub async fn get_quiz_submissions(quiz_id: i64) -> Result<Vec<QuizSubmission>, ServerFnError> {
|
||||||
|
use axum::Extension;
|
||||||
|
use leptos_axum::extract;
|
||||||
|
use sqlx::SqlitePool;
|
||||||
|
|
||||||
|
let Extension(pool): Extension<SqlitePool> = extract().await?;
|
||||||
|
|
||||||
|
let submissions = sqlx::query_as!(
|
||||||
|
QuizSubmission,
|
||||||
|
r#"SELECT id, quiz_id, first_name, last_name, score, total,
|
||||||
|
submitted_at as "submitted_at: chrono::DateTime<chrono::Utc>"
|
||||||
|
FROM submissions WHERE quiz_id = ?
|
||||||
|
ORDER BY submitted_at DESC"#,
|
||||||
|
quiz_id
|
||||||
|
)
|
||||||
|
.fetch_all(&pool)
|
||||||
|
.await
|
||||||
|
.map_err(|e| ServerFnError::new(e.to_string()))?;
|
||||||
|
|
||||||
|
Ok(submissions)
|
||||||
|
}
|
||||||
|
|
||||||
|
#[server]
|
||||||
|
pub async fn get_submission_detail(
|
||||||
|
submission_id: i64,
|
||||||
|
) -> Result<Option<(QuizSubmission, Vec<(SubmissionAnswer, Question, Answer)>)>, ServerFnError> {
|
||||||
|
use axum::Extension;
|
||||||
|
use leptos_axum::extract;
|
||||||
|
use sqlx::SqlitePool;
|
||||||
|
|
||||||
|
let Extension(pool): Extension<SqlitePool> = extract().await?;
|
||||||
|
|
||||||
|
let submission = sqlx::query_as!(
|
||||||
|
QuizSubmission,
|
||||||
|
r#"SELECT id, quiz_id, first_name, last_name, score, total,
|
||||||
|
submitted_at as "submitted_at: chrono::DateTime<chrono::Utc>"
|
||||||
|
FROM submissions WHERE id = ?"#,
|
||||||
|
submission_id
|
||||||
|
)
|
||||||
|
.fetch_optional(&pool)
|
||||||
|
.await
|
||||||
|
.map_err(|e| ServerFnError::new(e.to_string()))?;
|
||||||
|
|
||||||
|
let Some(submission) = submission else { return Ok(None); };
|
||||||
|
|
||||||
|
let rows = sqlx::query!(
|
||||||
|
r#"SELECT
|
||||||
|
sa.id as sa_id,
|
||||||
|
sa.submission_id,
|
||||||
|
sa.question_id,
|
||||||
|
sa.answer_id,
|
||||||
|
sa.correct as "sa_correct: bool",
|
||||||
|
q.quiz_id,
|
||||||
|
q.text as q_text,
|
||||||
|
q.section,
|
||||||
|
q.position,
|
||||||
|
a.label,
|
||||||
|
a.text as a_text,
|
||||||
|
a.correct as "a_correct: bool"
|
||||||
|
FROM student_answers sa
|
||||||
|
JOIN questions q ON q.id = sa.question_id
|
||||||
|
JOIN answers a ON a.id = sa.answer_id
|
||||||
|
WHERE sa.submission_id = ?
|
||||||
|
ORDER BY q.position"#,
|
||||||
|
submission_id
|
||||||
|
)
|
||||||
|
.fetch_all(&pool)
|
||||||
|
.await
|
||||||
|
.map_err(|e| ServerFnError::new(e.to_string()))?;
|
||||||
|
|
||||||
|
let details = rows.into_iter().map(|row| {
|
||||||
|
let sa = SubmissionAnswer {
|
||||||
|
id: row.sa_id,
|
||||||
|
submission_id: row.submission_id,
|
||||||
|
question_id: row.question_id,
|
||||||
|
answer_id: row.answer_id,
|
||||||
|
correct: row.sa_correct,
|
||||||
|
};
|
||||||
|
let q = Question {
|
||||||
|
id: row.question_id,
|
||||||
|
quiz_id: row.quiz_id,
|
||||||
|
text: row.q_text,
|
||||||
|
section: row.section,
|
||||||
|
position: row.position,
|
||||||
|
};
|
||||||
|
let a = Answer {
|
||||||
|
id: row.answer_id,
|
||||||
|
question_id: row.question_id,
|
||||||
|
label: row.label,
|
||||||
|
text: row.a_text,
|
||||||
|
correct: row.a_correct,
|
||||||
|
};
|
||||||
|
(sa, q, a)
|
||||||
|
}).collect();
|
||||||
|
|
||||||
|
Ok(Some((submission, details)))
|
||||||
|
}
|
||||||
|
|
||||||
|
#[server]
|
||||||
|
pub async fn export_submissions_csv(quiz_id: i64) -> Result<String, ServerFnError> {
|
||||||
|
use axum::Extension;
|
||||||
|
use leptos_axum::extract;
|
||||||
|
use sqlx::SqlitePool;
|
||||||
|
|
||||||
|
let Extension(pool): Extension<SqlitePool> = extract().await?;
|
||||||
|
|
||||||
|
// Récupère le titre du quiz pour le nom de fichier
|
||||||
|
let quiz_title = sqlx::query_scalar!(
|
||||||
|
"SELECT title FROM quizzes WHERE id = ?", quiz_id
|
||||||
|
)
|
||||||
|
.fetch_optional(&pool)
|
||||||
|
.await
|
||||||
|
.map_err(|e| ServerFnError::new(e.to_string()))?
|
||||||
|
.unwrap_or_else(|| "quiz".to_string());
|
||||||
|
|
||||||
|
let submissions = sqlx::query_as!(
|
||||||
|
QuizSubmission,
|
||||||
|
r#"SELECT id, quiz_id, first_name, last_name, score, total,
|
||||||
|
submitted_at as "submitted_at: chrono::DateTime<chrono::Utc>"
|
||||||
|
FROM submissions WHERE quiz_id = ?
|
||||||
|
ORDER BY last_name, first_name"#,
|
||||||
|
quiz_id
|
||||||
|
)
|
||||||
|
.fetch_all(&pool)
|
||||||
|
.await
|
||||||
|
.map_err(|e| ServerFnError::new(e.to_string()))?;
|
||||||
|
|
||||||
|
// En-tête avec le titre du quiz
|
||||||
|
let mut csv = format!("Quiz: {}\n", quiz_title);
|
||||||
|
csv.push_str("Nom,Prénom,Score,Total,Pourcentage,Date\n");
|
||||||
|
|
||||||
|
for s in submissions {
|
||||||
|
let pct = if s.total > 0 { (s.score * 100) / s.total } else { 0 };
|
||||||
|
csv.push_str(&format!(
|
||||||
|
"{},{},{},{},{}%,{}\n",
|
||||||
|
s.last_name, s.first_name,
|
||||||
|
s.score, s.total, pct,
|
||||||
|
s.submitted_at.format("%d/%m/%Y %H:%M")
|
||||||
|
));
|
||||||
|
}
|
||||||
|
|
||||||
|
Ok(csv)
|
||||||
|
}
|
||||||
|
|
||||||
|
// ── Reset étudiant ────────────────────────────────────────────────────────────
|
||||||
|
|
||||||
|
#[server]
|
||||||
|
pub async fn reset_student(
|
||||||
|
quiz_id: i64,
|
||||||
|
first_name: String,
|
||||||
|
last_name: String,
|
||||||
|
) -> Result<(), ServerFnError> {
|
||||||
|
use axum::Extension;
|
||||||
|
use leptos_axum::extract;
|
||||||
|
use sqlx::SqlitePool;
|
||||||
|
|
||||||
|
let Extension(pool): Extension<SqlitePool> = extract().await?;
|
||||||
|
|
||||||
|
let fn_lower = first_name.trim().to_lowercase();
|
||||||
|
let ln_lower = last_name.trim().to_lowercase();
|
||||||
|
|
||||||
|
// Supprime toutes les soumissions de cet étudiant pour ce quiz
|
||||||
|
sqlx::query!(
|
||||||
|
r#"DELETE FROM submissions
|
||||||
|
WHERE quiz_id = ?
|
||||||
|
AND LOWER(TRIM(first_name)) = ?
|
||||||
|
AND LOWER(TRIM(last_name)) = ?"#,
|
||||||
|
quiz_id, fn_lower, ln_lower
|
||||||
|
)
|
||||||
|
.execute(&pool)
|
||||||
|
.await
|
||||||
|
.map_err(|e| ServerFnError::new(e.to_string()))?;
|
||||||
|
|
||||||
|
// Supprime aussi les anciens resets (utilisés ou non) pour repartir propre
|
||||||
|
sqlx::query!(
|
||||||
|
r#"DELETE FROM resets
|
||||||
|
WHERE quiz_id = ?
|
||||||
|
AND LOWER(TRIM(first_name)) = ?
|
||||||
|
AND LOWER(TRIM(last_name)) = ?"#,
|
||||||
|
quiz_id, fn_lower, ln_lower
|
||||||
|
)
|
||||||
|
.execute(&pool)
|
||||||
|
.await
|
||||||
|
.map_err(|e| ServerFnError::new(e.to_string()))?;
|
||||||
|
|
||||||
|
// Ajoute un nouveau reset token frais
|
||||||
|
sqlx::query!(
|
||||||
|
"INSERT INTO resets (quiz_id, first_name, last_name) VALUES (?, ?, ?)",
|
||||||
|
quiz_id, fn_lower, ln_lower // ← lowercase, pas les originaux
|
||||||
|
)
|
||||||
|
.execute(&pool)
|
||||||
|
.await
|
||||||
|
.map_err(|e| ServerFnError::new(e.to_string()))?;
|
||||||
|
|
||||||
|
Ok(())
|
||||||
|
}
|
||||||
|
|
||||||
|
#[server]
|
||||||
|
pub async fn get_resets(quiz_id: i64) -> Result<Vec<Reset>, ServerFnError> {
|
||||||
|
use axum::Extension;
|
||||||
|
use leptos_axum::extract;
|
||||||
|
use sqlx::SqlitePool;
|
||||||
|
|
||||||
|
let Extension(pool): Extension<SqlitePool> = extract().await?;
|
||||||
|
|
||||||
|
let resets = sqlx::query_as!(
|
||||||
|
Reset,
|
||||||
|
r#"SELECT id, quiz_id, first_name, last_name, used as "used: bool"
|
||||||
|
FROM resets WHERE quiz_id = ? ORDER BY created_at DESC"#,
|
||||||
|
quiz_id
|
||||||
|
)
|
||||||
|
.fetch_all(&pool)
|
||||||
|
.await
|
||||||
|
.map_err(|e| ServerFnError::new(e.to_string()))?;
|
||||||
|
|
||||||
|
Ok(resets)
|
||||||
|
}
|
||||||
|
|
||||||
|
// ── Stats ─────────────────────────────────────────────────────────────────────
|
||||||
|
|
||||||
|
#[server]
|
||||||
|
pub async fn get_quiz_stats(quiz_id: i64) -> Result<QuizStats, ServerFnError> {
|
||||||
|
use axum::Extension;
|
||||||
|
use leptos_axum::extract;
|
||||||
|
use sqlx::SqlitePool;
|
||||||
|
|
||||||
|
let Extension(pool): Extension<SqlitePool> = extract().await?;
|
||||||
|
|
||||||
|
let submissions = sqlx::query_as!(
|
||||||
|
QuizSubmission,
|
||||||
|
r#"SELECT id, quiz_id, first_name, last_name, score, total,
|
||||||
|
submitted_at as "submitted_at: chrono::DateTime<chrono::Utc>"
|
||||||
|
FROM submissions WHERE quiz_id = ? ORDER BY score DESC"#,
|
||||||
|
quiz_id
|
||||||
|
)
|
||||||
|
.fetch_all(&pool)
|
||||||
|
.await
|
||||||
|
.map_err(|e| ServerFnError::new(e.to_string()))?;
|
||||||
|
|
||||||
|
let total_submissions = submissions.len() as i64;
|
||||||
|
|
||||||
|
if total_submissions == 0 {
|
||||||
|
return Ok(QuizStats {
|
||||||
|
total_submissions: 0,
|
||||||
|
average_score: 0.0,
|
||||||
|
average_pct: 0.0,
|
||||||
|
score_distribution: vec![],
|
||||||
|
question_stats: vec![],
|
||||||
|
});
|
||||||
|
}
|
||||||
|
|
||||||
|
let average_score = submissions.iter()
|
||||||
|
.map(|s| s.score as f64)
|
||||||
|
.sum::<f64>() / total_submissions as f64;
|
||||||
|
|
||||||
|
let average_pct = submissions.iter()
|
||||||
|
.map(|s| if s.total > 0 { (s.score as f64 / s.total as f64) * 100.0 } else { 0.0 })
|
||||||
|
.sum::<f64>() / total_submissions as f64;
|
||||||
|
|
||||||
|
// Distribution des scores
|
||||||
|
let mut dist_map = std::collections::HashMap::new();
|
||||||
|
for s in &submissions {
|
||||||
|
*dist_map.entry(s.score).or_insert(0i64) += 1;
|
||||||
|
}
|
||||||
|
let mut score_distribution: Vec<(i64, i64)> = dist_map.into_iter().collect();
|
||||||
|
score_distribution.sort_by_key(|(score, _)| *score);
|
||||||
|
|
||||||
|
// Stats par question
|
||||||
|
let rows = sqlx::query!(
|
||||||
|
r#"SELECT
|
||||||
|
q.id as question_id,
|
||||||
|
q.text as question_text,
|
||||||
|
q.section,
|
||||||
|
COUNT(sa.id) as "total_count: i64",
|
||||||
|
SUM(CASE WHEN sa.correct = 1 THEN 1 ELSE 0 END) as "correct_count: i64"
|
||||||
|
FROM questions q
|
||||||
|
LEFT JOIN student_answers sa ON sa.question_id = q.id
|
||||||
|
LEFT JOIN submissions s ON s.id = sa.submission_id AND s.quiz_id = ?
|
||||||
|
WHERE q.quiz_id = ?
|
||||||
|
GROUP BY q.id
|
||||||
|
ORDER BY q.position"#,
|
||||||
|
quiz_id, quiz_id
|
||||||
|
)
|
||||||
|
.fetch_all(&pool)
|
||||||
|
.await
|
||||||
|
.map_err(|e| ServerFnError::new(e.to_string()))?;
|
||||||
|
|
||||||
|
let question_stats = rows.into_iter().map(|row| {
|
||||||
|
let total = row.total_count;
|
||||||
|
let correct = row.correct_count;
|
||||||
|
let rate = if total > 0 { correct as f64 / total as f64 * 100.0 } else { 0.0 };
|
||||||
|
QuestionStat {
|
||||||
|
question_id: row.question_id,
|
||||||
|
question_text: row.question_text,
|
||||||
|
section: row.section,
|
||||||
|
correct_count: correct,
|
||||||
|
total_count: total,
|
||||||
|
success_rate: rate,
|
||||||
|
}
|
||||||
|
}).collect();
|
||||||
|
|
||||||
|
Ok(QuizStats {
|
||||||
|
total_submissions,
|
||||||
|
average_score,
|
||||||
|
average_pct,
|
||||||
|
score_distribution,
|
||||||
|
question_stats,
|
||||||
|
})
|
||||||
|
}
|
||||||
@@ -0,0 +1,116 @@
|
|||||||
|
pub mod student;
|
||||||
|
pub mod admin;
|
||||||
|
|
||||||
|
use leptos::prelude::*;
|
||||||
|
|
||||||
|
// ── Config helpers (SSR only) ─────────────────────────────────────────────────
|
||||||
|
#[cfg(feature = "ssr")]
|
||||||
|
pub async fn get_config_value(pool: &sqlx::SqlitePool, key: &str, default: &str) -> String {
|
||||||
|
sqlx::query_scalar!("SELECT value FROM config WHERE key = ?", key)
|
||||||
|
.fetch_optional(pool)
|
||||||
|
.await
|
||||||
|
.ok()
|
||||||
|
.flatten()
|
||||||
|
.unwrap_or_else(|| default.to_string())
|
||||||
|
}
|
||||||
|
|
||||||
|
#[server]
|
||||||
|
pub async fn login(password: String, is_admin: bool) -> Result<bool, ServerFnError> {
|
||||||
|
use axum::Extension;
|
||||||
|
use leptos_axum::extract;
|
||||||
|
use sqlx::SqlitePool;
|
||||||
|
use axum_extra::extract::cookie::{Cookie, SameSite};
|
||||||
|
use leptos_axum::ResponseOptions;
|
||||||
|
use axum::http::header;
|
||||||
|
use crate::middleware::{SESSION_COOKIE, ADMIN_COOKIE};
|
||||||
|
|
||||||
|
let Extension(pool): Extension<SqlitePool> = extract().await?;
|
||||||
|
|
||||||
|
let key = if is_admin { "admin_password" } else { "session_password" };
|
||||||
|
let default = if is_admin { "admin" } else { "changeme" };
|
||||||
|
let expected = get_config_value(&pool, key, default).await;
|
||||||
|
|
||||||
|
if password != expected {
|
||||||
|
return Ok(false);
|
||||||
|
}
|
||||||
|
|
||||||
|
let cookie_name = if is_admin { ADMIN_COOKIE } else { SESSION_COOKIE };
|
||||||
|
let cookie = Cookie::build((cookie_name, password))
|
||||||
|
.path("/")
|
||||||
|
.http_only(true)
|
||||||
|
.same_site(SameSite::Lax)
|
||||||
|
.build();
|
||||||
|
|
||||||
|
let response = expect_context::<ResponseOptions>();
|
||||||
|
response.append_header(
|
||||||
|
header::SET_COOKIE,
|
||||||
|
cookie.to_string().parse().unwrap(),
|
||||||
|
);
|
||||||
|
|
||||||
|
Ok(true)
|
||||||
|
}
|
||||||
|
|
||||||
|
#[server]
|
||||||
|
pub async fn logout(is_admin: bool) -> Result<(), ServerFnError> {
|
||||||
|
use axum_extra::extract::cookie::{Cookie, SameSite};
|
||||||
|
use leptos_axum::ResponseOptions;
|
||||||
|
use axum::http::header;
|
||||||
|
use crate::middleware::{SESSION_COOKIE, ADMIN_COOKIE};
|
||||||
|
|
||||||
|
let cookie_name = if is_admin { ADMIN_COOKIE } else { SESSION_COOKIE };
|
||||||
|
let cookie = Cookie::build((cookie_name, ""))
|
||||||
|
.path("/")
|
||||||
|
.http_only(true)
|
||||||
|
.same_site(SameSite::Lax)
|
||||||
|
.max_age(time::Duration::seconds(0))
|
||||||
|
.build();
|
||||||
|
|
||||||
|
let response = expect_context::<ResponseOptions>();
|
||||||
|
response.append_header(
|
||||||
|
header::SET_COOKIE,
|
||||||
|
cookie.to_string().parse().unwrap(),
|
||||||
|
);
|
||||||
|
|
||||||
|
Ok(())
|
||||||
|
}
|
||||||
|
|
||||||
|
#[server]
|
||||||
|
pub async fn check_session_valid() -> Result<bool, ServerFnError> {
|
||||||
|
use crate::middleware::check_session;
|
||||||
|
Ok(check_session().await)
|
||||||
|
}
|
||||||
|
|
||||||
|
#[server]
|
||||||
|
pub async fn check_admin_valid() -> Result<bool, ServerFnError> {
|
||||||
|
use crate::middleware::check_admin;
|
||||||
|
Ok(check_admin().await)
|
||||||
|
}
|
||||||
|
|
||||||
|
#[server]
|
||||||
|
pub async fn get_config(key: String) -> Result<String, ServerFnError> {
|
||||||
|
use axum::Extension;
|
||||||
|
use leptos_axum::extract;
|
||||||
|
use sqlx::SqlitePool;
|
||||||
|
|
||||||
|
let Extension(pool): Extension<SqlitePool> = extract().await?;
|
||||||
|
Ok(get_config_value(&pool, &key, "").await)
|
||||||
|
}
|
||||||
|
|
||||||
|
#[server]
|
||||||
|
pub async fn set_config(key: String, value: String) -> Result<(), ServerFnError> {
|
||||||
|
use axum::Extension;
|
||||||
|
use leptos_axum::extract;
|
||||||
|
use sqlx::SqlitePool;
|
||||||
|
|
||||||
|
let Extension(pool): Extension<SqlitePool> = extract().await?;
|
||||||
|
|
||||||
|
sqlx::query!(
|
||||||
|
"INSERT INTO config (key, value) VALUES (?, ?) ON CONFLICT(key) DO UPDATE SET value = ?",
|
||||||
|
key, value, value
|
||||||
|
)
|
||||||
|
.execute(&pool)
|
||||||
|
.await
|
||||||
|
.map_err(|e| ServerFnError::new(e.to_string()))?;
|
||||||
|
|
||||||
|
Ok(())
|
||||||
|
}
|
||||||
@@ -0,0 +1,391 @@
|
|||||||
|
use leptos::prelude::*;
|
||||||
|
use crate::models::*;
|
||||||
|
|
||||||
|
#[server]
|
||||||
|
pub async fn get_active_quizzes() -> Result<Vec<Quiz>, ServerFnError> {
|
||||||
|
use axum::Extension;
|
||||||
|
use leptos_axum::extract;
|
||||||
|
use sqlx::SqlitePool;
|
||||||
|
|
||||||
|
let Extension(pool): Extension<SqlitePool> = extract().await?;
|
||||||
|
|
||||||
|
let quizzes = sqlx::query_as!(
|
||||||
|
Quiz,
|
||||||
|
r#"SELECT id, title, description,
|
||||||
|
active as "active: bool",
|
||||||
|
shuffle_questions as "shuffle_questions: bool",
|
||||||
|
shuffle_answers as "shuffle_answers: bool",
|
||||||
|
time_limit_seconds,
|
||||||
|
created_at as "created_at: chrono::DateTime<chrono::Utc>"
|
||||||
|
FROM quizzes WHERE active = 1 ORDER BY created_at DESC"#
|
||||||
|
)
|
||||||
|
.fetch_all(&pool)
|
||||||
|
.await
|
||||||
|
.map_err(|e| ServerFnError::new(e.to_string()))?;
|
||||||
|
|
||||||
|
Ok(quizzes)
|
||||||
|
}
|
||||||
|
|
||||||
|
#[server]
|
||||||
|
pub async fn get_quiz_with_questions(quiz_id: i64) -> Result<Option<(Quiz, Vec<QuestionWithAnswers>)>, ServerFnError> {
|
||||||
|
use axum::Extension;
|
||||||
|
use leptos_axum::extract;
|
||||||
|
use sqlx::SqlitePool;
|
||||||
|
|
||||||
|
let Extension(pool): Extension<SqlitePool> = extract().await?;
|
||||||
|
|
||||||
|
let quiz = sqlx::query_as!(
|
||||||
|
Quiz,
|
||||||
|
r#"SELECT id, title, description,
|
||||||
|
active as "active: bool",
|
||||||
|
shuffle_questions as "shuffle_questions: bool",
|
||||||
|
shuffle_answers as "shuffle_answers: bool",
|
||||||
|
time_limit_seconds,
|
||||||
|
created_at as "created_at: chrono::DateTime<chrono::Utc>"
|
||||||
|
FROM quizzes WHERE id = ?"#,
|
||||||
|
quiz_id
|
||||||
|
)
|
||||||
|
.fetch_optional(&pool)
|
||||||
|
.await
|
||||||
|
.map_err(|e| ServerFnError::new(e.to_string()))?;
|
||||||
|
|
||||||
|
let Some(quiz) = quiz else { return Ok(None) };
|
||||||
|
|
||||||
|
let questions = sqlx::query_as!(
|
||||||
|
Question,
|
||||||
|
"SELECT id, quiz_id, text, section, position FROM questions WHERE quiz_id = ? ORDER BY position",
|
||||||
|
quiz_id
|
||||||
|
)
|
||||||
|
.fetch_all(&pool)
|
||||||
|
.await
|
||||||
|
.map_err(|e| ServerFnError::new(e.to_string()))?;
|
||||||
|
|
||||||
|
let mut result = Vec::new();
|
||||||
|
for question in questions {
|
||||||
|
let mut answers = sqlx::query_as!(
|
||||||
|
Answer,
|
||||||
|
r#"SELECT id, question_id, label, text, correct as "correct: bool"
|
||||||
|
FROM answers WHERE question_id = ? ORDER BY label"#,
|
||||||
|
question.id
|
||||||
|
)
|
||||||
|
.fetch_all(&pool)
|
||||||
|
.await
|
||||||
|
.map_err(|e| ServerFnError::new(e.to_string()))?;
|
||||||
|
|
||||||
|
if quiz.shuffle_answers {
|
||||||
|
use std::collections::hash_map::DefaultHasher;
|
||||||
|
use std::hash::{Hash, Hasher};
|
||||||
|
let mut hasher = DefaultHasher::new();
|
||||||
|
question.id.hash(&mut hasher);
|
||||||
|
chrono::Utc::now().timestamp_subsec_nanos().hash(&mut hasher);
|
||||||
|
let seed = hasher.finish();
|
||||||
|
let n = answers.len();
|
||||||
|
let mut rng_state = seed;
|
||||||
|
for i in (1..n).rev() {
|
||||||
|
rng_state = rng_state.wrapping_mul(6364136223846793005).wrapping_add(1442695040888963407);
|
||||||
|
let j = (rng_state >> 33) as usize % (i + 1);
|
||||||
|
answers.swap(i, j);
|
||||||
|
}
|
||||||
|
}
|
||||||
|
|
||||||
|
result.push(QuestionWithAnswers { question, answers });
|
||||||
|
}
|
||||||
|
|
||||||
|
if quiz.shuffle_questions {
|
||||||
|
use std::collections::hash_map::DefaultHasher;
|
||||||
|
use std::hash::{Hash, Hasher};
|
||||||
|
let mut hasher = DefaultHasher::new();
|
||||||
|
quiz_id.hash(&mut hasher);
|
||||||
|
chrono::Utc::now().timestamp_subsec_nanos().hash(&mut hasher);
|
||||||
|
let seed = hasher.finish();
|
||||||
|
let n = result.len();
|
||||||
|
let mut rng_state = seed;
|
||||||
|
for i in (1..n).rev() {
|
||||||
|
rng_state = rng_state.wrapping_mul(6364136223846793005).wrapping_add(1442695040888963407);
|
||||||
|
let j = (rng_state >> 33) as usize % (i + 1);
|
||||||
|
result.swap(i, j);
|
||||||
|
}
|
||||||
|
}
|
||||||
|
|
||||||
|
Ok(Some((quiz, result)))
|
||||||
|
}
|
||||||
|
|
||||||
|
#[server]
|
||||||
|
pub async fn check_already_done(
|
||||||
|
quiz_id: i64,
|
||||||
|
first_name: String,
|
||||||
|
last_name: String,
|
||||||
|
) -> Result<bool, ServerFnError> {
|
||||||
|
use axum::Extension;
|
||||||
|
use leptos_axum::extract;
|
||||||
|
use sqlx::SqlitePool;
|
||||||
|
|
||||||
|
let Extension(pool): Extension<SqlitePool> = extract().await?;
|
||||||
|
|
||||||
|
let fn_lower = first_name.trim().to_lowercase();
|
||||||
|
let ln_lower = last_name.trim().to_lowercase();
|
||||||
|
|
||||||
|
let row = sqlx::query!(
|
||||||
|
r#"SELECT
|
||||||
|
EXISTS(
|
||||||
|
SELECT 1 FROM submissions
|
||||||
|
WHERE quiz_id = ?
|
||||||
|
AND LOWER(TRIM(first_name)) = ?
|
||||||
|
AND LOWER(TRIM(last_name)) = ?
|
||||||
|
) as existing,
|
||||||
|
EXISTS(
|
||||||
|
SELECT 1 FROM resets
|
||||||
|
WHERE quiz_id = ?
|
||||||
|
AND first_name = ?
|
||||||
|
AND last_name = ?
|
||||||
|
AND used = 0
|
||||||
|
) as has_reset"#,
|
||||||
|
quiz_id, fn_lower, ln_lower,
|
||||||
|
quiz_id, fn_lower, ln_lower
|
||||||
|
)
|
||||||
|
.fetch_one(&pool)
|
||||||
|
.await
|
||||||
|
.map_err(|e| ServerFnError::new(e.to_string()))?;
|
||||||
|
|
||||||
|
if row.existing == 0 {
|
||||||
|
return Ok(false);
|
||||||
|
}
|
||||||
|
|
||||||
|
Ok(row.has_reset == 0)
|
||||||
|
}
|
||||||
|
|
||||||
|
#[server]
|
||||||
|
pub async fn submit_quiz(
|
||||||
|
quiz_id: i64,
|
||||||
|
first_name: String,
|
||||||
|
last_name: String,
|
||||||
|
answers: Vec<(i64, i64)>,
|
||||||
|
) -> Result<i64, ServerFnError> {
|
||||||
|
use axum::Extension;
|
||||||
|
use leptos_axum::extract;
|
||||||
|
use sqlx::SqlitePool;
|
||||||
|
|
||||||
|
let Extension(pool): Extension<SqlitePool> = extract().await?;
|
||||||
|
|
||||||
|
let fn_lower = first_name.trim().to_lowercase();
|
||||||
|
let ln_lower = last_name.trim().to_lowercase();
|
||||||
|
|
||||||
|
// ── Anti-doublon via EXISTS ───────────────────────────────────────────────
|
||||||
|
let row = sqlx::query!(
|
||||||
|
r#"SELECT
|
||||||
|
EXISTS(
|
||||||
|
SELECT 1 FROM submissions
|
||||||
|
WHERE quiz_id = ?
|
||||||
|
AND first_name = ?
|
||||||
|
AND last_name = ?
|
||||||
|
) as existing,
|
||||||
|
EXISTS(
|
||||||
|
SELECT 1 FROM resets
|
||||||
|
WHERE quiz_id = ?
|
||||||
|
AND first_name = ?
|
||||||
|
AND last_name = ?
|
||||||
|
AND used = 0
|
||||||
|
) as has_reset"#,
|
||||||
|
quiz_id, fn_lower, ln_lower,
|
||||||
|
quiz_id, fn_lower, ln_lower
|
||||||
|
)
|
||||||
|
.fetch_one(&pool)
|
||||||
|
.await
|
||||||
|
.map_err(|e| ServerFnError::new(e.to_string()))?;
|
||||||
|
|
||||||
|
// Consomme le reset s'il existe (qu'il y ait une soumission ou non)
|
||||||
|
if row.has_reset != 0 {
|
||||||
|
sqlx::query!(
|
||||||
|
"UPDATE resets SET used = 1
|
||||||
|
WHERE quiz_id = ?
|
||||||
|
AND first_name = ?
|
||||||
|
AND last_name = ?
|
||||||
|
AND used = 0",
|
||||||
|
quiz_id, fn_lower, ln_lower
|
||||||
|
)
|
||||||
|
.execute(&pool)
|
||||||
|
.await
|
||||||
|
.map_err(|e| ServerFnError::new(e.to_string()))?;
|
||||||
|
}
|
||||||
|
|
||||||
|
// Bloque si soumission existante ET pas de reset accordé
|
||||||
|
if row.existing != 0 && row.has_reset == 0 {
|
||||||
|
return Err(ServerFnError::new("Vous avez déjà passé ce quiz."));
|
||||||
|
}
|
||||||
|
|
||||||
|
// ── Score ─────────────────────────────────────────────────────────────────
|
||||||
|
let mut score = 0i64;
|
||||||
|
let total = answers.len() as i64;
|
||||||
|
|
||||||
|
for (_, answer_id) in &answers {
|
||||||
|
let correct = sqlx::query_scalar!(
|
||||||
|
r#"SELECT correct as "correct: bool" FROM answers WHERE id = ?"#,
|
||||||
|
answer_id
|
||||||
|
)
|
||||||
|
.fetch_one(&pool)
|
||||||
|
.await
|
||||||
|
.map_err(|e| ServerFnError::new(e.to_string()))?;
|
||||||
|
|
||||||
|
if correct { score += 1; }
|
||||||
|
}
|
||||||
|
|
||||||
|
// ── Insertion ─────────────────────────────────────────────────────────────
|
||||||
|
let submission_id = sqlx::query!(
|
||||||
|
"INSERT INTO submissions (quiz_id, first_name, last_name, score, total) VALUES (?, ?, ?, ?, ?)",
|
||||||
|
quiz_id, fn_lower, ln_lower, score, total
|
||||||
|
)
|
||||||
|
.execute(&pool)
|
||||||
|
.await
|
||||||
|
.map_err(|e| ServerFnError::new(e.to_string()))?
|
||||||
|
.last_insert_rowid();
|
||||||
|
|
||||||
|
for (question_id, answer_id) in &answers {
|
||||||
|
let correct = sqlx::query_scalar!(
|
||||||
|
r#"SELECT correct as "correct: bool" FROM answers WHERE id = ?"#,
|
||||||
|
answer_id
|
||||||
|
)
|
||||||
|
.fetch_one(&pool)
|
||||||
|
.await
|
||||||
|
.map_err(|e| ServerFnError::new(e.to_string()))?;
|
||||||
|
|
||||||
|
sqlx::query!(
|
||||||
|
"INSERT INTO student_answers (submission_id, question_id, answer_id, correct) VALUES (?, ?, ?, ?)",
|
||||||
|
submission_id, question_id, answer_id, correct
|
||||||
|
)
|
||||||
|
.execute(&pool)
|
||||||
|
.await
|
||||||
|
.map_err(|e| ServerFnError::new(e.to_string()))?;
|
||||||
|
}
|
||||||
|
|
||||||
|
Ok(submission_id)
|
||||||
|
}
|
||||||
|
|
||||||
|
#[server]
|
||||||
|
pub async fn get_submission_result(submission_id: i64) -> Result<Option<(QuizSubmission, Vec<(SubmissionAnswer, Question, Answer)>)>, ServerFnError> {
|
||||||
|
use axum::Extension;
|
||||||
|
use leptos_axum::extract;
|
||||||
|
use sqlx::SqlitePool;
|
||||||
|
|
||||||
|
let Extension(pool): Extension<SqlitePool> = extract().await?;
|
||||||
|
|
||||||
|
let submission = sqlx::query_as!(
|
||||||
|
QuizSubmission,
|
||||||
|
r#"SELECT id, quiz_id, first_name, last_name, score, total,
|
||||||
|
submitted_at as "submitted_at: chrono::DateTime<chrono::Utc>"
|
||||||
|
FROM submissions WHERE id = ?"#,
|
||||||
|
submission_id
|
||||||
|
)
|
||||||
|
.fetch_optional(&pool)
|
||||||
|
.await
|
||||||
|
.map_err(|e| ServerFnError::new(e.to_string()))?;
|
||||||
|
|
||||||
|
let Some(submission) = submission else { return Ok(None) };
|
||||||
|
|
||||||
|
let details = sqlx::query!(
|
||||||
|
r#"SELECT
|
||||||
|
sa.id as sa_id,
|
||||||
|
sa.submission_id,
|
||||||
|
sa.question_id,
|
||||||
|
sa.answer_id,
|
||||||
|
sa.correct as "correct: bool",
|
||||||
|
q.text as question_text,
|
||||||
|
q.section,
|
||||||
|
q.position,
|
||||||
|
q.quiz_id,
|
||||||
|
a.label,
|
||||||
|
a.text as answer_text
|
||||||
|
FROM student_answers sa
|
||||||
|
JOIN questions q ON q.id = sa.question_id
|
||||||
|
JOIN answers a ON a.id = sa.answer_id
|
||||||
|
WHERE sa.submission_id = ?
|
||||||
|
ORDER BY q.position"#,
|
||||||
|
submission_id
|
||||||
|
)
|
||||||
|
.fetch_all(&pool)
|
||||||
|
.await
|
||||||
|
.map_err(|e| ServerFnError::new(e.to_string()))?;
|
||||||
|
|
||||||
|
let result = details.into_iter().map(|row| {
|
||||||
|
let student_answer = SubmissionAnswer {
|
||||||
|
id: row.sa_id,
|
||||||
|
submission_id: row.submission_id,
|
||||||
|
question_id: row.question_id,
|
||||||
|
answer_id: row.answer_id,
|
||||||
|
correct: row.correct,
|
||||||
|
};
|
||||||
|
let question = Question {
|
||||||
|
id: row.question_id,
|
||||||
|
quiz_id: row.quiz_id,
|
||||||
|
text: row.question_text,
|
||||||
|
section: row.section,
|
||||||
|
position: row.position,
|
||||||
|
};
|
||||||
|
let answer = Answer {
|
||||||
|
id: row.answer_id,
|
||||||
|
question_id: row.question_id,
|
||||||
|
label: row.label,
|
||||||
|
text: row.answer_text,
|
||||||
|
correct: row.correct,
|
||||||
|
};
|
||||||
|
(student_answer, question, answer)
|
||||||
|
}).collect();
|
||||||
|
|
||||||
|
Ok(Some((submission, result)))
|
||||||
|
}
|
||||||
|
|
||||||
|
#[server]
|
||||||
|
pub async fn get_result_details(submission_id: i64) -> Result<Option<(QuizSubmission, Vec<crate::models::ResultDetail>)>, ServerFnError> {
|
||||||
|
use axum::Extension;
|
||||||
|
use leptos_axum::extract;
|
||||||
|
use sqlx::SqlitePool;
|
||||||
|
use crate::models::ResultDetail;
|
||||||
|
|
||||||
|
let Extension(pool): Extension<SqlitePool> = extract().await?;
|
||||||
|
|
||||||
|
let submission = sqlx::query_as!(
|
||||||
|
QuizSubmission,
|
||||||
|
r#"SELECT id, quiz_id, first_name, last_name, score, total,
|
||||||
|
submitted_at as "submitted_at: chrono::DateTime<chrono::Utc>"
|
||||||
|
FROM submissions WHERE id = ?"#,
|
||||||
|
submission_id
|
||||||
|
)
|
||||||
|
.fetch_optional(&pool)
|
||||||
|
.await
|
||||||
|
.map_err(|e| ServerFnError::new(e.to_string()))?;
|
||||||
|
|
||||||
|
let Some(submission) = submission else { return Ok(None) };
|
||||||
|
|
||||||
|
let rows = sqlx::query!(
|
||||||
|
r#"SELECT
|
||||||
|
q.text as q_text,
|
||||||
|
q.section,
|
||||||
|
a.label as chosen_label,
|
||||||
|
a.text as chosen_text,
|
||||||
|
sa.correct as "is_correct: bool",
|
||||||
|
correct_a.label as correct_label,
|
||||||
|
correct_a.text as correct_text
|
||||||
|
FROM student_answers sa
|
||||||
|
JOIN questions q ON q.id = sa.question_id
|
||||||
|
JOIN answers a ON a.id = sa.answer_id
|
||||||
|
JOIN answers correct_a ON correct_a.question_id = sa.question_id
|
||||||
|
AND correct_a.correct = 1
|
||||||
|
WHERE sa.submission_id = ?
|
||||||
|
ORDER BY q.position"#,
|
||||||
|
submission_id
|
||||||
|
)
|
||||||
|
.fetch_all(&pool)
|
||||||
|
.await
|
||||||
|
.map_err(|e| ServerFnError::new(e.to_string()))?;
|
||||||
|
|
||||||
|
let details = rows.into_iter().map(|row| ResultDetail {
|
||||||
|
question_text: row.q_text,
|
||||||
|
section: row.section,
|
||||||
|
chosen_label: row.chosen_label,
|
||||||
|
chosen_text: row.chosen_text,
|
||||||
|
correct_label: row.correct_label.unwrap_or_default(),
|
||||||
|
correct_text: row.correct_text.unwrap_or_default(),
|
||||||
|
is_correct: row.is_correct,
|
||||||
|
}).collect();
|
||||||
|
|
||||||
|
Ok(Some((submission, details)))
|
||||||
|
}
|
||||||
+902
@@ -0,0 +1,902 @@
|
|||||||
|
@import "tailwindcss";
|
||||||
|
@import url('https://fonts.googleapis.com/css2?family=Space+Grotesk:wght@400;500;600;700&family=Inter:wght@300;400;500;600&display=swap');
|
||||||
|
|
||||||
|
@theme {
|
||||||
|
--color-enuxia-dark: #0A0B14;
|
||||||
|
--color-enuxia-dark-2: #0E0F1A;
|
||||||
|
--color-enuxia-dark-3: #12141F;
|
||||||
|
--color-enuxia-border: #1A1D2E;
|
||||||
|
--color-enuxia-border-2:#242740;
|
||||||
|
--color-enuxia-blue: #4F8EFF;
|
||||||
|
--color-enuxia-purple: #8B5CF6;
|
||||||
|
--color-enuxia-green: #22C55E;
|
||||||
|
--color-enuxia-text: #E8EAF0;
|
||||||
|
--color-enuxia-muted: #5A6080;
|
||||||
|
--color-enuxia-subtle: #2A2D40;
|
||||||
|
}
|
||||||
|
|
||||||
|
/* ── Reset & Base ─────────────────────────────────────────────────────────── */
|
||||||
|
*, *::before, *::after { box-sizing: border-box; }
|
||||||
|
html { scroll-behavior: smooth; }
|
||||||
|
|
||||||
|
body {
|
||||||
|
background-color: var(--color-enuxia-dark);
|
||||||
|
color: var(--color-enuxia-text);
|
||||||
|
font-family: 'Inter', system-ui, sans-serif;
|
||||||
|
font-size: 15px;
|
||||||
|
line-height: 1.6;
|
||||||
|
min-height: 100vh;
|
||||||
|
-webkit-font-smoothing: antialiased;
|
||||||
|
background-image:
|
||||||
|
radial-gradient(ellipse 100% 60% at 50% -10%, rgba(79, 142, 255, 0.06) 0%, transparent 70%),
|
||||||
|
radial-gradient(ellipse 50% 40% at 90% 90%, rgba(139, 92, 246, 0.04) 0%, transparent 60%);
|
||||||
|
}
|
||||||
|
|
||||||
|
h1, h2, h3 {
|
||||||
|
font-family: 'Space Grotesk', sans-serif;
|
||||||
|
font-weight: 700;
|
||||||
|
letter-spacing: -0.02em;
|
||||||
|
line-height: 1.15;
|
||||||
|
}
|
||||||
|
|
||||||
|
a { text-decoration: none; color: inherit; }
|
||||||
|
|
||||||
|
/* ── Inputs ───────────────────────────────────────────────────────────────── */
|
||||||
|
input[type="text"],
|
||||||
|
input[type="password"],
|
||||||
|
textarea {
|
||||||
|
width: 100%;
|
||||||
|
padding: 12px 16px;
|
||||||
|
border-radius: 10px;
|
||||||
|
font-family: 'Inter', sans-serif;
|
||||||
|
font-size: 14px;
|
||||||
|
outline: none;
|
||||||
|
transition: border-color 0.2s, box-shadow 0.2s;
|
||||||
|
background-color: var(--color-enuxia-dark);
|
||||||
|
border: 1px solid var(--color-enuxia-border-2);
|
||||||
|
color: var(--color-enuxia-text);
|
||||||
|
}
|
||||||
|
|
||||||
|
input[type="text"]::placeholder,
|
||||||
|
input[type="password"]::placeholder,
|
||||||
|
textarea::placeholder { color: var(--color-enuxia-muted); }
|
||||||
|
|
||||||
|
input[type="text"]:focus,
|
||||||
|
input[type="password"]:focus,
|
||||||
|
textarea:focus {
|
||||||
|
border-color: var(--color-enuxia-blue);
|
||||||
|
box-shadow: 0 0 0 3px rgba(79, 142, 255, 0.12);
|
||||||
|
}
|
||||||
|
|
||||||
|
textarea { resize: vertical; min-height: 80px; }
|
||||||
|
|
||||||
|
input[type="checkbox"],
|
||||||
|
input[type="radio"] {
|
||||||
|
accent-color: var(--color-enuxia-blue);
|
||||||
|
width: 16px;
|
||||||
|
height: 16px;
|
||||||
|
cursor: pointer;
|
||||||
|
}
|
||||||
|
|
||||||
|
/* ── Boutons globaux ──────────────────────────────────────────────────────── */
|
||||||
|
button {
|
||||||
|
font-family: 'Inter', sans-serif;
|
||||||
|
font-weight: 500;
|
||||||
|
cursor: pointer;
|
||||||
|
transition: all 0.2s;
|
||||||
|
border: none;
|
||||||
|
}
|
||||||
|
|
||||||
|
.btn-primary {
|
||||||
|
display: inline-flex;
|
||||||
|
align-items: center;
|
||||||
|
justify-content: center;
|
||||||
|
padding: 11px 22px;
|
||||||
|
border-radius: 10px;
|
||||||
|
font-size: 14px;
|
||||||
|
font-weight: 600;
|
||||||
|
background: var(--color-enuxia-blue);
|
||||||
|
color: white;
|
||||||
|
}
|
||||||
|
.btn-primary:hover {
|
||||||
|
background: #3a7aff;
|
||||||
|
transform: translateY(-1px);
|
||||||
|
box-shadow: 0 4px 20px rgba(79, 142, 255, 0.3);
|
||||||
|
}
|
||||||
|
|
||||||
|
.btn-ghost {
|
||||||
|
display: inline-flex;
|
||||||
|
align-items: center;
|
||||||
|
gap: 6px;
|
||||||
|
padding: 9px 16px;
|
||||||
|
border-radius: 8px;
|
||||||
|
font-size: 13px;
|
||||||
|
background: var(--color-enuxia-border);
|
||||||
|
color: var(--color-enuxia-muted);
|
||||||
|
border: 1px solid var(--color-enuxia-border-2);
|
||||||
|
}
|
||||||
|
.btn-ghost:hover {
|
||||||
|
background: var(--color-enuxia-subtle);
|
||||||
|
color: var(--color-enuxia-text);
|
||||||
|
}
|
||||||
|
|
||||||
|
.btn-green {
|
||||||
|
display: inline-flex;
|
||||||
|
align-items: center;
|
||||||
|
gap: 6px;
|
||||||
|
padding: 10px 20px;
|
||||||
|
border-radius: 10px;
|
||||||
|
font-size: 14px;
|
||||||
|
font-weight: 600;
|
||||||
|
background: rgba(34, 197, 94, 0.12);
|
||||||
|
color: var(--color-enuxia-green);
|
||||||
|
border: 1px solid rgba(34, 197, 94, 0.25);
|
||||||
|
}
|
||||||
|
.btn-green:hover {
|
||||||
|
background: rgba(34, 197, 94, 0.2);
|
||||||
|
box-shadow: 0 4px 16px rgba(34, 197, 94, 0.15);
|
||||||
|
}
|
||||||
|
|
||||||
|
.btn-danger {
|
||||||
|
display: inline-flex;
|
||||||
|
align-items: center;
|
||||||
|
padding: 7px 14px;
|
||||||
|
border-radius: 8px;
|
||||||
|
font-size: 13px;
|
||||||
|
background: rgba(239, 68, 68, 0.08);
|
||||||
|
color: #f87171;
|
||||||
|
border: 1px solid rgba(239, 68, 68, 0.2);
|
||||||
|
}
|
||||||
|
.btn-danger:hover { background: rgba(239, 68, 68, 0.18); }
|
||||||
|
|
||||||
|
.btn-purple {
|
||||||
|
display: inline-flex;
|
||||||
|
align-items: center;
|
||||||
|
gap: 6px;
|
||||||
|
padding: 10px 20px;
|
||||||
|
border-radius: 10px;
|
||||||
|
font-size: 14px;
|
||||||
|
font-weight: 600;
|
||||||
|
background: rgba(139, 92, 246, 0.12);
|
||||||
|
color: var(--color-enuxia-purple);
|
||||||
|
border: 1px solid rgba(139, 92, 246, 0.25);
|
||||||
|
}
|
||||||
|
.btn-purple:hover { background: rgba(139, 92, 246, 0.2); }
|
||||||
|
|
||||||
|
/* ── Messages ─────────────────────────────────────────────────────────────── */
|
||||||
|
.msg-error {
|
||||||
|
padding: 10px 16px;
|
||||||
|
border-radius: 8px;
|
||||||
|
font-size: 13px;
|
||||||
|
background: rgba(239, 68, 68, 0.08);
|
||||||
|
color: #f87171;
|
||||||
|
border: 1px solid rgba(239, 68, 68, 0.2);
|
||||||
|
}
|
||||||
|
|
||||||
|
.msg-empty {
|
||||||
|
color: var(--color-enuxia-muted);
|
||||||
|
text-align: center;
|
||||||
|
padding: 60px 20px;
|
||||||
|
font-size: 14px;
|
||||||
|
}
|
||||||
|
|
||||||
|
/* ── Utilitaires ──────────────────────────────────────────────────────────── */
|
||||||
|
.divider { height: 1px; background: var(--color-enuxia-border); width: 100%; }
|
||||||
|
|
||||||
|
/* ════════════════════════════════════════════════════════════════════════════
|
||||||
|
LOGIN
|
||||||
|
════════════════════════════════════════════════════════════════════════════ */
|
||||||
|
.login-page {
|
||||||
|
min-height: 100vh;
|
||||||
|
display: flex;
|
||||||
|
align-items: center;
|
||||||
|
justify-content: center;
|
||||||
|
padding: 24px;
|
||||||
|
position: relative;
|
||||||
|
overflow: hidden;
|
||||||
|
}
|
||||||
|
|
||||||
|
.login-bg-glow {
|
||||||
|
position: absolute;
|
||||||
|
width: 600px;
|
||||||
|
height: 600px;
|
||||||
|
border-radius: 50%;
|
||||||
|
background: radial-gradient(ellipse, rgba(79, 142, 255, 0.08) 0%, transparent 70%);
|
||||||
|
pointer-events: none;
|
||||||
|
top: 50%;
|
||||||
|
left: 50%;
|
||||||
|
transform: translate(-50%, -50%);
|
||||||
|
}
|
||||||
|
|
||||||
|
.admin-glow {
|
||||||
|
background: radial-gradient(ellipse, rgba(139, 92, 246, 0.08) 0%, transparent 70%);
|
||||||
|
}
|
||||||
|
|
||||||
|
.login-card {
|
||||||
|
width: 100%;
|
||||||
|
max-width: 440px;
|
||||||
|
background: var(--color-enuxia-dark-2);
|
||||||
|
border: 1px solid var(--color-enuxia-border-2);
|
||||||
|
border-radius: 24px;
|
||||||
|
padding: 36px;
|
||||||
|
display: flex;
|
||||||
|
flex-direction: column;
|
||||||
|
gap: 24px;
|
||||||
|
position: relative;
|
||||||
|
z-index: 1;
|
||||||
|
box-shadow: 0 40px 80px rgba(0,0,0,0.5), 0 0 0 1px rgba(255,255,255,0.03);
|
||||||
|
}
|
||||||
|
|
||||||
|
.login-header {
|
||||||
|
display: flex;
|
||||||
|
align-items: center;
|
||||||
|
gap: 14px;
|
||||||
|
}
|
||||||
|
|
||||||
|
.login-title {
|
||||||
|
font-family: 'Space Grotesk', sans-serif;
|
||||||
|
font-size: 22px;
|
||||||
|
font-weight: 700;
|
||||||
|
color: var(--color-enuxia-text);
|
||||||
|
margin: 0;
|
||||||
|
letter-spacing: -0.02em;
|
||||||
|
}
|
||||||
|
|
||||||
|
.login-sub {
|
||||||
|
font-size: 13px;
|
||||||
|
color: var(--color-enuxia-muted);
|
||||||
|
margin: 2px 0 0 0;
|
||||||
|
}
|
||||||
|
|
||||||
|
.admin-icon {
|
||||||
|
width: 36px;
|
||||||
|
height: 36px;
|
||||||
|
border-radius: 10px;
|
||||||
|
background: rgba(139, 92, 246, 0.15);
|
||||||
|
border: 1px solid rgba(139, 92, 246, 0.3);
|
||||||
|
display: flex;
|
||||||
|
align-items: center;
|
||||||
|
justify-content: center;
|
||||||
|
font-size: 18px;
|
||||||
|
flex-shrink: 0;
|
||||||
|
}
|
||||||
|
|
||||||
|
.login-divider { height: 1px; background: var(--color-enuxia-border); }
|
||||||
|
|
||||||
|
.login-form { display: flex; flex-direction: column; gap: 12px; }
|
||||||
|
|
||||||
|
.field-label {
|
||||||
|
font-size: 12px;
|
||||||
|
font-weight: 600;
|
||||||
|
letter-spacing: 0.06em;
|
||||||
|
text-transform: uppercase;
|
||||||
|
color: var(--color-enuxia-muted);
|
||||||
|
}
|
||||||
|
|
||||||
|
.pwd-wrapper { position: relative; }
|
||||||
|
|
||||||
|
.pwd-input {
|
||||||
|
width: 100%;
|
||||||
|
padding: 13px 46px 13px 16px;
|
||||||
|
border-radius: 12px;
|
||||||
|
font-size: 15px;
|
||||||
|
font-family: 'Inter', sans-serif;
|
||||||
|
background: var(--color-enuxia-dark);
|
||||||
|
border: 1px solid var(--color-enuxia-border-2);
|
||||||
|
color: var(--color-enuxia-text);
|
||||||
|
outline: none;
|
||||||
|
transition: border-color 0.2s, box-shadow 0.2s;
|
||||||
|
}
|
||||||
|
.pwd-input:focus {
|
||||||
|
border-color: var(--color-enuxia-blue);
|
||||||
|
box-shadow: 0 0 0 3px rgba(79, 142, 255, 0.12);
|
||||||
|
}
|
||||||
|
|
||||||
|
.pwd-toggle {
|
||||||
|
position: absolute;
|
||||||
|
right: 14px;
|
||||||
|
top: 50%;
|
||||||
|
transform: translateY(-50%);
|
||||||
|
background: none;
|
||||||
|
border: none;
|
||||||
|
color: var(--color-enuxia-muted);
|
||||||
|
cursor: pointer;
|
||||||
|
padding: 4px;
|
||||||
|
display: flex;
|
||||||
|
align-items: center;
|
||||||
|
transition: color 0.15s;
|
||||||
|
}
|
||||||
|
.pwd-toggle:hover { color: var(--color-enuxia-text); }
|
||||||
|
|
||||||
|
.field-error {
|
||||||
|
display: flex;
|
||||||
|
align-items: center;
|
||||||
|
gap: 6px;
|
||||||
|
font-size: 13px;
|
||||||
|
color: #f87171;
|
||||||
|
padding: 10px 14px;
|
||||||
|
border-radius: 8px;
|
||||||
|
background: rgba(239, 68, 68, 0.08);
|
||||||
|
border: 1px solid rgba(239, 68, 68, 0.2);
|
||||||
|
}
|
||||||
|
|
||||||
|
.btn-submit {
|
||||||
|
width: 100%;
|
||||||
|
padding: 14px;
|
||||||
|
border-radius: 12px;
|
||||||
|
font-size: 15px;
|
||||||
|
font-weight: 600;
|
||||||
|
font-family: 'Inter', sans-serif;
|
||||||
|
background: var(--color-enuxia-blue);
|
||||||
|
color: white;
|
||||||
|
border: none;
|
||||||
|
cursor: pointer;
|
||||||
|
transition: all 0.2s;
|
||||||
|
display: flex;
|
||||||
|
align-items: center;
|
||||||
|
justify-content: center;
|
||||||
|
min-height: 50px;
|
||||||
|
margin-top: 4px;
|
||||||
|
}
|
||||||
|
.btn-submit:hover:not(.loading) {
|
||||||
|
background: #3a7aff;
|
||||||
|
box-shadow: 0 6px 24px rgba(79, 142, 255, 0.35);
|
||||||
|
transform: translateY(-1px);
|
||||||
|
}
|
||||||
|
.btn-submit.loading {
|
||||||
|
background: rgba(79, 142, 255, 0.5);
|
||||||
|
cursor: not-allowed;
|
||||||
|
}
|
||||||
|
|
||||||
|
.spinner {
|
||||||
|
width: 18px;
|
||||||
|
height: 18px;
|
||||||
|
border: 2px solid rgba(255,255,255,0.3);
|
||||||
|
border-top-color: white;
|
||||||
|
border-radius: 50%;
|
||||||
|
animation: spin 0.7s linear infinite;
|
||||||
|
display: inline-block;
|
||||||
|
}
|
||||||
|
@keyframes spin { to { transform: rotate(360deg); } }
|
||||||
|
|
||||||
|
.login-footer {
|
||||||
|
font-size: 13px;
|
||||||
|
color: var(--color-enuxia-muted);
|
||||||
|
text-align: center;
|
||||||
|
}
|
||||||
|
.login-footer a {
|
||||||
|
color: var(--color-enuxia-blue);
|
||||||
|
font-weight: 500;
|
||||||
|
transition: color 0.15s;
|
||||||
|
}
|
||||||
|
.login-footer a:hover { color: #7aaeff; }
|
||||||
|
|
||||||
|
/* ════════════════════════════════════════════════════════════════════════════
|
||||||
|
HOME ÉTUDIANT
|
||||||
|
════════════════════════════════════════════════════════════════════════════ */
|
||||||
|
.home-page {
|
||||||
|
max-width: 680px;
|
||||||
|
margin: 0 auto;
|
||||||
|
padding: 64px 24px 40px;
|
||||||
|
display: flex;
|
||||||
|
flex-direction: column;
|
||||||
|
gap: 32px;
|
||||||
|
}
|
||||||
|
|
||||||
|
.quiz-grid { display: flex; flex-direction: column; gap: 12px; }
|
||||||
|
|
||||||
|
.quiz-item {
|
||||||
|
padding: 20px 24px;
|
||||||
|
border-radius: 14px;
|
||||||
|
cursor: pointer;
|
||||||
|
transition: all 0.2s;
|
||||||
|
background: var(--color-enuxia-dark-3);
|
||||||
|
border: 1px solid var(--color-enuxia-border);
|
||||||
|
display: flex;
|
||||||
|
align-items: center;
|
||||||
|
justify-content: space-between;
|
||||||
|
gap: 16px;
|
||||||
|
}
|
||||||
|
.quiz-item:hover {
|
||||||
|
border-color: var(--color-enuxia-border-2);
|
||||||
|
background: var(--color-enuxia-dark-2);
|
||||||
|
transform: translateX(4px);
|
||||||
|
}
|
||||||
|
.quiz-item.selected {
|
||||||
|
border-color: var(--color-enuxia-blue);
|
||||||
|
background: rgba(79, 142, 255, 0.05);
|
||||||
|
box-shadow: 0 0 0 1px rgba(79, 142, 255, 0.15);
|
||||||
|
}
|
||||||
|
.quiz-item .quiz-title {
|
||||||
|
font-family: 'Space Grotesk', sans-serif;
|
||||||
|
font-weight: 600;
|
||||||
|
font-size: 16px;
|
||||||
|
color: var(--color-enuxia-text);
|
||||||
|
}
|
||||||
|
.quiz-item .quiz-desc {
|
||||||
|
font-size: 13px;
|
||||||
|
color: var(--color-enuxia-muted);
|
||||||
|
margin-top: 2px;
|
||||||
|
}
|
||||||
|
.quiz-item .arrow {
|
||||||
|
color: var(--color-enuxia-muted);
|
||||||
|
font-size: 18px;
|
||||||
|
transition: transform 0.2s, color 0.2s;
|
||||||
|
flex-shrink: 0;
|
||||||
|
}
|
||||||
|
.quiz-item.selected .arrow {
|
||||||
|
color: var(--color-enuxia-blue);
|
||||||
|
transform: translateX(4px);
|
||||||
|
}
|
||||||
|
|
||||||
|
.quiz-item.quiz-done {
|
||||||
|
cursor: not-allowed;
|
||||||
|
opacity: 0.6;
|
||||||
|
border-color: rgba(34, 197, 94, 0.2);
|
||||||
|
}
|
||||||
|
|
||||||
|
.quiz-item.quiz-done:hover {
|
||||||
|
transform: none;
|
||||||
|
background: var(--color-enuxia-dark-3);
|
||||||
|
border-color: rgba(34, 197, 94, 0.2);
|
||||||
|
}
|
||||||
|
|
||||||
|
.identity-form {
|
||||||
|
padding: 24px;
|
||||||
|
border-radius: 14px;
|
||||||
|
background: var(--color-enuxia-dark-3);
|
||||||
|
border: 1px solid var(--color-enuxia-border-2);
|
||||||
|
display: flex;
|
||||||
|
flex-direction: column;
|
||||||
|
gap: 12px;
|
||||||
|
animation: slideDown 0.25s ease;
|
||||||
|
}
|
||||||
|
@keyframes slideDown {
|
||||||
|
from { opacity: 0; transform: translateY(-8px); }
|
||||||
|
to { opacity: 1; transform: translateY(0); }
|
||||||
|
}
|
||||||
|
.identity-form .form-title {
|
||||||
|
font-family: 'Space Grotesk', sans-serif;
|
||||||
|
font-size: 15px;
|
||||||
|
font-weight: 600;
|
||||||
|
color: var(--color-enuxia-text);
|
||||||
|
}
|
||||||
|
.identity-form .btn-start {
|
||||||
|
width: 100%;
|
||||||
|
padding: 13px;
|
||||||
|
border-radius: 10px;
|
||||||
|
font-size: 15px;
|
||||||
|
font-weight: 600;
|
||||||
|
background: var(--color-enuxia-blue);
|
||||||
|
color: white;
|
||||||
|
margin-top: 4px;
|
||||||
|
transition: all 0.2s;
|
||||||
|
}
|
||||||
|
.identity-form .btn-start:hover {
|
||||||
|
background: #3a7aff;
|
||||||
|
box-shadow: 0 4px 20px rgba(79, 142, 255, 0.3);
|
||||||
|
}
|
||||||
|
|
||||||
|
/* ════════════════════════════════════════════════════════════════════════════
|
||||||
|
QUIZ PAGE
|
||||||
|
════════════════════════════════════════════════════════════════════════════ */
|
||||||
|
.quiz-page {
|
||||||
|
max-width: 640px;
|
||||||
|
margin: 0 auto;
|
||||||
|
padding: 48px 24px 40px;
|
||||||
|
display: flex;
|
||||||
|
flex-direction: column;
|
||||||
|
gap: 32px;
|
||||||
|
}
|
||||||
|
|
||||||
|
.quiz-topbar {
|
||||||
|
display: flex;
|
||||||
|
align-items: center;
|
||||||
|
justify-content: space-between;
|
||||||
|
}
|
||||||
|
.quiz-topbar .quiz-name {
|
||||||
|
font-family: 'Space Grotesk', sans-serif;
|
||||||
|
font-size: 15px;
|
||||||
|
font-weight: 600;
|
||||||
|
color: var(--color-enuxia-muted);
|
||||||
|
}
|
||||||
|
.quiz-topbar .question-badge {
|
||||||
|
font-size: 12px;
|
||||||
|
font-weight: 600;
|
||||||
|
padding: 5px 12px;
|
||||||
|
border-radius: 20px;
|
||||||
|
background: var(--color-enuxia-border);
|
||||||
|
color: var(--color-enuxia-muted);
|
||||||
|
letter-spacing: 0.05em;
|
||||||
|
}
|
||||||
|
|
||||||
|
.progress-track {
|
||||||
|
height: 3px;
|
||||||
|
border-radius: 99px;
|
||||||
|
background: var(--color-enuxia-border);
|
||||||
|
overflow: hidden;
|
||||||
|
}
|
||||||
|
.progress-fill {
|
||||||
|
height: 100%;
|
||||||
|
border-radius: 99px;
|
||||||
|
background: linear-gradient(90deg, var(--color-enuxia-blue), var(--color-enuxia-purple));
|
||||||
|
transition: width 0.4s ease;
|
||||||
|
}
|
||||||
|
|
||||||
|
.question-area { display: flex; flex-direction: column; gap: 10px; }
|
||||||
|
|
||||||
|
.question-section-tag {
|
||||||
|
font-size: 11px;
|
||||||
|
font-weight: 700;
|
||||||
|
letter-spacing: 0.12em;
|
||||||
|
text-transform: uppercase;
|
||||||
|
color: var(--color-enuxia-purple);
|
||||||
|
}
|
||||||
|
|
||||||
|
.question-text {
|
||||||
|
font-family: 'Space Grotesk', sans-serif;
|
||||||
|
font-size: 22px;
|
||||||
|
font-weight: 700;
|
||||||
|
color: var(--color-enuxia-text);
|
||||||
|
line-height: 1.3;
|
||||||
|
}
|
||||||
|
|
||||||
|
.answers-list { display: flex; flex-direction: column; gap: 10px; }
|
||||||
|
|
||||||
|
.answer-option {
|
||||||
|
display: flex;
|
||||||
|
align-items: center;
|
||||||
|
gap: 14px;
|
||||||
|
padding: 16px 20px;
|
||||||
|
border-radius: 12px;
|
||||||
|
cursor: pointer;
|
||||||
|
transition: all 0.18s;
|
||||||
|
background: var(--color-enuxia-dark-3);
|
||||||
|
border: 1px solid var(--color-enuxia-border);
|
||||||
|
text-align: left;
|
||||||
|
width: 100%;
|
||||||
|
color: var(--color-enuxia-text);
|
||||||
|
font-size: 14px;
|
||||||
|
font-weight: 500;
|
||||||
|
}
|
||||||
|
.answer-option:hover {
|
||||||
|
border-color: var(--color-enuxia-blue);
|
||||||
|
background: rgba(79, 142, 255, 0.06);
|
||||||
|
transform: translateX(3px);
|
||||||
|
}
|
||||||
|
.answer-option .opt-label {
|
||||||
|
width: 32px;
|
||||||
|
height: 32px;
|
||||||
|
border-radius: 8px;
|
||||||
|
display: flex;
|
||||||
|
align-items: center;
|
||||||
|
justify-content: center;
|
||||||
|
font-size: 12px;
|
||||||
|
font-weight: 700;
|
||||||
|
flex-shrink: 0;
|
||||||
|
background: var(--color-enuxia-border);
|
||||||
|
color: var(--color-enuxia-blue);
|
||||||
|
transition: all 0.18s;
|
||||||
|
font-family: 'Space Grotesk', sans-serif;
|
||||||
|
}
|
||||||
|
.answer-option:hover .opt-label {
|
||||||
|
background: rgba(79, 142, 255, 0.2);
|
||||||
|
}
|
||||||
|
|
||||||
|
.answer-option.selected {
|
||||||
|
border-color: var(--color-enuxia-blue);
|
||||||
|
background: rgba(79, 142, 255, 0.1);
|
||||||
|
}
|
||||||
|
|
||||||
|
.answer-option.selected .opt-label {
|
||||||
|
background: rgba(79, 142, 255, 0.3);
|
||||||
|
color: white;
|
||||||
|
}
|
||||||
|
|
||||||
|
/* ════════════════════════════════════════════════════════════════════════════
|
||||||
|
RÉSULTAT
|
||||||
|
════════════════════════════════════════════════════════════════════════════ */
|
||||||
|
.result-page {
|
||||||
|
max-width: 680px;
|
||||||
|
margin: 0 auto;
|
||||||
|
padding: 48px 24px 80px;
|
||||||
|
display: flex;
|
||||||
|
flex-direction: column;
|
||||||
|
gap: 28px;
|
||||||
|
}
|
||||||
|
|
||||||
|
.result-hero {
|
||||||
|
position: relative;
|
||||||
|
overflow: hidden;
|
||||||
|
display: flex;
|
||||||
|
flex-direction: column;
|
||||||
|
align-items: center;
|
||||||
|
gap: 14px;
|
||||||
|
padding: 52px 40px 44px;
|
||||||
|
border-radius: 24px;
|
||||||
|
background: var(--color-enuxia-dark-2);
|
||||||
|
border: 1px solid var(--color-enuxia-border-2);
|
||||||
|
text-align: center;
|
||||||
|
}
|
||||||
|
|
||||||
|
.result-hero::before {
|
||||||
|
content: '';
|
||||||
|
position: absolute;
|
||||||
|
top: 50%;
|
||||||
|
left: 50%;
|
||||||
|
transform: translate(-50%, -60%);
|
||||||
|
width: 300px;
|
||||||
|
height: 300px;
|
||||||
|
border-radius: 50%;
|
||||||
|
background: radial-gradient(ellipse, rgba(79, 142, 255, 0.09) 0%, transparent 65%);
|
||||||
|
pointer-events: none;
|
||||||
|
}
|
||||||
|
|
||||||
|
.result-label {
|
||||||
|
font-size: 11px;
|
||||||
|
font-weight: 700;
|
||||||
|
letter-spacing: 0.12em;
|
||||||
|
text-transform: uppercase;
|
||||||
|
color: var(--color-enuxia-muted);
|
||||||
|
position: relative;
|
||||||
|
}
|
||||||
|
|
||||||
|
.result-name {
|
||||||
|
font-family: 'Space Grotesk', sans-serif;
|
||||||
|
font-size: 20px;
|
||||||
|
font-weight: 700;
|
||||||
|
color: var(--color-enuxia-text);
|
||||||
|
position: relative;
|
||||||
|
}
|
||||||
|
|
||||||
|
.score-ring-wrap {
|
||||||
|
position: relative;
|
||||||
|
width: 200px;
|
||||||
|
height: 200px;
|
||||||
|
margin: 8px 0 4px;
|
||||||
|
}
|
||||||
|
|
||||||
|
.score-ring-inner {
|
||||||
|
position: absolute;
|
||||||
|
top: 50%;
|
||||||
|
left: 50%;
|
||||||
|
transform: translate(-50%, -50%);
|
||||||
|
display: flex;
|
||||||
|
flex-direction: column;
|
||||||
|
align-items: center;
|
||||||
|
gap: 6px;
|
||||||
|
width: 120px;
|
||||||
|
text-align: center;
|
||||||
|
}
|
||||||
|
|
||||||
|
.score-ring-num {
|
||||||
|
font-size: 28px;
|
||||||
|
font-weight: 700;
|
||||||
|
letter-spacing: -0.02em;
|
||||||
|
line-height: 1;
|
||||||
|
white-space: nowrap;
|
||||||
|
}
|
||||||
|
|
||||||
|
.score-ring-pct {
|
||||||
|
font-size: 13px;
|
||||||
|
font-weight: 500;
|
||||||
|
color: var(--color-enuxia-muted);
|
||||||
|
}
|
||||||
|
|
||||||
|
.result-tag {
|
||||||
|
display: inline-flex;
|
||||||
|
align-items: center;
|
||||||
|
gap: 6px;
|
||||||
|
padding: 8px 20px;
|
||||||
|
border-radius: 20px;
|
||||||
|
font-size: 13px;
|
||||||
|
font-weight: 600;
|
||||||
|
position: relative;
|
||||||
|
}
|
||||||
|
.tag-great { background:rgba(34,197,94,0.1); color:#22C55E; border:1px solid rgba(34,197,94,0.25); }
|
||||||
|
.tag-ok { background:rgba(79,142,255,0.1); color:#4F8EFF; border:1px solid rgba(79,142,255,0.25); }
|
||||||
|
.tag-bad { background:rgba(248,113,113,0.1); color:#f87171; border:1px solid rgba(248,113,113,0.25); }
|
||||||
|
|
||||||
|
.score-pct {
|
||||||
|
font-size: 15px;
|
||||||
|
font-weight: 500;
|
||||||
|
color: var(--color-enuxia-muted);
|
||||||
|
}
|
||||||
|
|
||||||
|
.correction-section { display: flex; flex-direction: column; gap: 0; }
|
||||||
|
.correction-section h2 {
|
||||||
|
font-family: 'Space Grotesk', sans-serif;
|
||||||
|
font-size: 17px;
|
||||||
|
font-weight: 700;
|
||||||
|
color: var(--color-enuxia-text);
|
||||||
|
margin-bottom: 16px;
|
||||||
|
}
|
||||||
|
|
||||||
|
.correction-item {
|
||||||
|
padding: 16px 20px;
|
||||||
|
border-radius: 0;
|
||||||
|
background: var(--color-enuxia-dark-3);
|
||||||
|
border: 1px solid var(--color-enuxia-border);
|
||||||
|
border-bottom: none;
|
||||||
|
display: flex;
|
||||||
|
flex-direction: column;
|
||||||
|
gap: 7px;
|
||||||
|
transition: background 0.15s;
|
||||||
|
}
|
||||||
|
.correction-item:first-of-type { border-radius: 14px 14px 0 0; }
|
||||||
|
.correction-item:last-of-type { border-radius: 0 0 14px 14px; border-bottom: 1px solid var(--color-enuxia-border); }
|
||||||
|
.correction-item:only-of-type { border-radius: 14px; border-bottom: 1px solid var(--color-enuxia-border); }
|
||||||
|
.correction-item.is-correct { border-color:rgba(34,197,94,0.2); border-left:3px solid #22C55E; background:rgba(34,197,94,0.03); }
|
||||||
|
.correction-item.is-wrong { border-color:rgba(239,68,68,0.2); border-left:3px solid #ef4444; background:rgba(239,68,68,0.03); }
|
||||||
|
.correction-item:hover { background: rgba(255,255,255,0.015); }
|
||||||
|
|
||||||
|
.corr-meta { display: flex; align-items: center; gap: 8px; }
|
||||||
|
.corr-qnum {
|
||||||
|
font-size: 10px; font-weight: 700;
|
||||||
|
padding: 2px 8px; border-radius: 4px;
|
||||||
|
background: rgba(139,92,246,0.1); color: var(--color-enuxia-purple);
|
||||||
|
letter-spacing: 0.04em;
|
||||||
|
}
|
||||||
|
.corr-section {
|
||||||
|
font-size: 10px; font-weight: 700;
|
||||||
|
letter-spacing: 0.1em; text-transform: uppercase;
|
||||||
|
color: var(--color-enuxia-muted);
|
||||||
|
}
|
||||||
|
.corr-question { font-size: 14px; font-weight: 500; color: var(--color-enuxia-text); line-height: 1.4; }
|
||||||
|
.corr-chosen { font-size: 13px; color: var(--color-enuxia-muted); }
|
||||||
|
.corr-right { font-size: 13px; font-weight: 600; color: var(--color-enuxia-green); }
|
||||||
|
|
||||||
|
.btn-home-link {
|
||||||
|
display: inline-flex;
|
||||||
|
align-items: center;
|
||||||
|
justify-content: center;
|
||||||
|
gap: 8px;
|
||||||
|
padding: 13px 28px;
|
||||||
|
border-radius: 12px;
|
||||||
|
font-size: 14px;
|
||||||
|
font-weight: 600;
|
||||||
|
background: var(--color-enuxia-border);
|
||||||
|
color: var(--color-enuxia-muted);
|
||||||
|
transition: all 0.2s;
|
||||||
|
align-self: center;
|
||||||
|
border: 1px solid var(--color-enuxia-border-2);
|
||||||
|
}
|
||||||
|
.btn-home-link:hover {
|
||||||
|
background: var(--color-enuxia-subtle);
|
||||||
|
color: var(--color-enuxia-text);
|
||||||
|
transform: translateY(-1px);
|
||||||
|
}
|
||||||
|
|
||||||
|
/* ════════════════════════════════════════════════════════════════════════════
|
||||||
|
ADMIN — COMMUN
|
||||||
|
════════════════════════════════════════════════════════════════════════════ */
|
||||||
|
.admin-page {
|
||||||
|
max-width: 1000px;
|
||||||
|
margin: 0 auto;
|
||||||
|
padding: 40px 32px 64px;
|
||||||
|
display: flex;
|
||||||
|
flex-direction: column;
|
||||||
|
gap: 32px;
|
||||||
|
}
|
||||||
|
|
||||||
|
.admin-topbar {
|
||||||
|
display: flex;
|
||||||
|
align-items: center;
|
||||||
|
justify-content: space-between;
|
||||||
|
flex-wrap: wrap;
|
||||||
|
gap: 16px;
|
||||||
|
padding-bottom: 24px;
|
||||||
|
border-bottom: 1px solid var(--color-enuxia-border);
|
||||||
|
}
|
||||||
|
.admin-topbar h1 { font-size: 26px; font-weight: 700; }
|
||||||
|
.topbar-actions { display: flex; align-items: center; gap: 10px; }
|
||||||
|
|
||||||
|
/* ── Tables ───────────────────────────────────────────────────────────────── */
|
||||||
|
.data-table { width: 100%; border-collapse: collapse; font-size: 14px; }
|
||||||
|
.data-table thead tr { border-bottom: 1px solid var(--color-enuxia-border); }
|
||||||
|
.data-table th {
|
||||||
|
padding: 10px 16px;
|
||||||
|
text-align: left;
|
||||||
|
font-size: 11px; font-weight: 700;
|
||||||
|
letter-spacing: 0.08em; text-transform: uppercase;
|
||||||
|
color: var(--color-enuxia-muted);
|
||||||
|
}
|
||||||
|
.data-table td {
|
||||||
|
padding: 14px 16px;
|
||||||
|
border-bottom: 1px solid var(--color-enuxia-border);
|
||||||
|
color: var(--color-enuxia-text);
|
||||||
|
vertical-align: middle;
|
||||||
|
}
|
||||||
|
.data-table tbody tr:last-child td { border-bottom: none; }
|
||||||
|
.data-table tbody tr:hover td { background: rgba(79,142,255,0.025); }
|
||||||
|
|
||||||
|
.table-actions { display: flex; align-items: center; gap: 8px; }
|
||||||
|
.table-link {
|
||||||
|
font-size: 13px; font-weight: 500;
|
||||||
|
padding: 6px 14px; border-radius: 7px;
|
||||||
|
background: var(--color-enuxia-border); color: var(--color-enuxia-muted);
|
||||||
|
transition: all 0.15s;
|
||||||
|
}
|
||||||
|
.table-link:hover { background: var(--color-enuxia-subtle); color: var(--color-enuxia-text); }
|
||||||
|
|
||||||
|
.badge-on { font-size:11px; font-weight:700; padding:4px 10px; border-radius:20px; background:rgba(34,197,94,0.1); color:var(--color-enuxia-green); letter-spacing:0.04em; }
|
||||||
|
.badge-off { font-size:11px; font-weight:700; padding:4px 10px; border-radius:20px; background:var(--color-enuxia-border); color:var(--color-enuxia-muted); letter-spacing:0.04em; }
|
||||||
|
|
||||||
|
/* ── Éditeur quiz ─────────────────────────────────────────────────────────── */
|
||||||
|
.quiz-editor { display: flex; flex-direction: column; gap: 24px; }
|
||||||
|
|
||||||
|
.quiz-meta-card {
|
||||||
|
padding: 24px; border-radius: 14px;
|
||||||
|
background: var(--color-enuxia-dark-3);
|
||||||
|
border: 1px solid var(--color-enuxia-border);
|
||||||
|
display: flex; flex-direction: column; gap: 14px;
|
||||||
|
}
|
||||||
|
.quiz-meta-card .save-row {
|
||||||
|
display: flex; align-items: center; justify-content: space-between;
|
||||||
|
gap: 12px; flex-wrap: wrap;
|
||||||
|
}
|
||||||
|
|
||||||
|
.checkbox-row {
|
||||||
|
display: flex; align-items: center; gap: 8px;
|
||||||
|
font-size: 14px; color: var(--color-enuxia-muted); cursor: pointer;
|
||||||
|
}
|
||||||
|
|
||||||
|
.questions-header {
|
||||||
|
display: flex; align-items: center; justify-content: space-between; margin-bottom: 4px;
|
||||||
|
}
|
||||||
|
.questions-header h2 { font-size: 18px; font-weight: 700; color: var(--color-enuxia-text); }
|
||||||
|
|
||||||
|
.question-card {
|
||||||
|
padding: 20px; border-radius: 14px;
|
||||||
|
background: var(--color-enuxia-dark-3);
|
||||||
|
border: 1px solid var(--color-enuxia-border);
|
||||||
|
display: flex; flex-direction: column; gap: 14px; margin-bottom: 12px;
|
||||||
|
}
|
||||||
|
.question-card .qcard-header { display: flex; align-items: center; justify-content: space-between; }
|
||||||
|
|
||||||
|
.q-badge {
|
||||||
|
font-family: 'Space Grotesk', sans-serif;
|
||||||
|
font-size: 11px; font-weight: 700;
|
||||||
|
padding: 4px 10px; border-radius: 6px;
|
||||||
|
background: rgba(79,142,255,0.1); color: var(--color-enuxia-blue);
|
||||||
|
letter-spacing: 0.05em;
|
||||||
|
}
|
||||||
|
|
||||||
|
.answers-editor { display: flex; flex-direction: column; gap: 8px; }
|
||||||
|
.answer-editor-row { display: flex; align-items: center; gap: 10px; }
|
||||||
|
.answer-letter {
|
||||||
|
width: 30px; height: 30px; border-radius: 7px;
|
||||||
|
display: flex; align-items: center; justify-content: center;
|
||||||
|
font-size: 12px; font-weight: 700; flex-shrink: 0;
|
||||||
|
background: var(--color-enuxia-border); color: var(--color-enuxia-purple);
|
||||||
|
font-family: 'Space Grotesk', sans-serif;
|
||||||
|
}
|
||||||
|
.answer-editor-row input[type="text"] { flex: 1; }
|
||||||
|
.radio-correct {
|
||||||
|
display: flex; align-items: center; gap: 6px;
|
||||||
|
font-size: 12px; font-weight: 500;
|
||||||
|
color: var(--color-enuxia-muted); white-space: nowrap; cursor: pointer;
|
||||||
|
}
|
||||||
|
|
||||||
|
/* ── Admin résultats & détail ─────────────────────────────────────────────── */
|
||||||
|
.csv-box {
|
||||||
|
padding: 16px; border-radius: 12px;
|
||||||
|
background: var(--color-enuxia-dark-3);
|
||||||
|
border: 1px solid rgba(34,197,94,0.25);
|
||||||
|
display: flex; flex-direction: column; gap: 10px;
|
||||||
|
}
|
||||||
|
.csv-box p { font-size: 13px; font-weight: 600; color: var(--color-enuxia-green); }
|
||||||
|
.csv-box textarea { font-family: monospace; font-size: 12px; min-height: 160px; }
|
||||||
|
|
||||||
|
.score-summary-bar {
|
||||||
|
display: flex; align-items: center; justify-content: space-between;
|
||||||
|
padding: 18px 24px; border-radius: 12px;
|
||||||
|
background: var(--color-enuxia-dark-3); border: 1px solid var(--color-enuxia-border);
|
||||||
|
}
|
||||||
|
.score-summary-bar .score-val {
|
||||||
|
font-family: 'Space Grotesk', sans-serif;
|
||||||
|
font-size: 24px; font-weight: 700;
|
||||||
|
background: linear-gradient(135deg, var(--color-enuxia-blue), var(--color-enuxia-purple));
|
||||||
|
-webkit-background-clip: text; -webkit-text-fill-color: transparent; background-clip: text;
|
||||||
|
}
|
||||||
|
.score-summary-bar .date-val { font-size: 13px; color: var(--color-enuxia-muted); }
|
||||||
@@ -0,0 +1,14 @@
|
|||||||
|
/** @type {import('tailwindcss').Config} */
|
||||||
|
module.exports = {
|
||||||
|
content: {
|
||||||
|
relative: true,
|
||||||
|
files: ["*.html", "./src/**/*.rs"],
|
||||||
|
transform: {
|
||||||
|
rs: (content) => content.replace(/(?:^|\s)class:/g, ' '),
|
||||||
|
},
|
||||||
|
},
|
||||||
|
theme: {
|
||||||
|
extend: {},
|
||||||
|
},
|
||||||
|
plugins: [],
|
||||||
|
}
|
||||||
Reference in New Issue
Block a user