Обновлены компоненты для учета только прошедших лекций в статистике посещаемости. Добавлено мобильное отображение в компонентах LessonItems и Item, улучшена логика фильтрации лекций. Реализовано отображение QR-кода с учетом темы оформления.

2025-03-23 17:14:53 +03:00
parent d13bff5331
commit 1b337278fe
5 changed files with 223 additions and 60 deletions
@@ -25,6 +25,7 @@ import {
  AlertDialogFooter,
  AlertDialogHeader,
  AlertDialogOverlay,
+  useBreakpointValue,
 } from '@chakra-ui/react'
 import { AddIcon } from '@chakra-ui/icons'
 import { useTranslation } from 'react-i18next'
@@ -257,6 +258,9 @@ const LessonList = () => {
    }
  }

+  // Добавляем определение размера экрана
+  const isMobile = useBreakpointValue({ base: true, md: false })
+
  if (isLoading) {
    return <XlSpinner />
  }
@@ -352,38 +356,54 @@ const LessonList = () => {
            />
          </Box>
        )}
-        <TableContainer whiteSpace="wrap" pb={13}>
-          <Table variant="striped" colorScheme="cyan">
-            <Thead>
-              <Tr>
-                {isTeacher(user) && (
-                  <Th align="center" width={1}>
-                    {t('journal.pl.lesson.link')}
+        {isMobile ? (
+          <Box pb={13}>
+            {lessonCalc?.map(({ data: lessons, date }) => (
+              <LessonItems
+                courseId={courseId}
+                date={date}
+                isTeacher={isTeacher(user)}
+                lessons={lessons}
+                setlessonToDelete={setlessonToDelete}
+                setEditLesson={handleEditLesson}
+                key={date}
+              />
+            ))}
+          </Box>
+        ) : (
+          <TableContainer whiteSpace="wrap" pb={13}>
+            <Table variant="striped" colorScheme="cyan">
+              <Thead>
+                <Tr>
+                  {isTeacher(user) && (
+                    <Th align="center" width={1}>
+                      {t('journal.pl.lesson.link')}
+                    </Th>
+                  )}
+                  <Th textAlign="center" width={1}>
+                    {groupByDate ? t('journal.pl.lesson.time') : t('journal.pl.common.date')}
                  </Th>
-                )}
-                <Th textAlign="center" width={1}>
-                  {groupByDate ? t('journal.pl.lesson.time') : t('journal.pl.common.date')}
-                </Th>
-                <Th width="100%">{t('journal.pl.common.name')}</Th>
-                {isTeacher(user) && <Th>{t('journal.pl.lesson.action')}</Th>}
-                <Th isNumeric>{t('journal.pl.common.marked')}</Th>
-              </Tr>
-            </Thead>
-            <Tbody>
-              {lessonCalc?.map(({ data: lessons, date }) => (
-                <LessonItems
-                  courseId={courseId}
-                  date={date}
-                  isTeacher={isTeacher(user)}
-                  lessons={lessons}
-                  setlessonToDelete={setlessonToDelete}
-                  setEditLesson={handleEditLesson}
-                  key={date}
-                />
-              ))}
-            </Tbody>
-          </Table>
-        </TableContainer>
+                  <Th width="100%">{t('journal.pl.common.name')}</Th>
+                  {isTeacher(user) && <Th>{t('journal.pl.lesson.action')}</Th>}
+                  <Th isNumeric>{t('journal.pl.common.marked')}</Th>
+                </Tr>
+              </Thead>
+              <Tbody>
+                {lessonCalc?.map(({ data: lessons, date }) => (
+                  <LessonItems
+                    courseId={courseId}
+                    date={date}
+                    isTeacher={isTeacher(user)}
+                    lessons={lessons}
+                    setlessonToDelete={setlessonToDelete}
+                    setEditLesson={handleEditLesson}
+                    key={date}
+                  />
+                ))}
+              </Tbody>
+            </Table>
+          </TableContainer>
+        )}
      </Container>
    </>
  )