templates/classroom/index.html.twig line 1

Open in your IDE?
  1. {% extends 'layout/backEndLayout.html.twig' %}
  3. {% block stylesheets %}
  4. {{ parent() }}
  5. <style>
  6. /* ── Tokens locaux ─────────────────────────────────────────── */
  7. :root {
  8. --ci-bg : #f5f7fa;
  9. --ci-card : #ffffff;
  10. --ci-border : rgba(0,0,0,.08);
  11. --ci-border-hi: rgba(0,0,0,.16);
  12. --ci-ink : #111827;
  13. --ci-dim : #4b5563;
  14. --ci-muted : #9ca3af;
  15. --ci-blue : #1d4ed8;
  16. --ci-blue-lt : rgba(29,78,216,.1);
  17. --ci-teal : #0d9488;
  18. --ci-teal-lt : rgba(13,148,136,.1);
  19. --ci-amber : #b45309;
  20. --ci-amber-lt : rgba(180,83,9,.1);
  21. --ci-rose : #be123c;
  22. --ci-rose-lt : rgba(190,18,60,.1);
  23. --ci-r : 12px;
  24. --ci-rs : 8px;
  25. --ci-shadow : 0 1px 4px rgba(0,0,0,.06), 0 4px 16px rgba(0,0,0,.06);
  26. }
  28. /* ── Layout page ───────────────────────────────────────────── */
  29. .ci-page { font-family:'DM Sans','Segoe UI',sans-serif; }
  31. /* ── Barre de tête ─────────────────────────────────────────── */
  32. .ci-topbar {
  33. display: flex;
  34. align-items: center;
  35. justify-content: space-between;
  36. flex-wrap: wrap;
  37. gap: 12px;
  38. margin-bottom: 24px;
  39. }
  40. .ci-topbar__title {
  41. font-size: 20px;
  42. font-weight: 700;
  43. color: var(--ci-ink);
  44. display: flex;
  45. align-items: center;
  46. gap: 10px;
  47. }
  48. .ci-topbar__title i { color: var(--ci-blue); font-size: 18px; }
  49. .ci-topbar__sub { font-size: 13px; color: var(--ci-muted); margin-top: 2px; }
  51. /* ── Statistiques globales ─────────────────────────────────── */
  52. .ci-stats {
  53. display: grid;
  54. grid-template-columns: repeat(auto-fill, minmax(160px, 1fr));
  55. gap: 12px;
  56. margin-bottom: 24px;
  57. }
  58. .ci-stat {
  59. background: var(--ci-card);
  60. border: 1px solid var(--ci-border);
  61. border-radius: var(--ci-r);
  62. padding: 16px;
  63. display: flex;
  64. align-items: center;
  65. gap: 12px;
  66. transition: box-shadow .2s;
  67. }
  68. .ci-stat:hover { box-shadow: var(--ci-shadow); }
  69. .ci-stat__icon {
  70. width: 40px; height: 40px;
  71. border-radius: var(--ci-rs);
  72. display: flex; align-items: center; justify-content: center;
  73. font-size: 16px; flex-shrink: 0;
  74. }
  75. .ic-blue { background: var(--ci-blue-lt); color: var(--ci-blue); }
  76. .ic-teal { background: var(--ci-teal-lt); color: var(--ci-teal); }
  77. .ic-amber { background: var(--ci-amber-lt); color: var(--ci-amber); }
  78. .ic-rose { background: var(--ci-rose-lt); color: var(--ci-rose); }
  79. .ci-stat__val { font-size: 22px; font-weight: 700; color: var(--ci-ink); line-height: 1; }
  80. .ci-stat__lbl { font-size: 11.5px; color: var(--ci-muted); margin-top: 2px; }
  82. /* ── Tableau ───────────────────────────────────────────────── */
  83. .ci-table-card {
  84. background: var(--ci-card);
  85. border: 1px solid var(--ci-border);
  86. border-radius: var(--ci-r);
  87. overflow: hidden;
  88. box-shadow: var(--ci-shadow);
  89. }
  90. .ci-table-head {
  91. display: flex;
  92. align-items: center;
  93. justify-content: space-between;
  94. flex-wrap: wrap;
  95. gap: 10px;
  96. padding: 16px 20px;
  97. border-bottom: 1px solid var(--ci-border);
  98. background: #fafbfc;
  99. }
  100. .ci-table-head__title {
  101. font-size: 14px;
  102. font-weight: 600;
  103. color: var(--ci-ink);
  104. display: flex;
  105. align-items: center;
  106. gap: 8px;
  107. }
  108. .ci-table-head__dot {
  109. width: 8px; height: 8px;
  110. border-radius: 50%;
  111. background: var(--ci-blue);
  112. box-shadow: 0 0 6px var(--ci-blue);
  113. }
  115. /* Bouton ajouter */
  116. .btn-add {
  117. display: inline-flex;
  118. align-items: center;
  119. gap: 6px;
  120. padding: 8px 16px;
  121. background: var(--ci-blue);
  122. color: #fff;
  123. border-radius: var(--ci-rs);
  124. font-size: 13px;
  125. font-weight: 600;
  126. text-decoration: none;
  127. border: none;
  128. cursor: pointer;
  129. transition: background .18s, transform .14s;
  130. }
  131. .btn-add:hover { background: #1e40af; color: #fff; transform: translateY(-1px); }
  133. /* Table */
  134. table.ci-tbl {
  135. width: 100%;
  136. border-collapse: collapse;
  137. font-size: 13.5px;
  138. }
  139. table.ci-tbl thead th {
  140. padding: 10px 16px;
  141. color: var(--ci-muted);
  142. font-size: 11px;
  143. font-weight: 600;
  144. text-transform: uppercase;
  145. letter-spacing: .06em;
  146. background: #fafbfc;
  147. border-bottom: 1px solid var(--ci-border);
  148. white-space: nowrap;
  149. }
  150. table.ci-tbl tbody td {
  151. padding: 12px 16px;
  152. border-bottom: 1px solid rgba(0,0,0,.04);
  153. color: var(--ci-ink);
  154. vertical-align: middle;
  155. }
  156. table.ci-tbl tbody tr:last-child td { border-bottom: none; }
  157. table.ci-tbl tbody tr { transition: background .12s; }
  158. table.ci-tbl tbody tr:hover td { background: rgba(29,78,216,.03); }
  160. /* Nom de la classe */
  161. .room-name {
  162. font-weight: 700;
  163. font-size: 14px;
  164. color: var(--ci-ink);
  165. }
  166. .room-link {
  167. display: inline-flex;
  168. align-items: center;
  169. gap: 6px;
  170. color: var(--ci-ink);
  171. text-decoration: none;
  172. }
  173. .room-link:hover { color: var(--ci-blue); }
  174. .room-link:hover .room-name { text-decoration: underline; }
  176. /* Niveau badge */
  177. .level-badge {
  178. display: inline-block;
  179. padding: 3px 10px;
  180. border-radius: 20px;
  181. font-size: 11.5px;
  182. font-weight: 600;
  183. background: var(--ci-blue-lt);
  184. color: var(--ci-blue);
  185. border: 1px solid rgba(29,78,216,.2);
  186. }
  188. /* Séquence active */
  189. .seq-badge {
  190. display: inline-flex;
  191. align-items: center;
  192. gap: 5px;
  193. padding: 3px 10px;
  194. border-radius: 20px;
  195. font-size: 11px;
  196. font-weight: 500;
  197. background: var(--ci-teal-lt);
  198. color: var(--ci-teal);
  199. border: 1px solid rgba(13,148,136,.2);
  200. }
  201. .seq-dot {
  202. width: 6px; height: 6px;
  203. border-radius: 50%;
  204. background: var(--ci-teal);
  205. animation: pulse-dot 1.6s ease infinite;
  206. }
  207. @keyframes pulse-dot {
  208. 0%,100% { opacity:1; } 50% { opacity:.35; }
  209. }
  211. /* Prof titulaire */
  212. .main-teacher {
  213. display: flex;
  214. align-items: center;
  215. gap: 7px;
  216. font-size: 13px;
  217. }
  218. .teacher-avatar {
  219. width: 26px; height: 26px;
  220. border-radius: 50%;
  221. background: linear-gradient(135deg, #1d4ed8, #0d9488);
  222. color: #fff;
  223. font-size: 10px;
  224. font-weight: 700;
  225. display: flex;
  226. align-items: center;
  227. justify-content: center;
  228. flex-shrink: 0;
  229. }
  230. .no-teacher {
  231. font-size: 12px;
  232. color: var(--ci-rose);
  233. font-style: italic;
  234. }
  236. /* Boutons action ligne */
  237. .ci-actions {
  238. display: flex;
  239. align-items: center;
  240. gap: 4px;
  241. justify-content: flex-end;
  242. }
  243. .ci-btn {
  244. display: inline-flex;
  245. align-items: center;
  246. gap: 5px;
  247. padding: 5px 10px;
  248. border-radius: 7px;
  249. font-size: 11.5px;
  250. font-weight: 500;
  251. text-decoration: none;
  252. border: 1px solid var(--ci-border);
  253. cursor: pointer;
  254. background: #fff;
  255. color: var(--ci-dim);
  256. transition: background .15s, border-color .15s, color .15s;
  257. white-space: nowrap;
  258. }
  259. .ci-btn:hover { border-color: var(--ci-border-hi); color: var(--ci-ink); background: #f8f9fa; }
  260. .ci-btn-primary { background: var(--ci-blue-lt); color: var(--ci-blue); border-color: rgba(29,78,216,.25); }
  261. .ci-btn-primary:hover { background: #1d4ed8; color: #fff; }
  262. .ci-btn-warning { background: var(--ci-amber-lt); color: var(--ci-amber); border-color: rgba(180,83,9,.25); }
  263. .ci-btn-warning:hover { background: #b45309; color: #fff; }
  264. .ci-btn-danger { background: var(--ci-rose-lt); color: var(--ci-rose); border-color: rgba(190,18,60,.25); }
  265. .ci-btn-danger:hover { background: #be123c; color: #fff; }
  267. /* ── Pagination ────────────────────────────────────────────── */
  268. .ci-pagination {
  269. display: flex;
  270. align-items: center;
  271. justify-content: space-between;
  272. flex-wrap: wrap;
  273. gap: 10px;
  274. padding: 14px 20px;
  275. border-top: 1px solid var(--ci-border);
  276. background: #fafbfc;
  277. }
  278. .ci-pagination__info { font-size: 12.5px; color: var(--ci-muted); }
  279. .ci-pager {
  280. display: flex;
  281. align-items: center;
  282. gap: 4px;
  283. list-style: none;
  284. margin: 0; padding: 0;
  285. }
  286. .ci-pager li a,
  287. .ci-pager li span {
  288. display: inline-flex;
  289. align-items: center;
  290. justify-content: center;
  291. min-width: 34px;
  292. height: 34px;
  293. padding: 0 8px;
  294. border-radius: 8px;
  295. border: 1px solid var(--ci-border);
  296. font-size: 13px;
  297. font-weight: 500;
  298. color: var(--ci-dim);
  299. text-decoration: none;
  300. background: #fff;
  301. transition: background .15s, border-color .15s, color .15s;
  302. }
  303. .ci-pager li a:hover { border-color: var(--ci-blue); color: var(--ci-blue); }
  304. .ci-pager li.active span {
  305. background: var(--ci-blue);
  306. color: #fff;
  307. border-color: var(--ci-blue);
  308. font-weight: 700;
  309. }
  310. .ci-pager li.disabled span { opacity: .4; cursor: default; }
  312. /* ── Vide ──────────────────────────────────────────────────── */
  313. .ci-empty {
  314. text-align: center;
  315. padding: 64px 24px;
  316. color: var(--ci-muted);
  317. }
  318. .ci-empty i { font-size: 40px; margin-bottom: 12px; display: block; }
  319. .ci-empty strong { display: block; font-size: 15px; color: var(--ci-dim); margin-bottom: 4px; }
  321. /* ── Animation ─────────────────────────────────────────────── */
  322. @keyframes fadeUp {
  323. from { opacity:0; transform:translateY(10px); }
  324. to { opacity:1; transform:none; }
  325. }
  326. .ci-table-card { animation: fadeUp .4s ease both; }
  327. </style>
  328. {% endblock %}
  330. {% block content %}
  331. <div class="container mt-4">
  333. <div class="d-flex justify-content-between align-items-center mb-3">
  334. <h4 class="text-uppercase">Liste des salles de classe</h4>
  335. {% if is_granted('ROLE_ADMIN') %}
  336. <a class="btn btn-info" href="{{ path('admin_classrooms_new') }}">
  337. <i class="fa fa-plus"></i> Ajouter
  338. </a>
  339. {% endif %}
  340. </div>
  342. <!-- Level Tabs -->
  343. <ul class="nav nav-tabs" id="levelTabs" role="tablist">
  344. {% for level in levels %}
  345. <li class="nav-item" role="presentation">
  346. <button class="nav-link {% if loop.first %}active{% endif %}" id="level-{{ level.id }}-tab"
  347. data-bs-toggle="tab" data-bs-target="#level-{{ level.id }}" type="button"
  348. role="tab" aria-controls="level-{{ level.id }}" aria-selected="{{ loop.first ? 'true' : 'false' }}">
  349. {{ level.fullName }}
  350. </button>
  351. </li>
  352. {% endfor %}
  353. </ul>
  355. <!-- Classes per Level -->
  356. <div class="tab-content mt-3" id="levelTabsContent">
  357. {% for level in levels %}
  358. <div class="tab-pane fade {% if loop.first %}show active{% endif %}" id="level-{{ level.id }}" role="tabpanel">
  359. {% if level.rooms|length > 0 %}
  360. <!-- Random Color Header -->
  361. {# pick a random color #}
  362. {% set colors = ['#ff7a00', '#2f2f2f', '#28a745', '#009688', '#6f42c1'] %}
  363. {% set color = random(colors) %}
  365. <div class="level-header" style="background-color: {{ color }};">
  366. <h5 class="m-0 text-white text-uppercase fw-bold level-title">
  367. {{ level.fullName }}
  368. </h5>
  369. </div>
  372. <div class="classroom-grid mt-3">
  373. {% for room in level.rooms %}
  374. <div class="classroom-card shadow-sm">
  375. <div class="card-header mb-2">
  376. <h5 class="mb-1 classroom-title">
  377. <a href="{{ path('admin_classrooms_show', {id: room.id}) }}">
  378. {{ room.name }}
  379. </a>
  380. </h5>
  382. {% if room.id in mainTeachers|keys %}
  383. <small class="text-muted">
  384. <i class="fa fa-user"></i> {{ mainTeachers[room.id].fullName }}
  385. </small>
  386. {% else %}
  387. <small class="text-danger">— Pas de titulaire —</small>
  388. {% endif %}
  389. </div>
  391. <!-- Flex Buttons -->
  392. <div class="card-actions mt-3">
  393. {% if is_granted('ROLE_ADMIN') %}
  394. <a class="btn btn-outline-warning" href="{{ path('admin_classrooms_edit', {id: room.id}) }}">
  395. <i class="fa fa-edit"></i> Modifier
  396. </a>
  397. <a class="btn btn-outline-dark" target="_blank" href="{{ path('admin_classroom_insolvent', {id: room.id}) }}">
  398. <i class="fa fa-users"></i> Débiteurs
  399. </a>
  400. <a class="btn btn-outline-success" target="_blank" href="{{ path('admin_payment_plan_print', {id: room.id}) }}">
  401. <i class="fa fa-money"></i> Échéancier
  402. </a>
  403. {% endif %}
  405. <a class="btn btn-outline-danger" target="_blank" href="{{ path('admin_classrooms_fichesimple', {id: room.id}) }}">
  406. <i class="fa fa-file-pdf-o"></i> Notes
  407. </a>
  408. <a class="btn btn-outline-info" target="_blank" href="{{ path('admin_classrooms_presentation', {id: room.id}) }}">
  409. <i class="fa fa-users"></i> Présentation
  410. </a>
  411. <a class="btn btn-outline-primary" target="_blank" href="{{ path('admin_classrooms_recapitulatif', {room: room.id, seq : seq}) }}">
  412. <i class="fa fa-file"></i> Récap.
  413. </a>
  414. <a class="btn btn-outline-secondary" target="_blank" href="{{ path('admin_classrooms_disciplinary_record', {id: room.id}) }}">
  415. <i class="fa fa-th-list"></i> Discipline
  416. </a>
  417. </div>
  418. </div>
  419. {% endfor %}
  420. </div>
  421. {% else %}
  422. <div class="alert alert-warning mt-3">Aucune classe trouvée pour ce niveau.</div>
  423. {% endif %}
  425. </div>
  426. {% endfor %}
  427. </div>
  428. <div class="ci-page">
  430. {# ── Barre de tête ──────────────────────────────────────────── #}
  431. <div class="ci-topbar">
  432. <div>
  433. <div class="ci-topbar__title">
  434. <i class="fa fa-th-large"></i>
  435. Classes
  436. </div>
  437. <div class="ci-topbar__sub">
  438. Gestion des classes — {% if year %}Année scolaire {{ year.code }}{% endif %}
  439. {% if seq > 0 %} · Séquence active{% endif %}
  440. </div>
  441. </div>
  442. {% if is_granted('ROLE_ADMIN') %}
  443. <a href="{{ path('admin_classrooms_new') }}" class="btn-add">
  444. <i class="fa fa-plus"></i> Nouvelle classe
  445. </a>
  446. {% endif %}
  447. </div>
  449. {# ── KPIs globaux ───────────────────────────────────────────── #}
  450. <div class="ci-stats">
  451. <div class="ci-stat">
  452. <div class="ci-stat__icon ic-blue"><i class="fa fa-home"></i></div>
  453. <div>
  454. <div class="ci-stat__val">{{ classrooms|length }}</div>
  455. <div class="ci-stat__lbl">Classes</div>
  456. </div>
  457. </div>
  458. <div class="ci-stat">
  459. <div class="ci-stat__icon ic-teal"><i class="fa fa-graduation-cap"></i></div>
  460. <div>
  461. <div class="ci-stat__val">{{ students_count() }}</div>
  462. <div class="ci-stat__lbl">Élèves inscrits</div>
  463. </div>
  464. </div>
  465. <div class="ci-stat">
  466. <div class="ci-stat__icon ic-amber"><i class="fa fa-users"></i></div>
  467. <div>
  468. <div class="ci-stat__val">{{ teachers_count() }}</div>
  469. <div class="ci-stat__lbl">Enseignants</div>
  470. </div>
  471. </div>
  472. <div class="ci-stat">
  473. <div class="ci-stat__icon ic-rose"><i class="fa fa-book"></i></div>
  474. <div>
  475. <div class="ci-stat__val">{{ rooms_count() }}</div>
  476. <div class="ci-stat__lbl">Salles actives</div>
  477. </div>
  478. </div>
  479. </div>
  481. {# ── Tableau des classes ─────────────────────────────────────── #}
  482. {% set items_per_page = 12 %}
  483. {% set current_page = app.request.query.get('page', 1)|number_format %}
  484. {% set total_pages = (classrooms|length / items_per_page)|round(0, 'ceil') %}
  486. <div class="ci-table-card">
  487. <div class="ci-table-head">
  488. <div class="ci-table-head__title">
  489. <span class="ci-table-head__dot"></span>
  490. Liste des classes
  491. <span style="font-size:11.5px;color:var(--ci-muted);font-weight:400;">({{ classrooms|length }} au total)</span>
  492. </div>
  493. <div style="display:flex;gap:8px;align-items:center;">
  494. <span class="seq-badge">
  495. <span class="seq-dot"></span>
  496. {% if seq > 0 %}Séquence active{% else %}Aucune séquence active{% endif %}
  497. </span>
  498. </div>
  499. </div>
  501. {% if classrooms is empty %}
  502. <div class="ci-empty">
  503. <i class="fa fa-inbox"></i>
  504. <strong>Aucune classe enregistrée</strong>
  505. Commencez par créer une classe.
  506. </div>
  507. {% else %}
  508. <div style="overflow-x:auto;">
  509. <table class="ci-tbl">
  510. <thead>
  511. <tr>
  512. <th style="width:4%">#</th>
  513. <th style="width:18%">Classe</th>
  514. <th style="width:12%">Niveau</th>
  515. <th style="width:22%">Professeur titulaire</th>
  516. <th style="width:10%" class="text-center">Modules</th>
  517. <th style="width:10%" class="text-center">Matières</th>
  518. <th style="width:24%" class="text-right">Actions</th>
  519. </tr>
  520. </thead>
  521. <tbody>
  522. {% for classroom in classrooms %}
  523. {# ── Pagination côté Twig ── #}
  524. {% if loop.index > (current_page - 1) * items_per_page and loop.index <= current_page * items_per_page %}
  525. <tr>
  526. <td style="color:var(--ci-muted);font-size:12px">{{ (current_page - 1) * items_per_page + loop.index - ((current_page - 1) * items_per_page) }}</td>
  528. <td>
  529. <a href="{{ path('admin_classrooms_show', {id: classroom.id}) }}" class="room-link">
  530. <span class="room-name">{{ classroom.name }}</span>
  531. </a>
  532. </td>
  534. <td>
  535. <span class="level-badge">{{ classroom.level }}</span>
  536. </td>
  538. <td>
  539. {% if mainTeachers[classroom.id] is defined %}
  540. <div class="main-teacher">
  541. <div class="teacher-avatar">
  542. {{ mainTeachers[classroom.id].fullName|slice(0,1)|upper }}{{ mainTeachers[classroom.id].fullName|split(' ')|last|slice(0,1)|upper }}
  543. </div>
  544. {{ mainTeachers[classroom.id].fullName }}
  545. </div>
  546. {% else %}
  547. <span class="no-teacher"><i class="fa fa-exclamation-triangle"></i> Non assigné</span>
  548. {% endif %}
  549. </td>
  551. <td class="text-center">
  552. <span style="font-weight:600;color:var(--ci-blue)">{{ classroom.modules|length }}</span>
  553. </td>
  555. <td class="text-center">
  556. {% set total_courses = 0 %}
  557. {% for module in classroom.modules %}
  558. {% set total_courses = total_courses + module.courses|length %}
  559. {% endfor %}
  560. <span style="font-weight:600;color:var(--ci-teal)">{{ total_courses }}</span>
  561. </td>
  563. <td>
  564. <div class="ci-actions">
  565. <a class="ci-btn ci-btn-primary" href="{{ path('admin_classrooms_show', {id: classroom.id}) }}" title="Voir">
  566. <i class="fa fa-eye"></i> Voir
  567. </a>
  568. {% if is_granted('ROLE_ADMIN') %}
  569. <a class="ci-btn ci-btn-warning" href="{{ path('admin_classrooms_edit', {id: classroom.id}) }}" title="Modifier">
  570. <i class="fa fa-pencil"></i>
  571. </a>
  572. {% if seq > 0 %}
  573. <a class="ci-btn" href="{{ path('admin_classrooms_recapitulatif', {room: classroom.id, seq: seq}) }}" title="Récapitulatif PDF">
  574. <i class="fa fa-file-pdf-o"></i>
  575. </a>
  576. {% endif %}
  577. <form method="post" action="{{ path('admin_classrooms_delete', {id: classroom.id}) }}" onsubmit="return confirm('Supprimer cette classe ?')" style="display:inline">
  578. <input type="hidden" name="_method" value="DELETE">
  579. <button class="ci-btn ci-btn-danger" type="submit" title="Supprimer">
  580. <i class="fa fa-trash"></i>
  581. </button>
  582. </form>
  583. {% endif %}
  584. </div>
  585. </td>
  586. </tr>
  587. {% endif %}
  588. {% endfor %}
  589. </tbody>
  590. </table>
  591. </div>
  593. {# ── Pagination ────────────────────────────────────────────── #}
  594. {% if total_pages > 1 %}
  595. <div class="ci-pagination">
  596. <div class="ci-pagination__info">
  597. Page {{ current_page }} sur {{ total_pages }} — {{ classrooms|length }} classe{{ classrooms|length > 1 ? 's' : '' }}
  598. </div>
  599. <ul class="ci-pager">
  600. <li class="{{ current_page <= 1 ? 'disabled' : '' }}">
  601. {% if current_page > 1 %}
  602. <a href="?page={{ current_page - 1 }}"><i class="fa fa-chevron-left"></i></a>
  603. {% else %}
  604. <span><i class="fa fa-chevron-left"></i></span>
  605. {% endif %}
  606. </li>
  607. {% for p in 1..total_pages %}
  608. {% if p == current_page %}
  609. <li class="active"><span>{{ p }}</span></li>
  610. {% elseif p == 1 or p == total_pages or (p >= current_page - 2 and p <= current_page + 2) %}
  611. <li><a href="?page={{ p }}">{{ p }}</a></li>
  612. {% elseif p == current_page - 3 or p == current_page + 3 %}
  613. <li><span style="border:none;background:transparent">…</span></li>
  614. {% endif %}
  615. {% endfor %}
  616. <li class="{{ current_page >= total_pages ? 'disabled' : '' }}">
  617. {% if current_page < total_pages %}
  618. <a href="?page={{ current_page + 1 }}"><i class="fa fa-chevron-right"></i></a>
  619. {% else %}
  620. <span><i class="fa fa-chevron-right"></i></span>
  621. {% endif %}
  622. </li>
  623. </ul>
  624. </div>
  625. {% else %}
  626. <div class="ci-pagination">
  627. <div class="ci-pagination__info">{{ classrooms|length }} classe{{ classrooms|length > 1 ? 's' : '' }} au total</div>
  628. </div>
  629. {% endif %}
  631. {% endif %}
  632. </div>
  634. </div>
  635. {% endblock %}