tdpeuter/2025SELab2-project-Dwengo
tdpeuter/2025SELab2-project-Dwengo
1
Fork 0
Code Issues Releases 4 Packages 2 Wiki Activity

style: fix linting issues met Prettier

Browse source
This commit is contained in:
Lint Action 2025-05-17 18:47:26 +00:00
parent 5b00066106
commit 323d66bbcb
12 changed files with 908 additions and 898 deletions
Download patch file Download diff file Expand all files Collapse all files

4
backend/src/controllers/assignments.ts
View file

@ -39,9 +39,9 @@ export async function getAllAssignmentsHandler(req: Request, res: Response): Pro
export async function createAssignmentHandler(req: Request, res: Response): Promise<void> {
const classid = req.params.classid;
const description = req.body.description || "";
const description = req.body.description || '';
const language = req.body.language || FALLBACK_LANG;
const learningPath = req.body.learningPath || "";
const learningPath = req.body.learningPath || '';
const title = req.body.title;
requireFields({ title });

2
backend/src/data/assignments/assignment-repository.ts
View file

@ -20,7 +20,7 @@ export class AssignmentRepository extends DwengoEntityRepository<Assignment> {
},
},
},
populate: ['groups', 'groups.members']
populate: ['groups', 'groups.members'],
});
}
public async findAllAssignmentsInClass(within: Class): Promise<Assignment[]> {

1
backend/src/routes/teachers.ts
View file

@ -31,7 +31,6 @@ router.get('/:username/students', preventImpersonation, getTeacherStudentHandler
router.get(`/:username/assignments`, getTeacherAssignmentsHandler);
router.get('/:username/joinRequests/:classId', onlyAllowTeacherOfClass, getStudentJoinRequestHandler);
router.put('/:username/joinRequests/:classId/:studentUsername', onlyAllowTeacherOfClass, updateStudentJoinRequestHandler);

10
backend/src/services/assignments.ts
View file

@ -103,20 +103,22 @@ export async function putAssignment(classid: string, id: number, assignmentData:
if (assignmentData.groups) {
const hasDuplicates = (arr: string[]) => new Set(arr).size !== arr.length;
if (hasDuplicates(assignmentData.groups.flat() as string[])) {
throw new BadRequestException("Student can only be in one group");
throw new BadRequestException('Student can only be in one group');
}
const studentLists = await Promise.all((assignmentData.groups as string[][]).map(async group => await fetchStudents(group)));
const studentLists = await Promise.all((assignmentData.groups as string[][]).map(async (group) => await fetchStudents(group)));
const groupRepository = getGroupRepository();
await groupRepository.deleteAllByAssignment(assignment);
await Promise.all(studentLists.map(async students => {
await Promise.all(
studentLists.map(async (students) => {
const newGroup = groupRepository.create({
assignment: assignment,
members: students,
});
await groupRepository.save(newGroup);
}));
})
);
delete assignmentData.groups;
}

7
backend/src/services/teachers.ts
View file

@ -1,9 +1,4 @@
import {
getAssignmentRepository,
getClassJoinRequestRepository,
getClassRepository,
getTeacherRepository,
} from '../data/repositories.js';
import { getAssignmentRepository, getClassJoinRequestRepository, getClassRepository, getTeacherRepository } from '../data/repositories.js';
import { mapToClassDTO } from '../interfaces/class.js';
import { mapToTeacher, mapToTeacherDTO } from '../interfaces/teacher.js';
import { Teacher } from '../entities/users/teacher.entity.js';

2
frontend/src/components/GroupSubmissionStatus.vue
View file

@ -29,7 +29,7 @@
emit("update:hasSubmission", data.submissions.length > 0);
}
},
{ immediate: true }
{ immediate: true },
);
</script>

4
frontend/src/components/assignments/DeadlineSelector.vue
View file

