From c68cea7fa6914fdef4bfc46c8d7d515736e619a3 Mon Sep 17 00:00:00 2001 From: primakov Date: Mon, 1 Apr 2024 17:42:30 +0300 Subject: [PATCH] =?UTF-8?q?(#16)=20Layout=20=D1=81=D0=BF=D0=B8=D1=81=D0=BA?= =?UTF-8?q?=D0=B0=20=D0=BB=D0=B5=D0=BA=D1=86=D0=B8=D0=B9=20=D0=BA=D0=B0?= =?UTF-8?q?=D0=BA=20=D1=82=D0=B0=D0=B1=D0=BB=D0=B8=D1=86=D0=B0?= MIME-Version: 1.0 Content-Type: text/plain; charset=UTF-8 Content-Transfer-Encoding: 8bit --- .gitignore | 2 + src/pages/course-list.tsx | 12 +- src/pages/lesson-details.tsx | 79 +++++----- src/pages/lesson-list.tsx | 294 ++++++++++++++++++++--------------- src/pages/style.ts | 3 + 5 files changed, 227 insertions(+), 163 deletions(-) diff --git a/.gitignore b/.gitignore index 24f06e4..877c623 100644 --- a/.gitignore +++ b/.gitignore @@ -9,6 +9,8 @@ pids *.pid *.seed +*prom.json + # Directory for instrumented libs generated by jscoverage/JSCover lib-cov diff --git a/src/pages/course-list.tsx b/src/pages/course-list.tsx index d985fcb..cc738cb 100644 --- a/src/pages/course-list.tsx +++ b/src/pages/course-list.tsx @@ -35,6 +35,7 @@ import { useAppSelector } from '../__data__/store' import { api } from '../__data__/api/api' import { isTeacher } from '../utils/user' import { AddIcon, ArrowDownIcon, ArrowUpIcon, LinkIcon } from '@chakra-ui/icons' +import { Course } from '../__data__/model' interface NewCourseForm { startDt: string @@ -226,7 +227,15 @@ const CoursesList = () => { ) } -const CourseCard = ({ course, isOpened, openDetails }) => { +const CourseCard = ({ + course, + isOpened, + openDetails, +}: { + course: Course + isOpened: boolean + openDetails: () => void +}) => { const [getLessonList, lessonList] = api.useLazyLessonListQuery() useEffect(() => { if (isOpened) { @@ -262,6 +271,7 @@ const CourseCard = ({ course, isOpened, openDetails }) => { {lessonList.data?.body?.map((lesson) => ( { }, [accessCode?.body, AllStudents.data]) return ( - - + <> + @@ -108,41 +109,45 @@ const LessonDetail = () => { Лекция - - Тема занятия: - - - {accessCode?.body?.lesson?.name} - - - {dayjs(accessCode?.body?.lesson?.date).format('DD MMMM YYYYг.')}{' '} - Отмечено - {accessCode?.body?.lesson?.students?.length}{' '} - {AllStudents.isSuccess ? `/ ${AllStudents?.data?.body?.length}` : ''}{' '} - человек - - - - - - - - {studentsArr.map((student) => ( - - - {student.name || student.preferred_username}{' '} - {!student.present && ( - manualAdd({ lessonId, user: student })} - > - add - - )} - - - ))} - - - + + + + + Тема занятия: + + {accessCode?.body?.lesson?.name} + + {dayjs(accessCode?.body?.lesson?.date).format('DD MMMM YYYYг.')}{' '} + Отмечено - {accessCode?.body?.lesson?.students?.length}{' '} + {AllStudents.isSuccess + ? `/ ${AllStudents?.data?.body?.length}` + : ''}{' '} + человек + + + + + + + + {studentsArr.map((student) => ( + + + {student.name || student.preferred_username}{' '} + {!student.present && ( + manualAdd({ lessonId, user: student })} + > + add + + )} + + + ))} + + + + ) } diff --git a/src/pages/lesson-list.tsx b/src/pages/lesson-list.tsx index 26d9e3e..d1b99b6 100644 --- a/src/pages/lesson-list.tsx +++ b/src/pages/lesson-list.tsx @@ -24,16 +24,24 @@ import { FormHelperText, FormErrorMessage, Input, + TableContainer, + Table, + Thead, + Tr, + Th, + Tbody, + Td, } from '@chakra-ui/react' import { AddIcon } from '@chakra-ui/icons' -import { LessonItem, Lessonname, ErrorSpan } from './style' +import { LessonItem, Lessonname, ErrorSpan, BreadcrumbsWrapper } from './style' import { keycloak } from '../__data__/kc' import { useAppSelector } from '../__data__/store' import { api } from '../__data__/api/api' import { isTeacher } from '../utils/user' +import { qrCode } from '../assets' interface NewLessonForm { name: string @@ -94,135 +102,171 @@ const LessonList = () => { }, [crLQuery.isSuccess]) return ( - - - - - Журнал - - + <> + + + + + Журнал + + - - Курс - - + + Курс + + + + + {isTeacher(user) && ( + + {showForm ? ( + + + + Создание лекции + + setShowForm(false)} /> + + +
+ + ( + + Дата + + {errors.date ? ( + + {errors.date?.message} + + ) : ( + + Укажите дату и время лекции + + )} + + )} + /> - {isTeacher(user) && ( - - {showForm ? ( - - - - Создание лекции - - setShowForm(false)} /> - - - - - ( - - Дата - - {errors.date ? ( - - {errors.date?.message} - - ) : ( - - Укажите дату и время лекции - - )} - - )} - /> - - ( - ( + + Название новой лекции: + + {errors.name && ( + + {errors.name.message} + + )} + + )} + /> + + - - + Создать + + + - {crLQuery.error && ( - {(crLQuery.error as any).error} - )} -
- - - ) : ( - - + + )} + + )} + + + + + + + + + + + + {data?.body?.map((lesson) => ( + + + + + + + ))} + +
ссылкаДатаintoУчастников
+ + + + {dayjs(lesson.date).format('H:mm DD.MM.YY')}{lesson.name}{lesson.students.length}
+ + {/*
    + {data?.body?.map((lesson) => ( + + - Добавить - - - )} - - )} -
      - {data?.body?.map((lesson) => ( - - - {lesson.name} - {dayjs(lesson.date).format('DD MMMM YYYYг.')} - - Участников - {lesson.students.length} - - - - ))} -
    - + {lesson.name} + {dayjs(lesson.date).format('DD MMMM YYYYг.')} + + Участников - {lesson.students.length} + + +     + ))} +
*/} + + ) } diff --git a/src/pages/style.ts b/src/pages/style.ts index 4a0aa23..7f7355c 100644 --- a/src/pages/style.ts +++ b/src/pages/style.ts @@ -4,6 +4,9 @@ import { Card } from '@chakra-ui/react' +export const BreadcrumbsWrapper = styled.div` + padding: 12px; +`; export const MainWrapper = styled.main` display: flex;