fix: assignment and quiz rendering issue in courses

frontend/src/utils/assignment.js

@@ -1,11 +1,9 @@
 import { Pencil } from 'lucide-vue-next'
 import { createApp, h } from 'vue'
 import AssessmentPlugin from '@/components/AssessmentPlugin.vue'
-import AssignmentBlock from '@/components/AssignmentBlock.vue'
 import translationPlugin from '../translation'
 import { usersStore } from '@/stores/user'
-import router from '../router'
-import { FrappeUI, setConfig, frappeRequest, pageMetaPlugin } from 'frappe-ui'
+import { call } from 'frappe-ui'
 
 export class Assignment {
 	constructor({ data, api, readOnly }) {
@@ -44,17 +42,18 @@ export class Assignment {
 
 	renderAssignment(assignment) {
 		if (this.readOnly) {
-			const app = createApp(AssignmentBlock, {
-				assignmentID: assignment,
-			})
-			app.use(FrappeUI)
-			setConfig('resourceFetcher', frappeRequest)
-			app.use(translationPlugin)
-			app.use(router)
-			app.use(pageMetaPlugin)
 			const { userResource } = usersStore()
-			app.provide('$user', userResource)
-			app.mount(this.wrapper)
+			call('frappe.client.get_value', {
+				doctype: 'LMS Assignment Submission',
+				filters: {
+					assignment: assignment,
+					member: userResource.data?.name,
+				},
+				fieldname: ['name'],
+			}).then((data) => {
+				let submission = data.name || 'new'
+				this.wrapper.innerHTML = `<iframe src="/lms/assignment-submission/${assignment}/${submission}?fromLesson=1" class="w-full h-[500px]"></iframe>`
+			})
 			return
 		}
 		this.wrapper.innerHTML = `<div class='border rounded-md p-10 text-center bg-surface-menu-bar mb-2'>

frontend/src/utils/quiz.js

@@ -43,14 +43,7 @@ export class Quiz {
 
 	renderQuiz(quiz) {
 		if (this.readOnly) {
-			const app = createApp(QuizBlock, {
-				quiz: quiz,
-			})
-			app.use(translationPlugin)
-			app.use(router)
-			const { userResource } = usersStore()
-			app.provide('$user', userResource)
-			app.mount(this.wrapper)
+			this.wrapper.innerHTML = `<iframe src="/lms/quiz/${quiz}?fromLesson=1" class="w-full h-[500px]"></iframe>`
 			return
 		}
 		this.wrapper.innerHTML = `<div class='border rounded-md p-10 text-center bg-surface-menu-bar mb-2'>