fix: course form overflow issue

This commit is contained in:
Jannat Patel
2026-02-19 11:47:17 +05:30
parent e5f0d55ff0
commit 35adf49015
2 changed files with 28 additions and 59 deletions

View File

@@ -1,7 +1,7 @@
<template> <template>
<div class="pl-5"> <div class="pl-5">
<div class="grid grid-cols-1 md:grid-cols-[70%,30%] overflow-hidden"> <div class="grid grid-cols-1 md:grid-cols-[70%,30%]">
<div v-if="courseResource.doc" class="h-[88vh] overflow-y-auto"> <div v-if="courseResource.doc" class="lg:max-h-[88vh] lg:overflow-y-auto">
<div class="my-5"> <div class="my-5">
<div class="pr-5 md:pr-10 pb-5 mb-5 space-y-5 border-b"> <div class="pr-5 md:pr-10 pb-5 mb-5 space-y-5 border-b">
<div class="text-lg font-semibold mb-4 text-ink-gray-9"> <div class="text-lg font-semibold mb-4 text-ink-gray-9">
@@ -191,59 +191,20 @@
<div class="text-lg font-semibold mt-5 text-ink-gray-9"> <div class="text-lg font-semibold mt-5 text-ink-gray-9">
{{ __('Pricing and Certification') }} {{ __('Pricing and Certification') }}
</div> </div>
<div class="grid grid-cols-1 md:grid-cols-3 gap-5">
<FormControl
type="checkbox"
v-model="courseResource.doc.paid_course"
:label="__('Paid Course')"
@change="makeFormDirty()"
/>
<FormControl
type="checkbox"
v-model="courseResource.doc.enable_certification"
:label="__('Completion Certificate')"
@change="makeFormDirty()"
/>
<FormControl
type="checkbox"
v-model="courseResource.doc.paid_certificate"
:label="__('Paid Certificate')"
@change="makeFormDirty()"
/>
</div>
<div class="grid grid-cols-1 md:grid-cols-2 gap-5"> <div class="grid grid-cols-1 md:grid-cols-2 gap-5">
<div class="space-y-5"> <div
v-if="
courseResource.doc.paid_course ||
courseResource.doc.paid_certificate
"
class="space-y-5"
>
<FormControl <FormControl
v-if="
courseResource.doc.paid_course ||
courseResource.doc.paid_certificate
"
v-model="courseResource.doc.course_price" v-model="courseResource.doc.course_price"
:label="__('Amount')" :label="__('Amount')"
:required="
courseResource.doc.paid_course ||
courseResource.doc.paid_certificate
"
@input="makeFormDirty()" @input="makeFormDirty()"
/> />
<Link <Link
v-if="courseResource.doc.paid_certificate"
doctype="Course Evaluator"
v-model="courseResource.doc.evaluator"
:label="__('Evaluator')"
:required="courseResource.doc.paid_certificate"
:onCreate="
(value, close) => openSettings('Evaluators', close)
"
@update:modelValue="makeFormDirty()"
/>
</div>
<div class="space-y-5">
<Link
v-if="
courseResource.doc.paid_course ||
courseResource.doc.paid_certificate
"
doctype="Currency" doctype="Currency"
v-model="courseResource.doc.currency" v-model="courseResource.doc.currency"
:filters="{ enabled: 1 }" :filters="{ enabled: 1 }"
@@ -254,11 +215,21 @@
" "
@update:modelValue="makeFormDirty()" @update:modelValue="makeFormDirty()"
/> />
</div>
<div v-if="courseResource.doc.paid_certificate" class="space-y-5">
<Link
doctype="Course Evaluator"
v-model="courseResource.doc.evaluator"
:label="__('Evaluator')"
:required="courseResource.doc.paid_certificate"
:onCreate="
(value, close) => openSettings('Evaluators', close)
"
@update:modelValue="makeFormDirty()"
/>
<FormControl <FormControl
v-if="courseResource.doc.paid_certificate"
v-model="courseResource.doc.timezone" v-model="courseResource.doc.timezone"
:label="__('Timezone')" :label="__('Timezone')"
:required="courseResource.doc.paid_certificate"
:placeholder="__('e.g. IST, UTC, GMT...')" :placeholder="__('e.g. IST, UTC, GMT...')"
@input="makeFormDirty()" @input="makeFormDirty()"
/> />
@@ -290,7 +261,7 @@
</div> </div>
</div> </div>
</div> </div>
<div class="border-l h-[88vh] overflow-y-auto"> <div class="min-h-0 border-l">
<CourseOutline <CourseOutline
v-if="courseResource.doc" v-if="courseResource.doc"
:courseName="courseResource.doc.name" :courseName="courseResource.doc.name"
@@ -304,7 +275,6 @@
<script setup> <script setup>
import { import {
TextEditor, TextEditor,
Button,
createResource, createResource,
createDocumentResource, createDocumentResource,
FormControl, FormControl,
@@ -373,9 +343,9 @@ const courseResource = createDocumentResource({
watch( watch(
() => courseResource.doc, () => courseResource.doc,
() => { () => {
checkPermission()
getMetaInfo('courses', courseResource.doc?.name, meta) getMetaInfo('courses', courseResource.doc?.name, meta)
updateCourseData() updateCourseData()
checkPermission()
} }
) )
@@ -519,8 +489,7 @@ const removeTag = (tag) => {
const checkPermission = () => { const checkPermission = () => {
let user_is_instructor = false let user_is_instructor = false
if (user.data?.is_moderator) return if (user.data?.is_moderator) return
instructors.value?.forEach((instructor) => {
instructors.value.forEach((instructor) => {
if (!user_is_instructor && instructor == user.data?.name) { if (!user_is_instructor && instructor == user.data?.name) {
user_is_instructor = true user_is_instructor = true
} }

View File

@@ -34,9 +34,9 @@
"pricing_tab", "pricing_tab",
"pricing_section", "pricing_section",
"paid_course", "paid_course",
"enable_certification",
"paid_certificate", "paid_certificate",
"column_break_acoj", "column_break_acoj",
"enable_certification",
"section_break_vqbh", "section_break_vqbh",
"course_price", "course_price",
"currency", "currency",
@@ -168,7 +168,7 @@
"fieldname": "currency", "fieldname": "currency",
"fieldtype": "Link", "fieldtype": "Link",
"label": "Currency", "label": "Currency",
"mandatory_depends_on": "paid_course", "mandatory_depends_on": "eval: doc.paid_course || doc.paid_certificate",
"options": "Currency" "options": "Currency"
}, },
{ {
@@ -181,7 +181,7 @@
"fieldname": "course_price", "fieldname": "course_price",
"fieldtype": "Currency", "fieldtype": "Currency",
"label": "Amount", "label": "Amount",
"mandatory_depends_on": "paid_course" "mandatory_depends_on": "eval: doc.paid_course || doc.paid_certificate"
}, },
{ {
"fieldname": "column_break_acoj", "fieldname": "column_break_acoj",
@@ -314,7 +314,7 @@
} }
], ],
"make_attachments_public": 1, "make_attachments_public": 1,
"modified": "2026-01-13 18:48:56.069280", "modified": "2026-02-19 11:41:57.038869",
"modified_by": "sayali@frappe.io", "modified_by": "sayali@frappe.io",
"module": "LMS", "module": "LMS",
"name": "LMS Course", "name": "LMS Course",