gmatte/EvalueTonSavoir
1
0
Fork 0
mirror of https://github.com/ets-cfuhrman-pfe/EvalueTonSavoir.git synced 2025-08-11 21:23:54 -04:00
Code Issues Projects Releases Packages Wiki Activity Actions

Confusion avec la navigation dans les questions à rythme de l'enseignant

Browse source 
Fixes #145
This commit is contained in:
JubaAzul 2025-01-21 15:35:07 -05:00
parent a44cded030
commit 3e9152fa5c
3 changed files with 29 additions and 25 deletions
Show stats Download patch file Download diff file Expand all files Collapse all files

4
client/src/components/Questions/MultipleChoiceQuestion/MultipleChoiceQuestion.tsx
View file

@ -23,6 +23,7 @@ interface Props {
} }
const MultipleChoiceQuestion: React.FC<Props> = (props) => { const MultipleChoiceQuestion: React.FC<Props> = (props) => {
const { questionStem: questionContent, choices, showAnswer, handleOnSubmitAnswer, globalFeedback } = props; const { questionStem: questionContent, choices, showAnswer, handleOnSubmitAnswer, globalFeedback } = props;
const [answer, setAnswer] = useState<string>(); const [answer, setAnswer] = useState<string>();
@ -73,7 +74,9 @@ const MultipleChoiceQuestion: React.FC<Props> = (props) => {
{globalFeedback && showAnswer && ( {globalFeedback && showAnswer && (
<div className="global-feedback mb-2">{globalFeedback}</div> <div className="global-feedback mb-2">{globalFeedback}</div>
)} )}
{!showAnswer && handleOnSubmitAnswer && ( {!showAnswer && handleOnSubmitAnswer && (
<Button <Button
variant="contained" variant="contained"
onClick={() => onClick={() =>
@ -82,6 +85,7 @@ const MultipleChoiceQuestion: React.FC<Props> = (props) => {
disabled={answer === undefined} disabled={answer === undefined}
> >
Répondre Répondre
</Button> </Button>
)} )}
</div> </div>

25
client/src/components/StudentModeQuiz/StudentModeQuiz.tsx
View file

@ -1,13 +1,12 @@
// StudentModeQuiz.tsx // StudentModeQuiz.tsx
import React, { useEffect, useState } from 'react'; import React, { useEffect, useState } from 'react';
import QuestionComponent from '../Questions/Question'; import QuestionComponent from '../Questions/Question';
import '../../pages/Student/JoinRoom/joinRoom.css'; import '../../pages/Student/JoinRoom/joinRoom.css';
import { QuestionType } from '../../Types/QuestionType'; import { QuestionType } from '../../Types/QuestionType';
// import { QuestionService } from '../../services/QuestionService'; // import { QuestionService } from '../../services/QuestionService';
import { Button } from '@mui/material'; import { Button } from '@mui/material';
import QuestionNavigation from '../QuestionNavigation/QuestionNavigation'; //import QuestionNavigation from '../QuestionNavigation/QuestionNavigation';
import { ChevronLeft, ChevronRight } from '@mui/icons-material'; //import { ChevronLeft, ChevronRight } from '@mui/icons-material';
import DisconnectButton from 'src/components/DisconnectButton/DisconnectButton'; import DisconnectButton from 'src/components/DisconnectButton/DisconnectButton';
interface StudentModeQuizProps { interface StudentModeQuizProps {
@ -25,10 +24,10 @@ const StudentModeQuiz: React.FC<StudentModeQuizProps> = ({
const [isAnswerSubmitted, setIsAnswerSubmitted] = useState(false); const [isAnswerSubmitted, setIsAnswerSubmitted] = useState(false);
// const [imageUrl, setImageUrl] = useState(''); // const [imageUrl, setImageUrl] = useState('');
const previousQuestion = () => { // const previousQuestion = () => {
setQuestion(questions[Number(questionInfos.question?.id) - 2]); // setQuestion(questions[Number(questionInfos.question?.id) - 2]);
setIsAnswerSubmitted(false); // setIsAnswerSubmitted(false);
}; // };
useEffect(() => {}, [questionInfos]); useEffect(() => {}, [questionInfos]);
@ -55,12 +54,12 @@ const StudentModeQuiz: React.FC<StudentModeQuizProps> = ({
<div className="overflow-auto"> <div className="overflow-auto">
<div className="question-component-container"> <div className="question-component-container">
<div className="mb-5"> <div className="mb-5">
<QuestionNavigation {/* <QuestionNavigation
currentQuestionId={Number(questionInfos.question.id)} currentQuestionId={Number(questionInfos.question.id)}
questionsLength={questions.length} questionsLength={questions.length}
previousQuestion={previousQuestion} previousQuestion={previousQuestion}
nextQuestion={nextQuestion} nextQuestion={nextQuestion}
/> /> */}
</div> </div>
<QuestionComponent <QuestionComponent
handleOnSubmitAnswer={handleOnSubmitAnswer} handleOnSubmitAnswer={handleOnSubmitAnswer}
@ -69,7 +68,7 @@ const StudentModeQuiz: React.FC<StudentModeQuizProps> = ({
/> />
<div className="center-h-align mt-1/2"> <div className="center-h-align mt-1/2">
<div className="w-12"> <div className="w-12">
<Button {/* <Button
variant="outlined" variant="outlined"
onClick={previousQuestion} onClick={previousQuestion}
fullWidth fullWidth
@ -77,14 +76,14 @@ const StudentModeQuiz: React.FC<StudentModeQuizProps> = ({
disabled={Number(questionInfos.question.id) <= 1} disabled={Number(questionInfos.question.id) <= 1}
> >
Question précédente Question précédente
</Button> </Button> */}
</div> </div>
<div className="w-12"> <div className="w-12">
<Button <Button style={{ display: isAnswerSubmitted ? 'block' : 'none' }}
variant="outlined" variant="outlined"
onClick={nextQuestion} onClick={nextQuestion}
fullWidth fullWidth
endIcon={<ChevronRight />} //endIcon={<ChevronRight />}
disabled={Number(questionInfos.question.id) >= questions.length} disabled={Number(questionInfos.question.id) >= questions.length}
> >
Question suivante Question suivante

23
client/src/pages/Teacher/ManageRoom/ManageRoom.tsx
View file

@ -17,7 +17,7 @@ import LoadingCircle from 'src/components/LoadingCircle/LoadingCircle';
import { Refresh, Error } from '@mui/icons-material'; import { Refresh, Error } from '@mui/icons-material';
import StudentWaitPage from 'src/components/StudentWaitPage/StudentWaitPage'; import StudentWaitPage from 'src/components/StudentWaitPage/StudentWaitPage';
import DisconnectButton from 'src/components/DisconnectButton/DisconnectButton'; import DisconnectButton from 'src/components/DisconnectButton/DisconnectButton';
import QuestionNavigation from 'src/components/QuestionNavigation/QuestionNavigation'; //import QuestionNavigation from 'src/components/QuestionNavigation/QuestionNavigation';
import Question from 'src/components/Questions/Question'; import Question from 'src/components/Questions/Question';
import ApiService from '../../../services/ApiService'; import ApiService from '../../../services/ApiService';
@ -261,16 +261,16 @@ const ManageRoom: React.FC = () => {
webSocketService.nextQuestion(roomName, quizQuestions[nextQuestionIndex]); webSocketService.nextQuestion(roomName, quizQuestions[nextQuestionIndex]);
}; };
const previousQuestion = () => { // const previousQuestion = () => {
if (!quizQuestions || !currentQuestion || !quiz?.content) return; // if (!quizQuestions || !currentQuestion || !quiz?.content) return;
const prevQuestionIndex = Number(currentQuestion?.question.id) - 2; // -2 because question.id starts at index 1 // const prevQuestionIndex = Number(currentQuestion?.question.id) - 2; // -2 because question.id starts at index 1
if (prevQuestionIndex === undefined || prevQuestionIndex < 0) return; // if (prevQuestionIndex === undefined || prevQuestionIndex < 0) return;
setCurrentQuestion(quizQuestions[prevQuestionIndex]); // setCurrentQuestion(quizQuestions[prevQuestionIndex]);
webSocketService.nextQuestion(roomName, quizQuestions[prevQuestionIndex]); // webSocketService.nextQuestion(roomName, quizQuestions[prevQuestionIndex]);
}; // };
const initializeQuizQuestion = () => { const initializeQuizQuestion = () => {
const quizQuestionArray = quiz?.content; const quizQuestionArray = quiz?.content;
@ -461,12 +461,12 @@ const ManageRoom: React.FC = () => {
{quizMode === 'teacher' && ( {quizMode === 'teacher' && (
<div className="mb-1"> <div className="mb-1">
<QuestionNavigation {/* <QuestionNavigation
currentQuestionId={Number(currentQuestion?.question.id)} currentQuestionId={Number(currentQuestion?.question.id)}
questionsLength={quizQuestions?.length} questionsLength={quizQuestions?.length}
previousQuestion={previousQuestion} previousQuestion={previousQuestion}
nextQuestion={nextQuestion} nextQuestion={nextQuestion}
/> /> */}
</div> </div>
)} )}
@ -494,10 +494,11 @@ const ManageRoom: React.FC = () => {
{quizMode === 'teacher' && ( {quizMode === 'teacher' && (
<div className="nextQuestionButton"> <div className="nextQuestionButton">
<Button onClick={nextQuestion} variant="contained"> <Button onClick={nextQuestion} variant="contained" >
Prochaine question Prochaine question
</Button> </Button>
</div> </div>
)} )}
</div> </div>