eduvia/lms
2
0
Fork 0
Code Issues Pull Requests Actions Packages Projects Releases Wiki Activity

feat: quiz submission history table

Browse Source
This commit is contained in:
Jannat Patel
2024-01-02 11:00:12 +05:30
parent 41c3522285
commit 21959eef7b
2 changed files with 40 additions and 12 deletions
Download Patch File Download Diff File Expand all files Collapse all files

47
frontend/src/components/Quiz.vue
View File

@@ -19,7 +19,7 @@
<div class="font-semibold text-lg"> <div class="font-semibold text-lg">
{{ quiz.doc.title }} {{ quiz.doc.title }}
</div> </div>
<Button v-if="!quiz.doc.max_attempts || noOfAttempts.data.length < quiz.doc.max_attempts" @click="startQuiz" class="mt-2"> <Button v-if="!quiz.doc.max_attempts || attempts.data?.length < quiz.doc.max_attempts" @click="startQuiz" class="mt-2">
<span> <span>
{{ __("Start") }} {{ __("Start") }}
</span> </span>
@@ -110,15 +110,15 @@
{{ __("You got {0}% correct answers with a score of {1} out of {2}").format(Math.ceil(quizSubmission.data.percentage), quizSubmission.data.score, quizSubmission.data.score_out_of) }} {{ __("You got {0}% correct answers with a score of {1} out of {2}").format(Math.ceil(quizSubmission.data.percentage), quizSubmission.data.score, quizSubmission.data.score_out_of) }}
</div> </div>
<Button @click="resetQuiz()" class="mt-2" <Button @click="resetQuiz()" class="mt-2"
v-if="!quiz.doc.max_attempts || noOfAttempts.data.length < quiz.doc.max_attempts"> v-if="!quiz.doc.max_attempts || attempts?.data.length < quiz.doc.max_attempts">
<span> <span>
{{ __("Try Again") }} {{ __("Try Again") }}
</span> </span>
</Button> </Button>
</div> </div>
{{ noOfAttempts.data }} <div v-if="quiz.doc.show_submission_history && attempts?.data" class="mt-10">
<div v-if="quiz.doc.show_submission_history && noOfAttempts.data" class="mt-10"> <ListView :columns="getSubmissionColumns()" :rows="attempts?.data" row-key="name"
<ListView :columns="getSubmissionColumns()" :rows="noOfAttempts.data" row-key="name"> :options="{selectable: false, showTooltip: false}">
</ListView> </ListView>
</div> </div>
@@ -129,6 +129,7 @@ import { createDocumentResource, Button, createResource, ListView } from 'frappe
import { ref, watch, reactive, inject } from 'vue'; import { ref, watch, reactive, inject } from 'vue';
import { createToast } from "@/utils/" import { createToast } from "@/utils/"
import { CheckCircle, XCircle, MinusCircle } from "lucide-vue-next" import { CheckCircle, XCircle, MinusCircle } from "lucide-vue-next"
import { timeAgo } from "@/utils"
const user = inject("$user"); const user = inject("$user");
const activeQuestion = ref(0); const activeQuestion = ref(0);
@@ -150,7 +151,7 @@ const quiz = createDocumentResource({
auto: true, auto: true,
}); });
const noOfAttempts = createResource({ const attempts = createResource({
url: "frappe.client.get_list", url: "frappe.client.get_list",
makeParams(values) { makeParams(values) {
return { return {
@@ -159,10 +160,17 @@ const noOfAttempts = createResource({
member: user.data?.name, member: user.data?.name,
quiz: quiz.doc?.name, quiz: quiz.doc?.name,
}, },
fields: ["name", "creation", "score"] fields: ["name", "creation", "score", "score_out_of", "percentage", "passing_percentage"],
order_by: "creation desc",
} }
}, },
auto: true, auto: true,
transform(data) {
data.forEach((submission, index) => {
submission.creation = timeAgo(submission.creation);
submission.idx = index + 1;
});
}
}) })
const quizSubmission = createResource({ const quizSubmission = createResource({
@@ -290,7 +298,7 @@ const submitQuiz = () => {
const createSubmission = () => { const createSubmission = () => {
quizSubmission.reload().then(() => { quizSubmission.reload().then(() => {
noOfAttempts.reload(); attempts.reload();
}); });
} }
@@ -304,14 +312,29 @@ const resetQuiz = () => {
const getSubmissionColumns = () => { const getSubmissionColumns = () => {
return [ return [
{ {
label: "No." label: "No.",
key: "idx",
}, },
{ {
label: "Score" label: "Date",
key: "creation",
}, },
{ {
label: "Date" label: "Score",
} key: "score",
align: "center"
},
{
label: "Score out of",
key: "score_out_of",
align: "center"
},
{
label: "Percentage",
key: "percentage",
align: "center"
},
] ]
} }
</script> </script>

5
frontend/src/utils/index.js
View File

@@ -1,4 +1,5 @@
import { toast } from 'frappe-ui' import { toast } from 'frappe-ui'
import { useDateFormat, useTimeAgo } from '@vueuse/core'
export function createToast(options) { export function createToast(options) {
toast({ toast({
@@ -6,3 +7,7 @@ export function createToast(options) {
...options, ...options,
}) })
} }
export function timeAgo(date) {
return useTimeAgo(date).value
}