fix: UI bugs

This commit is contained in:
swve 2024-08-08 21:07:29 +02:00
parent 360c6b1e1a
commit dc1673c053
4 changed files with 21 additions and 17 deletions

View file

@ -21,7 +21,7 @@ import { getAssignmentFromActivityUUID, getFinalGrade, submitAssignmentForGradin
import AssignmentStudentActivity from '@components/Objects/Activities/Assignment/AssignmentStudentActivity'
import { AssignmentProvider } from '@components/Contexts/Assignments/AssignmentContext'
import { AssignmentsTaskProvider } from '@components/Contexts/Assignments/AssignmentsTaskContext'
import AssignmentSubmissionProvider, { AssignmentSubmissionContext, useAssignmentSubmission } from '@components/Contexts/Assignments/AssignmentSubmissionContext'
import AssignmentSubmissionProvider, { useAssignmentSubmission } from '@components/Contexts/Assignments/AssignmentSubmissionContext'
import toast from 'react-hot-toast'
import { mutate } from 'swr'
import ConfirmationModal from '@components/StyledElements/ConfirmationModal/ConfirmationModal'
@ -303,11 +303,11 @@ function AssignmentTools(props: {
props.assignment?.assignment_uuid,
session.data?.tokens?.access_token
);
if (res.success) {
const { grade, max_grade, grading_type } = res.data;
let displayGrade;
switch (grading_type) {
case 'ALPHABET':
displayGrade = convertNumericToAlphabet(grade, max_grade);
@ -322,15 +322,15 @@ function AssignmentTools(props: {
default:
displayGrade = 'Unknown grading type';
}
// Use displayGrade here, e.g., update state or display it
setFinalGrade(displayGrade);
} else {
}
};
// Helper function to convert numeric grade to alphabet grade
function convertNumericToAlphabet(grade : any, maxGrade : any) {
function convertNumericToAlphabet(grade: any, maxGrade: any) {
const percentage = (grade / maxGrade) * 100;
if (percentage >= 90) return 'A';
if (percentage >= 80) return 'B';
@ -340,7 +340,9 @@ function AssignmentTools(props: {
}
useEffect(() => {
getGradingBasedOnMethod();
if ( submission && submission.length > 0 && submission[0].submission_status === 'GRADED') {
getGradingBasedOnMethod();
}
}
, [submission, props.assignment])

View file

@ -59,10 +59,9 @@ function AssignmentsHome() {
<div className='flex space-x-2 items-center'>
<MiniThumbnail course={courses[index]} />
<div className='flex flex-col font-bold text-lg '>
<p className='bg-gray-200 text-gray-700 px-2 text-xs py-0.5 rounded-full'>Course</p>
<p className='bg-gray-200 text-gray-700 px-2 text-xs py-0.5 rounded-full w-fit'>Course</p>
<p>{courses[index].name}</p>
</div>
</div>
<Link
href={{
@ -84,7 +83,7 @@ function AssignmentsHome() {
<p>Assignment</p>
</div>
<div className='flex font-semibold text-lg'>{assignment.title}</div>
<div className='flex font-semibold text'>{assignment.description}</div>
<div className='flex font-semibold text-gray-600 px-2 py-0.5 rounded outline outline-gray-200/70'>{assignment.description}</div>
</div>
<div className='flex space-x-2 font-bold text-sm items-center'>
@ -121,7 +120,7 @@ function AssignmentsHome() {
<p>No assignments available for this course, create course assignments from the course editor</p>
</div>
</>
)}
)}
</div>
</div>
))}

View file

@ -20,9 +20,10 @@ function AssignmentBoxUI({ type, view, currentPoints, maxPoints, saveFC, submitF
const [customGrade, setCustomGrade] = React.useState<number>(0)
const submission = useAssignmentSubmission() as any
useEffect(() => {
console.log(submission)
}
, [submission])
return (
<div className='flex flex-col px-6 py-4 nice-shadow rounded-md bg-slate-100/30'>
<div className='flex justify-between space-x-2 pb-2 text-slate-400 items-center'>
@ -88,10 +89,11 @@ function AssignmentBoxUI({ type, view, currentPoints, maxPoints, saveFC, submitF
{/* Grading button */}
{view === 'grading' &&
<div
onClick={() => gradeFC && gradeFC()}
className='flex px-0.5 py-0.5 cursor-pointer rounded-md space-x-2 items-center bg-gradient-to-bl hover:outline-offset-4 active:outline-offset-1 linear transition-all outline-offset-2 outline-dashed outline-orange-500/60'>
<p className='font-semibold px-2 text-xs text-orange-700'>Current points : {currentPoints}</p>
<div className='bg-gradient-to-bl text-orange-700 bg-orange-300/20 hover:bg-orange-300/10 items-center flex rounded-md px-2 py-1 space-x-2'>
<div
onClick={() => gradeFC && gradeFC()}
className='bg-gradient-to-bl text-orange-700 bg-orange-300/20 hover:bg-orange-300/10 items-center flex rounded-md px-2 py-1 space-x-2'>
<BookPlus size={14} />
<p className='text-xs font-semibold'>Grade</p>
</div>
@ -101,13 +103,14 @@ function AssignmentBoxUI({ type, view, currentPoints, maxPoints, saveFC, submitF
{/* CustomGrading button */}
{view === 'custom-grading' && maxPoints &&
<div
onClick={() => gradeCustomFC && gradeCustomFC(customGrade)}
className='flex px-0.5 py-0.5 cursor-pointer rounded-md space-x-2 items-center bg-gradient-to-bl hover:outline-offset-4 active:outline-offset-1 linear transition-all outline-offset-2 outline-dashed outline-orange-500/60'>
<p className='font-semibold px-2 text-xs text-orange-700'>Current points : {currentPoints}</p>
<input
onChange={(e) => setCustomGrade(parseInt(e.target.value))}
placeholder={maxPoints.toString()} className='w-[100px] light-shadow text-sm py-0.5 outline outline-gray-200 rounded-lg px-2' type="number" />
<div className='bg-gradient-to-bl text-orange-700 bg-orange-300/20 hover:bg-orange-300/10 items-center flex rounded-md px-2 py-1 space-x-2'>
<div
onClick={() => gradeCustomFC && gradeCustomFC(customGrade)}
className='bg-gradient-to-bl text-orange-700 bg-orange-300/20 hover:bg-orange-300/10 items-center flex rounded-md px-2 py-1 space-x-2'>
<BookPlus size={14} />
<p className='text-xs font-semibold'>Grade</p>
</div>

View file

@ -7,7 +7,7 @@ import {
export async function createAssignment(body: any, access_token: string) {
const result: any = await fetch(
`${getAPIUrl()}assignments`,
`${getAPIUrl()}assignments/`,
RequestBodyWithAuthHeader('POST', body, null, access_token)
)
const res = await getResponseMetadata(result)