feat: lesson creation

This commit is contained in:
Jannat Patel
2024-03-05 23:07:58 +05:30
parent b9f6a23412
commit 0ce7c74778
11 changed files with 409 additions and 155 deletions

View File

@@ -7,7 +7,7 @@
<div class="text-lg font-semibold">
{{ __(title) }}
</div>
<Button @click="openChapterModal()">
<Button v-if="allowEdit" @click="openChapterModal()">
{{ __('Add Chapter') }}
</Button>
<!-- <span class="font-medium cursor-pointer" @click="expandAllChapters()">
@@ -25,7 +25,7 @@
:key="chapter.name"
:defaultOpen="openChapterDetail(chapter.idx)"
>
<DisclosureButton ref="" class="flex w-full px-2 py-4">
<DisclosureButton ref="" class="flex w-full px-2 py-3">
<ChevronRight
:class="{
'rotate-90 transform duration-200': open,
@@ -34,20 +34,16 @@
}"
class="h-4 w-4 text-gray-900 stroke-1 mr-2"
/>
<div class="text-base text-left font-medium">
<div class="text-base text-left font-medium leading-5">
{{ chapter.title }}
</div>
<div class="ml-auto text-sm">
{{ chapter.lessons.length }}
{{ chapter.lessons.length == 1 ? __('lesson') : __('lessons') }}
</div>
</DisclosureButton>
<DisclosurePanel class="pb-2">
<div v-for="lesson in chapter.lessons" :key="lesson.name">
<div class="outline-lesson pl-8 py-2">
<router-link
:to="{
name: 'Lesson',
name: allowEdit ? 'CreateLesson' : 'Lesson',
params: {
courseName: courseName,
chapterNumber: lesson.number.split('.')[0],
@@ -55,7 +51,7 @@
},
}"
>
<div class="flex items-center text-sm">
<div class="flex items-center text-sm leading-5">
<MonitorPlay
v-if="lesson.icon === 'icon-youtube'"
class="h-4 w-4 text-gray-900 stroke-1 mr-2"

View File

@@ -3,7 +3,7 @@
v-model="show"
:options="{
title: __('Create a Batch'),
size: 'xl',
size: '3xl',
actions: [
{
label: __('Save'),
@@ -15,14 +15,19 @@
>
<template #body-content>
<div>
<FormControl v-model="batch.title" :label="__('Title')" class="mb-4" />
<FormControl
v-model="batch.published"
type="checkbox"
:label="__('Published')"
class="mb-4"
/>
<div class="grid grid-cols-2 gap-4">
<div class="grid grid-cols-3 gap-4">
<div>
<FormControl
v-model="batch.title"
:label="__('Title')"
class="mb-4"
/>
<FormControl
v-model="batch.published"
type="checkbox"
:label="__('Published')"
/>
</div>
<div>
<FormControl
v-model="batch.start_date"
@@ -52,19 +57,7 @@
/>
</div>
</div>
<div class="grid grid-cols-2">
<div>
<FormControl
v-model="batch.medium"
:label="__('Medium')"
class="mb-4"
/>
<FormControl
v-model="batch.category"
:label="__('Category')"
class="mb-4"
/>
</div>
<div class="grid grid-cols-3 gap-4 mt-4 border-t pt-4">
<div>
<FormControl
v-model="batch.seat_count"
@@ -79,68 +72,103 @@
class="mb-4"
/>
</div>
<div>
<FormControl
v-model="batch.medium"
:label="__('Medium')"
class="mb-4"
/>
<FormControl
v-model="batch.category"
:label="__('Category')"
class="mb-4"
/>
</div>
<div>
<FileUploader
v-if="!batch.meta_image"
:fileTypes="['image/*']"
:validateFile="validateFile"
@success="
(file) => {
batch.meta_image.value = file
}
"
>
<template
v-slot="{ file, progress, uploading, openFileSelector }"
>
<div class="mb-4">
<Button @click="openFileSelector" :loading="uploading">
{{
uploading ? `Uploading ${progress}%` : 'Upload an image'
}}
</Button>
</div>
</template>
</FileUploader>
</div>
</div>
<div class="border-t pt-4 mb-4">
<FormControl
v-model="batch.paid_batch"
type="checkbox"
:label="__('Paid Batch')"
/>
<FormControl
v-model="batch.amount"
:label="__('Amount')"
type="number"
class="my-4"
/>
<Link
doctype="Currency"
v-model="batch.currency"
:filters="{ enabled: 1 }"
:label="__('Currency')"
/>
</div>
<div class="grid grid-cols-2 gap-4 border-y pt-4 mb-4"></div>
<FormControl
v-model="batch.description"
:label="__('Description')"
type="textarea"
class="mb-4"
/>
<TextEditor
v-model="batch.batch_details"
:label="__('Batch Details')"
class="mb-4"
/>
<div>
<label class="block text-sm text-gray-600 mb-1">
{{ __('Batch Details') }}
</label>
<TextEditor
:content="batch.batch_details"
@change="(val) => (batch.batch_details = val)"
:editable="true"
:fixedMenu="true"
editorClass="prose-sm max-w-none border-b border-x bg-gray-100 rounded-b-md py-1 px-2 min-h-[7rem] mb-4"
/>
</div>
<FormControl
v-model="batch_details.raw"
:label="__('Batch Details')"
v-model="batch.batch_details_raw"
:label="__('Batch Details Raw')"
type="textarea"
class="mb-4"
/>
<FileUploader
v-if="!image"
:fileTypes="['image/*']"
:validateFile="validateFile"
@success="
(file) => {
image = file
}
"
>
<template v-slot="{ file, progress, uploading, openFileSelector }">
<div class="mb-4">
<Button @click="openFileSelector" :loading="uploading">
{{ uploading ? `Uploading ${progress}%` : 'Upload an image' }}
</Button>
</div>
</template>
</FileUploader>
<div>
<FormControl
v-model="batch.paid_batch"
type="checkbox"
:label="__('Paid Batch')"
class="mb-4"
/>
<FormControl
v-model="batch.amount"
:label="__('Amount')"
type="number"
class="mb-4"
/>
<Link
doctype="Currency"
v-model="course.currency"
:filters="{ enabled: 1 }"
:label="__('Currency')"
/>
</div>
</div>
</template>
</Dialog>
</template>
<script setup>
import { Dialog, FormControl, TextEditor, FileUploader, Link } from 'frappe-ui'
import {
Dialog,
FormControl,
TextEditor,
FileUploader,
Button,
} from 'frappe-ui'
import { reactive, defineModel } from 'vue'
import Link from '@/components/Controls/Link.vue'
const show = defineModel()
const batch = reactive({
title: '',