@ -6,8 +6,7 @@
const datetime = ref("");
datetime.value = props.deadline ? new Date(props.deadline).toISOString().slice(0, 16) : ""
datetime.value = props.deadline ? new Date(props.deadline).toISOString().slice(0, 16) : "";
// Watch the datetime value and emit the update
watch(datetime, (val) => {
@ -21,7 +20,6 @@
const deadlineRules = [
(value: string): string | boolean => {
const selectedDateTime = new Date(value);
const now = new Date();

150
frontend/src/components/assignments/GroupSelector.vue
View file

@ -21,7 +21,7 @@ const {data: studentsData} = useClassStudentsQuery(() => props.classId, true);
const activeDialog = ref<"random" | "dragdrop" | null>(null);
// Drag state for the drag and drop
const draggedItem = ref<{ groupIndex: number, studentIndex: number } | null>(null);
const draggedItem = ref<{ groupIndex: number; studentIndex: number } | null>(null);
const currentGroups = ref<StudentItem[][]>([]);
const unassignedStudents = ref<StudentItem[]>([]);
@ -46,10 +46,10 @@ watch(
// Initialize groups if they exist
if (existingGroups && existingGroups.length > 0) {
currentGroups.value = existingGroups.map((group) =>
group.members.map(member => ({
group.members.map((member) => ({
username: member.username,
fullName: `${member.firstName} ${member.lastName}`
}))
fullName: `${member.firstName} ${member.lastName}`,
})),
);
const assignedUsernames = new Set(
existingGroups.flatMap((g) => g.members.map((m: StudentItem) => m.username)),
@ -138,7 +138,7 @@ const touchState = ref<TouchState>({
element: null,
clone: null,
originalRect: null,
hasMoved: false
hasMoved: false,
});
function handleTouchStart(event: TouchEvent, groupIndex: number, studentIndex: number): void {
@ -147,7 +147,7 @@ function handleTouchStart(event: TouchEvent, groupIndex: number, studentIndex: n
const touch = event.touches[0];
const target = event.target as HTMLElement;
// Target the chip directly instead of the draggable container
const chip = target.closest('.v-chip') as HTMLElement;
const chip = target.closest(".v-chip") as HTMLElement;
if (!chip) return;
@ -163,34 +163,34 @@ function handleTouchStart(event: TouchEvent, groupIndex: number, studentIndex: n
element: chip,
clone: null,
originalRect: rect,
hasMoved: false
hasMoved: false,
};
// Clone only the chip
const clone = chip.cloneNode(true) as HTMLElement;
clone.classList.add('drag-clone');
clone.style.position = 'fixed';
clone.style.zIndex = '10000';
clone.style.opacity = '0.9';
clone.style.pointerEvents = 'none';
clone.classList.add("drag-clone");
clone.style.position = "fixed";
clone.style.zIndex = "10000";
clone.style.opacity = "0.9";
clone.style.pointerEvents = "none";
clone.style.width = `${rect.width}px`;
clone.style.height = `${rect.height}px`;
clone.style.left = `${rect.left}px`;
clone.style.top = `${rect.top}px`;
clone.style.transform = 'scale(1.05)';
clone.style.boxShadow = '0 4px 8px rgba(0,0,0,0.3)';
clone.style.transition = 'transform 0.1s';
clone.style.transform = "scale(1.05)";
clone.style.boxShadow = "0 4px 8px rgba(0,0,0,0.3)";
clone.style.transition = "transform 0.1s";
// Ensure the clone has the same chip styling
clone.style.backgroundColor = getComputedStyle(chip).backgroundColor;
clone.style.color = getComputedStyle(chip).color;
clone.style.borderRadius = getComputedStyle(chip).borderRadius;
clone.style.padding = getComputedStyle(chip).padding;
clone.style.margin = '0'; // Remove any margin
clone.style.margin = "0"; // Remove any margin
document.body.appendChild(clone);
touchState.value.clone = clone;
chip.style.visibility = 'hidden';
chip.style.visibility = "hidden";
event.preventDefault();
event.stopPropagation();
@ -212,15 +212,15 @@ function handleTouchMove(event: TouchEvent): void {
clone.style.left = `${touch.clientX - clone.offsetWidth / 2}px`;
clone.style.top = `${touch.clientY - clone.offsetHeight / 2}px`;
document.querySelectorAll('.group-box').forEach(el => {
el.classList.remove('highlight');
document.querySelectorAll(".group-box").forEach((el) => {
el.classList.remove("highlight");
});
const elements = document.elementsFromPoint(touch.clientX, touch.clientY);
const dropTarget = elements.find(el => el.classList.contains('group-box'));
const dropTarget = elements.find((el) => el.classList.contains("group-box"));
if (dropTarget) {
dropTarget.classList.add('highlight');
dropTarget.classList.add("highlight");
}
event.preventDefault();
@ -230,16 +230,10 @@ function handleTouchMove(event: TouchEvent): void {
function handleTouchEnd(event: TouchEvent): void {
if (!touchState.value.isDragging) return;
const {
currentGroupIndex,
currentStudentIndex,
clone,
element,
hasMoved
} = touchState.value;
const { currentGroupIndex, currentStudentIndex, clone, element, hasMoved } = touchState.value;
document.querySelectorAll('.group-box').forEach(el => {
el.classList.remove('highlight');
document.querySelectorAll(".group-box").forEach((el) => {
el.classList.remove("highlight");
});
if (clone?.parentNode) {
@ -247,25 +241,23 @@ function handleTouchEnd(event: TouchEvent): void {
}
if (element) {
element.style.visibility = 'visible';
element.style.visibility = "visible";
}
if (hasMoved && event.changedTouches.length > 0) {
const touch = event.changedTouches[0];
const elements = document.elementsFromPoint(touch.clientX, touch.clientY);
const dropTarget = elements.find(el => el.classList.contains('group-box'));
const dropTarget = elements.find((el) => el.classList.contains("group-box"));
if (dropTarget) {
const groupBoxes = document.querySelectorAll('.group-box');
const groupBoxes = document.querySelectorAll(".group-box");
const targetGroupIndex = Array.from(groupBoxes).indexOf(dropTarget);
if (targetGroupIndex !== currentGroupIndex) {
const sourceArray = currentGroupIndex === -1
? unassignedStudents.value
: currentGroups.value[currentGroupIndex];
const targetArray = targetGroupIndex === -1
? unassignedStudents.value
: currentGroups.value[targetGroupIndex];
const sourceArray =
currentGroupIndex === -1 ? unassignedStudents.value : currentGroups.value[currentGroupIndex];
const targetArray =
targetGroupIndex === -1 ? unassignedStudents.value : currentGroups.value[targetGroupIndex];
if (sourceArray && targetArray) {
const [movedStudent] = sourceArray.splice(currentStudentIndex, 1);
@ -284,7 +276,7 @@ function handleTouchEnd(event: TouchEvent): void {
element: null,
clone: null,
originalRect: null,
hasMoved: false
hasMoved: false,
};
event.preventDefault();
@ -294,8 +286,8 @@ function handleTouchEnd(event: TouchEvent): void {
function handleDragStart(event: DragEvent, groupIndex: number, studentIndex: number): void {
draggedItem.value = { groupIndex, studentIndex };
if (event.dataTransfer) {
event.dataTransfer.effectAllowed = 'move';
event.dataTransfer.setData('text/plain', '');
event.dataTransfer.effectAllowed = "move";
event.dataTransfer.setData("text/plain", "");
}
}
@ -311,12 +303,8 @@ function handleDrop(e: DragEvent, targetGroupIndex: number, targetStudentIndex?:
if (!draggedItem.value) return;
const { groupIndex: sourceGroupIndex, studentIndex: sourceStudentIndex } = draggedItem.value;
const sourceArray = sourceGroupIndex === -1
? unassignedStudents.value
: currentGroups.value[sourceGroupIndex];
const targetArray = targetGroupIndex === -1
? unassignedStudents.value
: currentGroups.value[targetGroupIndex];
const sourceArray = sourceGroupIndex === -1 ? unassignedStudents.value : currentGroups.value[sourceGroupIndex];
const targetArray = targetGroupIndex === -1 ? unassignedStudents.value : currentGroups.value[targetGroupIndex];
const [movedStudent] = sourceArray.splice(sourceStudentIndex, 1);
if (targetStudentIndex !== undefined) {
@ -357,7 +345,10 @@ function removeStudent(groupIndex: number, student: StudentItem): void {
<template>
<v-card class="pa-4 minimal-card">
<!-- Current groups and unassigned students Preview -->
<div v-if="showGroupsPreview" class="mb-6">
<div
v-if="showGroupsPreview"
class="mb-6"
>
<h3 class="mb-2">{{ t("current-groups") }}</h3>
<div>
<div class="d-flex flex-wrap">
@ -366,11 +357,23 @@ function removeStudent(groupIndex: number, student: StudentItem): void {
</div>
</div>
<v-row justify="center" class="mb-4">
<v-btn color="primary" @click="activeDialog = 'random'" prepend-icon="mdi-shuffle">
<v-row
justify="center"
class="mb-4"
>
<v-btn
color="primary"
@click="activeDialog = 'random'"
prepend-icon="mdi-shuffle"
>
{{ t("random-grouping") }}
</v-btn>
<v-btn color="secondary" class="ml-4" @click="activeDialog = 'dragdrop'" prepend-icon="mdi-drag">
<v-btn
color="secondary"
class="ml-4"
@click="activeDialog = 'dragdrop'"
prepend-icon="mdi-drag"
>
{{ t("drag-and-drop") }}
</v-btn>
</v-row>
@ -437,7 +440,11 @@ function removeStudent(groupIndex: number, student: StudentItem): void {
<v-card-actions class="dialog-actions">
<v-spacer />
<v-btn text @click="activeDialog = null">{{ t("cancel") }}</v-btn>
<v-btn
text
@click="activeDialog = null"
>{{ t("cancel") }}</v-btn
>
<v-btn
color="success"
@click="saveRandomGroups"
@ -458,14 +465,25 @@ function removeStudent(groupIndex: number, student: StudentItem): void {
<v-card class="custom-dialog">
<v-card-title class="dialog-title d-flex justify-space-between align-center">
<div>{{ t("drag-and-drop") }}</div>
<v-btn color="primary" small @click="addNewGroup">+</v-btn>
<v-btn
color="primary"
small
@click="addNewGroup"
>+</v-btn
>
</v-card-title>
<v-card-text>
<v-row>
<!-- Groups Column -->
<v-col cols="12" md="8">
<div v-if="currentGroups.length === 0" class="text-center py-4">
<v-col
cols="12"
md="8"
>
<div
v-if="currentGroups.length === 0"
class="text-center py-4"
>
<v-alert type="info">{{ t("no-groups-yet") }}</v-alert>
</div>
@ -479,7 +497,12 @@ function removeStudent(groupIndex: number, student: StudentItem): void {
>
<div class="d-flex justify-space-between align-center mb-2">
<strong>{{ t("group") }} {{ groupIndex + 1 }}</strong>
<v-btn icon small color="error" @click="removeGroup(groupIndex)">
<v-btn
icon
small
color="error"
@click="removeGroup(groupIndex)"
>
<v-icon>mdi-delete</v-icon>
</v-btn>
</div>
@ -497,7 +520,10 @@ function removeStudent(groupIndex: number, student: StudentItem): void {
@dragover.prevent="handleDragOver($event, groupIndex)"
@drop="handleDrop($event, groupIndex, studentIndex)"
>
<v-chip close @click:close="removeStudent(groupIndex, student)">
<v-chip
close
@click:close="removeStudent(groupIndex, student)"
>
{{ student.fullName }}
</v-chip>
</div>
@ -540,7 +566,11 @@ function removeStudent(groupIndex: number, student: StudentItem): void {
<v-card-actions>
<v-spacer />
<v-btn text @click="activeDialog = null">{{ t("cancel") }}</v-btn>
<v-btn
text
@click="activeDialog = null"
>{{ t("cancel") }}</v-btn
>
<v-btn
color="primary"
@click="saveDragDrop"
@ -623,7 +653,7 @@ function removeStudent(groupIndex: number, student: StudentItem): void {
}
.v-btn.custom-green:hover {
background-color: #388e3c
background-color: #388e3c;
}
.v-btn.custom-blue {

3
frontend/src/utils/assignment-rules.ts
View file

@ -1,11 +1,9 @@
/**
* Validation rule for the assignment title.
*
* Ensures that the title is not empty.
*/
/**
* Validation rule for the classes selection.
*
@ -17,4 +15,3 @@
*
* Ensures that a valid deadline is selected and is in the future.
*/

14
frontend/src/views/assignments/CreateAssignment.vue
View file

@ -42,7 +42,7 @@ watch(learningPathsQueryResults.data, (data) => {
if (!hruidFromRoute || !data) return;
// Verify if the hruid given in the url is valid before accepting it
const matchedLP = data.find(lp => lp.hruid === hruidFromRoute);
const matchedLP = data.find((lp) => lp.hruid === hruidFromRoute);
if (matchedLP) {
selectedLearningPath.value = matchedLP;
lpIsSelected.value = true;
@ -61,9 +61,7 @@ async function submitFormHandler(): Promise<void> {
const { valid } = await form.value.validate();
if (!valid) return;
const lp = lpIsSelected.value
? route.query.hruid?.toString()
: selectedLearningPath.value?.hruid;
const lp = lpIsSelected.value ? route.query.hruid?.toString() : selectedLearningPath.value?.hruid;
if (!lp) {
return;
}
@ -84,15 +82,14 @@ async function submitFormHandler(): Promise<void> {
const learningPathRules = [
(value: LearningPath): string | boolean => {
if (lpIsSelected.value) return true;
if (!value) return t("lp-required");
const allLPs = learningPathsQueryResults.data.value ?? [];
const valid = allLPs.some(lp => lp.hruid === value?.hruid);
const valid = allLPs.some((lp) => lp.hruid === value?.hruid);
return valid || t("lp-invalid");
}
},
];
const assignmentTitleRules = [
@ -112,8 +109,6 @@ const classRules = [
return t("class-required");
},
];
</script>
<template>
@ -156,7 +151,6 @@ const classRules = [
:disabled="lpIsSelected"
return-object
/>
</using-query-result>
<!-- Klas keuze -->

25
frontend/src/views/assignments/TeacherAssignment.vue
View file

@ -62,7 +62,6 @@ watchEffect(() => {
const hasSubmissions = ref<boolean>(false);
const allGroups = computed(() => {
const groups = groupsQueryResult.data.value?.groups;
@ -76,7 +75,7 @@ const allGroups = computed(() => {
groupNo: index + 1, // New group number that will be used
name: `${t("group")} ${index + 1}`,
members: group.members,
originalGroupNo: group.groupNumber
originalGroupNo: group.groupNumber,
}));
});
@ -88,7 +87,6 @@ function openGroupDetails(group: object): void {
dialog.value = true;
}
async function deleteAssignment(num: number, clsId: string): Promise<void> {
const { mutate } = useDeleteAssignmentMutation();
mutate(
@ -153,7 +151,6 @@ async function handleGroupsUpdated(updatedGroups: string[][]): Promise<void> {
data: assignmentDTO,
});
}
</script>
<template>
@ -275,9 +272,7 @@ async function handleGroupsUpdated(updatedGroups: string[][]): Promise<void> {
</using-query-result>
</v-card-subtitle>
<v-card-text v-if="isEditing">
<deadline-selector
v-model:deadline="deadline"
/>
<deadline-selector v-model:deadline="deadline" />
</v-card-text>
<v-card-text
v-if="!isEditing"
@ -374,9 +369,7 @@ async function handleGroupsUpdated(updatedGroups: string[][]): Promise<void> {
:key="g.originalGroupNo"
>
<td>
<v-btn
variant="text"
>
<v-btn variant="text">
{{ g.name }}
</v-btn>
</td>
@ -398,8 +391,9 @@ async function handleGroupsUpdated(updatedGroups: string[][]): Promise<void> {
:class-id="classId"
:language="lang"
:go-to-group-submission-link="goToGroupSubmissionLink"
@update:hasSubmission="(hasSubmission) => hasSubmissions = hasSubmission"
@update:hasSubmission="
(hasSubmission) => (hasSubmissions = hasSubmission)
"
/>
</td>
@ -438,13 +432,15 @@ async function handleGroupsUpdated(updatedGroups: string[][]): Promise<void> {
<v-card-actions>
<v-spacer></v-spacer>
<v-btn text @click="editGroups = false">
<v-btn
text
@click="editGroups = false"
>
{{ t("cancel") }}
</v-btn>
</v-card-actions>
</v-card>
</v-dialog>
</v-container>
</using-query-result>
</div>
@ -581,5 +577,4 @@ main {
max-height: 80vh;
overflow-y: auto;
}
</style>