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

feat(frontend): controllers integreren in assignments

Browse source
This commit is contained in:
Joyelle Ndagijimana 2025-04-07 21:18:09 +02:00
parent baea0051e6
commit 23947ecd92
11 changed files with 100 additions and 65 deletions
Download patch file Download diff file Expand all files Collapse all files

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

@ -5,7 +5,7 @@
import {classes} from "@/utils/tempData.ts";
import {
assignmentTitleRules,
classesRules,
classRules,
descriptionRules,
learningPathRules,
submitForm
@ -97,7 +97,7 @@
const { valid } = await form.value.validate();
// Don't submit thr form if all rules don't apply
if (!valid) return;
submitForm(assignmentTitle.value, selectedLearningPath.value, selectedClass.value, groups.value, deadline.value, description.value);
submitForm(assignmentTitle.value, selectedLearningPath.value?.hruid, selectedClass.value.value, groups.value, deadline.value, description.value, locale.value);
};
</script>
@ -109,7 +109,7 @@
<v-form ref="form" class="form-container" validate-on="submit lazy" @submit.prevent="submitFormHandler">
<v-container class="step-container">
<v-card-text>
<v-text-field :v-model="assignmentTitle" :label="t('title')" :rules="assignmentTitleRules"
<v-text-field v-model="assignmentTitle" :label="t('title')" :rules="assignmentTitleRules"
density="compact" variant="outlined" clearable required></v-text-field>
</v-card-text>
@ -136,7 +136,7 @@
v-model="selectedClass"
:items="allClasses"
:label="t('pick-class')"
:rules="classesRules"
:rules="classRules"
variant="outlined"
clearable
hide-details

55
frontend/src/views/assignments/UserAssignments.vue
View file

@ -1,11 +1,11 @@
<script setup lang="ts">
import { ref, computed, onMounted } from 'vue';
import { useI18n } from 'vue-i18n';
import { useRouter } from 'vue-router';
import {ref, computed, onMounted} from 'vue';
import {useI18n} from 'vue-i18n';
import {useRouter} from 'vue-router';
import auth from "@/services/auth/auth-service.ts";
import {assignments} from "@/utils/tempData.ts";
const { t } = useI18n();
const {t} = useI18n();
const router = useRouter();
const role = auth.authState.activeRole;
@ -19,17 +19,12 @@
};
onMounted(loadAssignments);
const goToCreateAssignment = () => {
router.push('/assignment/create');
};
const goToEditAssignment = (id: string) => {
router.push(`/assignment/${id}/edit`);
};
const goToAssignmentDetails = (id: string) => {
router.push(`/assignment/${id}`);
};
@ -45,7 +40,7 @@
<v-btn
v-if="isTeacher"
color="primary"
class="mb-4"
class="mb-4 center-btn"
@click="goToCreateAssignment"
>
{{ t('new-assignment') }}
@ -58,24 +53,26 @@
:key="assignment.id"
cols="12"
>
<v-card class="assignment-card" variant="outlined">
<v-card class="assignment-card">
<v-card-text class="card-content">
<div class="left-content">
<div class="assignment-title">{{ assignment.title }}</div>
<div class="assignment-class">
{{ t('class') }}:
<span class="class-name">
{{ assignment.class }}
</span>
{{ assignment.class }}
</span>
</div>
</div>
<div class="right-content">
<v-btn
color="primary"
@click="goToAssignmentDetails(assignment.id)"
>
{{ t('view-assignment') }}
</v-btn>
<v-card-actions>
<v-btn color="primary" @click="goToAssignmentDetails(assignment.id)">
{{ t('view-assignment') }}
</v-btn>
<v-btn v-if="isTeacher" color="red" @click="goToDeleteAssignment(assignment.id)">
{{ t('delete') }}
</v-btn>
</v-card-actions>
</div>
</v-card-text>
</v-card>
@ -94,6 +91,13 @@
box-sizing: border-box;
}
.center-btn {
display: block;
margin-left: auto;
margin-right: auto;
}
.assignment-card {
padding: 1rem;
}
@ -117,7 +121,7 @@
.assignment-title {
font-weight: bold;
font-size: 1.5rem;
margin-bottom: 0.3rem;
margin-bottom: 0.1rem;
word-break: break-word;
}
@ -133,8 +137,17 @@
.right-content {
display: flex;
align-items: center;
justify-content: flex-end;
align-items: center;
flex-shrink: 0;
flex-wrap: wrap;
width: 100%;
}
@media (min-width: 700px) {
.right-content {
width: auto;
}
}
</style>