Compare commits

..

1 Commits

Author SHA1 Message Date
frappe-pr-bot
7fac29e3e4 chore: update POT file 2024-10-25 10:37:03 +00:00
158 changed files with 12754 additions and 80783 deletions

BIN
.github/batch.png vendored

Binary file not shown.

Before

Width:  |  Height:  |  Size: 1.1 MiB

Binary file not shown.

Before

Width:  |  Height:  |  Size: 912 KiB

View File

@@ -5,7 +5,7 @@ echo "Setting Up System Dependencies..."
sudo apt update
sudo apt remove mysql-server mysql-client
sudo apt-get install libcups2-dev redis-server mariadb-client
sudo apt install libcups2-dev redis-server mariadb-client-10.6
install_wkhtmltopdf() {
wget -q https://github.com/wkhtmltopdf/packaging/releases/download/0.12.6-1/wkhtmltox_0.12.6-1.focal_amd64.deb

BIN
.github/hero.png vendored

Binary file not shown.

Before

Width:  |  Height:  |  Size: 2.0 MiB

BIN
.github/lms-logo.png vendored

Binary file not shown.

Before

Width:  |  Height:  |  Size: 5.4 KiB

BIN
.github/quiz.png vendored

Binary file not shown.

Before

Width:  |  Height:  |  Size: 1.0 MiB

View File

@@ -1,64 +0,0 @@
name: Build Container Image
on:
workflow_dispatch:
push:
branches:
- main
tags:
- "*"
jobs:
build:
name: Build
runs-on: ubuntu-latest
strategy:
matrix:
arch: [amd64, arm64]
permissions:
packages: write
steps:
- name: Checkout Entire Repository
uses: actions/checkout@v4
- name: Set up QEMU
uses: docker/setup-qemu-action@v3
- name: Set up Docker Buildx
uses: docker/setup-buildx-action@v3
with:
platforms: linux/${{ matrix.arch }}
- name: Login to GitHub Container Registry
uses: docker/login-action@v2
with:
registry: ghcr.io
username: ${{ github.actor }}
password: ${{ secrets.GITHUB_TOKEN }}
- name: Set Branch
run: |
export APPS_JSON='[{"url": "https://github.com/frappe/lms","branch": "main"}]'
echo "APPS_JSON_BASE64=$(echo $APPS_JSON | base64 -w 0)" >> $GITHUB_ENV
echo "FRAPPE_BRANCH=version-15" >> $GITHUB_ENV
- name: Set Image Tag
run: |
echo "IMAGE_TAG=stable" >> $GITHUB_ENV
- uses: actions/checkout@v4
with:
repository: frappe/frappe_docker
path: builds
- name: Build and push
uses: docker/build-push-action@v6
with:
push: true
context: builds
file: builds/images/layered/Containerfile
tags: >
ghcr.io/${{ github.repository }}:${{ github.ref_name }},
ghcr.io/${{ github.repository }}:${{ env.IMAGE_TAG }}
build-args: |
"FRAPPE_BRANCH=${{ env.FRAPPE_BRANCH }}"
"APPS_JSON_BASE64=${{ env.APPS_JSON_BASE64 }}"

View File

@@ -24,7 +24,7 @@ jobs:
services:
mariadb:
image: mariadb:10.8
image: mariadb:10.6
env:
MARIADB_ROOT_PASSWORD: 123
ports:

227
README.md
View File

@@ -1,174 +1,115 @@
<div align="center" markdown="1">
<p align="center">
<a href="https://www.frappelms.com/">
<img src="https://frappe.io/files/lms.png" alt="Frappe LMS" width="50px" height="50px">
</a>
<p align="center">Easy to use, open source, learning management system.</p>
</p>
<img src=".github/lms-logo.png" alt="Frappe Learning logo" width="80" height="80"/>
<h1>Frappe Learning</h1>
**Easy to use, open source, Learning Management System**
&nbsp;
![Tests](https://img.shields.io/endpoint?url=https://dashboard.cypress.io/badge/simple/vandxn/main&style=flat&logo=cypress)
<p align="center">
<a href="https://www.producthunt.com/posts/frappe-lms?utm_source=badge-top-post-topic-badge&utm_medium=badge&utm_souce=badge-frappe&#0045;lms" target="_blank"><img src="https://api.producthunt.com/widgets/embed-image/v1/top-post-topic-badge.svg?post_id=396079&theme=dark&period=weekly&topic_id=204" alt="Frappe&#0032;LMS - Easy&#0032;to&#0032;use&#0044;&#0032;100&#0037;&#0032;open&#0032;source&#0032;learning&#0032;management&#0032;system | Product Hunt" style="width: 250px; height: 54px;" width="250" height="54" /></a>
</p>
<div align="center" style="max-height: 40px;">
<a href="https://frappecloud.com/lms/signup">
<img src=".github/try-on-f-cloud.svg" height="40">
</a>
</div>
&nbsp;
<div align="center">
<img src=".github/hero.png?v=5" alt="Hero Image" width="72%" />
</div>
<br />
<div align="center">
<a href="https://frappe.io/learning">Website</a>
-
<a href="https://docs.frappe.io/learning">Documentation</a>
</div>
<p align="center">
<a href="https://dashboard.cypress.io/projects/vandxn/runs">
<img alt="cypress" src="https://img.shields.io/endpoint?url=https://dashboard.cypress.io/badge/simple/vandxn/main&style=flat&logo=cypress">
</a>
<a href="https://github.com/frappe/lms/blob/main/LICENSE">
<img alt="license" src="https://img.shields.io/badge/license-AGPLv3-blue">
</a>
</p>
## Frappe Learning
Frappe Learning is an easy-to-use learning system that helps you bring structure to your content.
### Motivation
In 2021, we were looking for a Learning Management System to launch [Mon.School](https://mon.school) for FOSS United. We checked out Moodle, but it didnt feel right. The forms were unnecessarily lengthy and the UI was confusing. It shouldn't be this hard to create a course right? So I started making a learning system for Mon.School which soon became a product in itself. The aim is to have a simple platform that anyone can use to launch a course of their own and make knowledge sharing easier.
### Key Features
- **Structured Learning**: Design a course with a 3-level hierarchy, where your courses have chapters and you can group your lessons within these chapters. This ensures that the context of the lesson is set by the chapter.
- **Live Classes**: Group learners into batches based on courses and duration. You can then create Zoom live class for these batches right from the app. Learners get to see the list of live classes they have to take as a part of this batch.
- **Quizzes and Assignments**: Create quizzes where questions can have single-choice, multiple-choice options, or can be open ended. Instructors can also add assignments which learners can submit as PDF's or Documents.
- **Getting Certified**: Once a learner has completed the course or batch, you can grant them a certificate. The app provides an inbuilt certificate template. You can use this or else create a template of your own and use that instead.
<img width="1402" alt="Lesson" src="https://frappelms.com/files/banner.png">
<details>
<summary>View Screenshots</summary>
![Batch](.github/batch.png)
<div align="center">
<sub>
Create batches to group your learners
</sub>
</div>
<br>
![Quiz](.github/quiz.png)
<div align="center">
<sub>
Evaluate their knowledge by quizzes
</sub>
</div>
<br>
![Cerficicate](.github/certificate.png)
<div align="center">
<sub>
Autenticate their work with certification
</sub>
</div>
<summary>Show more screenshots</summary>
<img width="1520" alt="ss1" src="https://user-images.githubusercontent.com/31363128/210056046-584bc8aa-d28c-4514-b031-73817012837d.png">
<img width="830" alt="ss2" src="https://user-images.githubusercontent.com/31363128/210056097-36849182-6db0-43a2-8c62-5333cd2aedf4.png">
<img width="941" alt="ss3" src="https://user-images.githubusercontent.com/31363128/210056134-01a7c429-1ef4-434e-9d43-128dda35d7e5.png">
</details>
Frappe LMS is an easy-to-use, open-source learning management system. You can use it to create and share online courses. The app has a clear UI that helps students focus only on what's important and assists in distraction-free learning.
### Under the Hood
You can create courses and lessons through simple forms. Lessons can be in the form of text, videos, quizzes or a combination of all these. You can keep your students engaged with quizzes to help revise and test the concepts learned. Course Instructors and Students can reach out to each other through the discussions section available for each lesson and get queries resolved.
- [**Frappe Framework**](https://github.com/frappe/frappe): A full-stack web application framework.
## Features
- Create online courses. 📚
- Add detailed descriptions and preview videos to the course. 🎬
- Add videos, quizzes, and assignments to your lessons and make them interesting and interactive 📝
- Discussions section below each lesson where instructors and students can interact with each other. 💬
- Create batches to group your students based on courses and track their progress 🏛
- Statistics dashboard that provides all important numbers at a glimpse. 📈
- Job Board where users can post and look for jobs. 💼
- People directory with each person's profile page 👨‍👩‍👧‍👦
- Set cover image, profile photo, short bio, and other professional information. 🦹🏼‍♀️
- Simple layout that optimizes readability 🤓
- Delightful user experience in overall usage ✨
- [**Frappe UI**](https://github.com/frappe/frappe-ui): A Vue-based UI library, to provide a modern user interface.
## Tech Stack
## Production Setup
Frappe LMS is built on [Frappe Framework](https://frappeframework.com) which is a batteries-included python web framework.
These are some of the tools it's built on:
- [Python](https://www.python.org)
- [Redis](https://redis.io/)
- [MariaDB](https://mariadb.org/)
- [Socket.io](https://socket.io/)
### Managed Hosting
You can try [Frappe Cloud](https://frappecloud.com), a simple, user-friendly and sophisticated [open-source](https://github.com/frappe/press) platform to host Frappe applications with peace of mind.
It takes care of installation, setup, upgrades, monitoring, maintenance and support of your Frappe deployments. It is a fully featured developer platform with an ability to manage and control multiple Frappe deployments.
<div>
<a href="https://frappecloud.com/lms/signup" target="_blank">
<picture>
<source media="(prefers-color-scheme: dark)" srcset="https://frappe.io/files/try-on-fc-white.png">
<img src="https://frappe.io/files/try-on-fc-black.png" alt="Try on Frappe Cloud" height="28" />
</picture>
</a>
</div>
### Self Hosting
Follow these steps to set up Frappe Learning in production:
**Step 1**: Download the easy install script
```bash
wget https://frappe.io/easy-install.py
```
**Step 2**: Run the deployment command
```bash
python3 ./easy-install.py deploy \
--project=learning_prod_setup \
--email=your_email.example.com \
--image=ghcr.io/frappe/lms \
--version=stable \
--app=lms \
--sitename subdomain.domain.tld
```
Replace the following parameters with your values:
- `your_email.example.com`: Your email address
- `subdomain.domain.tld`: Your domain name where Learning will be hosted
The script will set up a production-ready instance of Frappe Learning with all the necessary configurations in about 5 minutes.
## Development Setup
## Local Setup
### Docker
You need Docker, docker-compose, and git setup on your machine. Refer to [Docker documentation](https://docs.docker.com/). After that, run the following commands:
```
git clone https://github.com/frappe/lms
cd apps/lms/docker
docker-compose up
```
You need Docker, docker-compose and git setup on your machine. Refer [Docker documentation](https://docs.docker.com/). After that, follow below steps:
Wait for some time until the setup script creates a site. After that, you can access `http://localhost:8000` in your browser and the app's login screen should appear.
You'll have to go through the setup wizard to set up the website the first time you access it. Log in using the following credentials to complete the setup wizard.
**Step 1**: Setup folder and download the required files
```
Username: Administrator
password: admin
```
mkdir frappe-learning
cd frappe-learning
### Frappe Bench
# Download the docker-compose file
wget -O docker-compose.yml https://raw.githubusercontent.com/frappe/lms/develop/docker/docker-compose.yml
Currently, this app depends on the `develop` branch of [frappe](https://github.com/frappe/frappe).
# Download the setup script
wget -O init.sh https://raw.githubusercontent.com/frappe/lms/develop/docker/init.sh
1. Setup frappe-bench by following [this guide](https://frappeframework.com/docs/v14/user/en/installation)
1. In the frappe-bench directory, run `bench start` and keep it running. Open a new terminal session and cd into the `frappe-bench` directory.
1. Run the following commands:
```sh
bench new-site lms.test
bench get-app lms
bench --site lms.test install-app lms
bench --site lms.test add-to-hosts
**Step 2**: Run the container and daemonize it
1. Now, you can access the site at `http://lms.test:8000`
docker compose up -d
**Step 3**: The site [http://lms.localhost:8000/lms](http://lms.localhost:8000/lms) should now be available. The default credentials are:
- Username: Administrator
- Password: admin
## Deployment
Frappe LMS is an app built on top of the Frappe Framework. So, you can follow any deployment guide for hosting a Frappe Framework-based site.
### Local
### Managed Hosting
Frappe LMS can be deployed in a few clicks on [Frappe Cloud](https://frappecloud.com/marketplace/apps/lms).
To setup the repository locally follow the steps mentioned below:
### Self-hosting
If you want to self-host, you can follow official [Frappe Bench Installation](https://github.com/frappe/bench#installation) instructions.
1. Install bench and setup a `frappe-bench` directory by following the [Installation Steps](https://frappeframework.com/docs/user/en/installation)
1. Start the server by running `bench start`
1. In a separate terminal window, create a new site by running `bench new-site learning.test`
1. Map your site to localhost with the command `bench --site learning.test add-to-hosts`
1. Get the Learning app. Run `bench get-app https://github.com/frappe/lms`
1. Run `bench --site learning.test install-app lms`.
1. Now open the URL `http://learning.test:8000/lms` in your browser, you should see the app running
## Bugs and Feature Requests
If you find any bugs or have a feature idea for the app, feel free to report them here on [GitHub Issues](https://github.com/frappe/lms/issues). Make sure you share enough information (app screenshots, browser console screenshots, stack traces, etc) for project maintainers.
## Learn and connect
- [Telegram Public Group](https://t.me/frappelms)
- [Discuss Forum](https://discuss.frappe.io/c/lms/70)
- [Documentation](https://docs.frappe.io/learning)
- [YouTube](https://www.youtube.com/channel/UCn3bV5kx77HsVwtnlCeEi_A)
<br>
<br>
<div align="center" style="padding-top: 0.75rem;">
<a href="https://frappe.io" target="_blank">
<picture>
<source media="(prefers-color-scheme: dark)" srcset="https://frappe.io/files/Frappe-white.png">
<img src="https://frappe.io/files/Frappe-black.png" alt="Frappe Technologies" height="28"/>
</picture>
</a>
</div>
## License
Distributed under [GNU AFFERO GENERAL PUBLIC LICENSE](license.txt)

View File

@@ -13,6 +13,6 @@ module.exports = defineConfig({
openMode: 0,
},
e2e: {
baseUrl: "http://lms1:8000",
baseUrl: "http://test_site_ui:8000",
},
});

View File

@@ -5,7 +5,7 @@ describe("Course Creation", () => {
cy.visit("/lms/courses");
// Create a course
cy.get("header").children().last().children().last().click();
cy.get("a").contains("New").click();
cy.wait(1000);
cy.url().should("include", "/courses/new/edit");
@@ -73,7 +73,7 @@ describe("Course Creation", () => {
.should("be.visible")
.within(() => {
cy.get("label").contains("Title").type("Test Chapter");
cy.button("Create").click();
cy.button("Add Chapter").click();
});
// Add Lesson

View File

@@ -2,7 +2,7 @@ version: "3.7"
name: lms
services:
mariadb:
image: mariadb:10.8
image: mariadb:10.6
command:
- --character-set-server=utf8mb4
- --collation-server=utf8mb4_unicode_ci

View File

@@ -18,25 +18,21 @@
"@editorjs/nested-list": "^1.4.2",
"@editorjs/paragraph": "^2.11.3",
"@editorjs/simple-image": "^1.6.0",
"@editorjs/table": "^2.4.2",
"ace-builds": "^1.36.2",
"apexcharts": "^4.3.0",
"chart.js": "^4.4.1",
"codemirror-editor-vue3": "^2.8.0",
"dayjs": "^1.11.6",
"feather-icons": "^4.28.0",
"frappe-ui": "^0.1.89",
"frappe-ui": "^0.1.69",
"lucide-vue-next": "^0.383.0",
"markdown-it": "^14.0.0",
"pinia": "^2.0.33",
"socket.io-client": "^4.7.2",
"tailwindcss": "^3.3.3",
"typescript": "^5.7.2",
"vue": "^3.4.23",
"vue-chartjs": "^5.3.0",
"vue-draggable-next": "^2.2.1",
"vue-router": "^4.0.12",
"vue3-apexcharts": "^1.8.0",
"vuedraggable": "4.1.0"
},
"devDependencies": {

View File

@@ -25,7 +25,7 @@
</div>
</template>
<script setup>
import { createResource, Avatar } from 'frappe-ui'
import { createListResource, Avatar } from 'frappe-ui'
import { timeAgo } from '@/utils'
const props = defineProps({
@@ -35,15 +35,24 @@ const props = defineProps({
},
})
const communications = createResource({
url: 'lms.lms.api.get_announcements',
makeParams(value) {
return {
batch: props.batch,
}
const communications = createListResource({
doctype: 'Communication',
fields: [
'subject',
'content',
'recipients',
'cc',
'communication_date',
'sender',
'sender_full_name',
],
filters: {
reference_doctype: 'LMS Batch',
reference_name: props.batch,
},
orderBy: 'communication_date desc',
auto: true,
cache: ['announcement', props.batch],
cache: ['batch', props.batch],
})
</script>
<style>

View File

@@ -1,18 +1,18 @@
<template>
<div
class="flex h-full flex-col justify-between transition-all duration-300 ease-in-out bg-gray-50"
:class="sidebarStore.isSidebarCollapsed ? 'w-14' : 'w-56'"
:class="isSidebarCollapsed ? 'w-14' : 'w-56'"
>
<div
class="flex flex-col overflow-hidden"
:class="sidebarStore.isSidebarCollapsed ? 'items-center' : ''"
:class="isSidebarCollapsed ? 'items-center' : ''"
>
<UserDropdown :isCollapsed="sidebarStore.isSidebarCollapsed" />
<UserDropdown :isCollapsed="isSidebarCollapsed" />
<div class="flex flex-col" v-if="sidebarSettings.data">
<SidebarLink
v-for="link in sidebarLinks"
:link="link"
:isCollapsed="sidebarStore.isSidebarCollapsed"
:isCollapsed="isSidebarCollapsed"
class="mx-2 my-0.5"
/>
</div>
@@ -22,11 +22,11 @@
>
<div
class="flex items-center justify-between pr-2 cursor-pointer"
:class="sidebarStore.isSidebarCollapsed ? 'pl-3' : 'pl-4'"
:class="isSidebarCollapsed ? 'pl-3' : 'pl-4'"
@click="showWebPages = !showWebPages"
>
<div
v-if="!sidebarStore.isSidebarCollapsed"
v-if="!isSidebarCollapsed"
class="flex items-center text-sm text-gray-600 my-1"
>
<span class="grid h-5 w-6 flex-shrink-0 place-items-center">
@@ -53,7 +53,7 @@
<SidebarLink
v-for="link in sidebarSettings.data.web_pages"
:link="link"
:isCollapsed="sidebarStore.isSidebarCollapsed"
:isCollapsed="isSidebarCollapsed"
class="mx-2 my-0.5"
:showControls="isModerator ? true : false"
@openModal="openPageModal"
@@ -64,19 +64,17 @@
</div>
<SidebarLink
:link="{
label: sidebarStore.isSidebarCollapsed ? 'Expand' : 'Collapse',
label: isSidebarCollapsed ? 'Expand' : 'Collapse',
}"
:isCollapsed="sidebarStore.isSidebarCollapsed"
@click="toggleSidebar()"
:isCollapsed="isSidebarCollapsed"
@click="isSidebarCollapsed = !isSidebarCollapsed"
class="m-2"
>
<template #icon>
<span class="grid h-5 w-6 flex-shrink-0 place-items-center">
<CollapseSidebar
class="h-4.5 w-4.5 text-gray-700 duration-300 ease-in-out"
:class="{
'[transform:rotateY(180deg)]': sidebarStore.isSidebarCollapsed,
}"
:class="{ '[transform:rotateY(180deg)]': isSidebarCollapsed }"
/>
</span>
</template>
@@ -98,15 +96,12 @@ import { ref, onMounted, inject, watch } from 'vue'
import { getSidebarLinks } from '../utils'
import { usersStore } from '@/stores/user'
import { sessionStore } from '@/stores/session'
import { useSidebar } from '@/stores/sidebar'
import { useSettings } from '@/stores/settings'
import { ChevronRight, Plus } from 'lucide-vue-next'
import { createResource, Button } from 'frappe-ui'
import PageModal from '@/components/Modals/PageModal.vue'
const { user, sidebarSettings } = sessionStore()
const { userResource } = usersStore()
let sidebarStore = useSidebar()
const socket = inject('$socket')
const unreadCount = ref(0)
const sidebarLinks = ref(getSidebarLinks())
@@ -115,7 +110,6 @@ const isModerator = ref(false)
const isInstructor = ref(false)
const pageToEdit = ref(null)
const showWebPages = ref(false)
const settingsStore = useSettings()
onMounted(() => {
socket.on('publish_lms_notifications', (data) => {
@@ -185,48 +179,6 @@ const addQuizzes = () => {
}
}
const addAssignments = () => {
if (isInstructor.value || isModerator.value) {
sidebarLinks.value.push({
label: 'Assignments',
icon: 'Pencil',
to: 'Assignments',
activeFor: ['Assignments', 'AssignmentForm'],
})
}
}
const addPrograms = () => {
let activeFor = ['Programs', 'ProgramForm']
let index = 1
let canAddProgram = false
if (
!isInstructor.value &&
!isModerator.value &&
settingsStore.learningPaths.data
) {
sidebarLinks.value = sidebarLinks.value.filter(
(link) => link.label !== 'Courses'
)
activeFor.push('CourseDetail')
activeFor.push('Lesson')
index = 0
canAddProgram = true
} else if (isInstructor.value || isModerator.value) {
canAddProgram = true
}
if (canAddProgram) {
sidebarLinks.value.splice(index, 0, {
label: 'Programs',
icon: 'Route',
to: 'Programs',
activeFor: activeFor,
})
}
}
const openPageModal = (link) => {
showPageModal.value = true
pageToEdit.value = link
@@ -258,13 +210,9 @@ watch(userResource, () => {
if (userResource.data) {
isModerator.value = userResource.data.is_moderator
isInstructor.value = userResource.data.is_instructor
addPrograms()
addQuizzes()
addAssignments()
}
})
const toggleSidebar = () => {
sidebarStore.isSidebarCollapsed = !sidebarStore.isSidebarCollapsed
}
let isSidebarCollapsed = ref(getSidebarFromStorage())
</script>

View File

@@ -1,75 +0,0 @@
<template>
<Dialog
v-model="show"
:options="{
size: 'xl',
}"
>
<template #body>
<div class="p-5 space-y-4">
<div v-if="type == 'quiz'" class="text-lg font-semibold">
{{ __('Add a quiz to your lesson') }}
</div>
<div v-else class="text-lg font-semibold">
{{ __('Add an assignment to your lesson') }}
</div>
<div>
<Link
v-if="type == 'quiz'"
v-model="quiz"
doctype="LMS Quiz"
:label="__('Select a quiz')"
:onCreate="(value, close) => redirectToForm()"
/>
<Link
v-else
v-model="assignment"
doctype="LMS Assignment"
:label="__('Select an assignment')"
:onCreate="(value, close) => redirectToForm()"
/>
</div>
<div class="flex justify-end space-x-2">
<Button variant="solid" @click="addAssessment()">
{{ __('Save') }}
</Button>
</div>
</div>
</template>
</Dialog>
</template>
<script setup>
import { Dialog, Button } from 'frappe-ui'
import { onMounted, ref, nextTick } from 'vue'
import Link from '@/components/Controls/Link.vue'
const show = ref(false)
const quiz = ref(null)
const assignment = ref(null)
const props = defineProps({
type: {
type: String,
required: true,
},
onAddition: {
type: Function,
required: true,
},
})
onMounted(async () => {
await nextTick()
show.value = true
})
const addAssessment = () => {
props.onAddition(props.type == 'quiz' ? quiz.value : assignment.value)
show.value = false
}
const redirectToForm = () => {
if (props.type == 'quiz') window.open('/lms/quizzes/new', '_blank')
else window.open('/lms/assignments/new', '_blank')
}
</script>

View File

@@ -1,7 +1,7 @@
<template>
<div>
<div class="flex items-center justify-between mb-4">
<div class="text-lg font-semibold">
<div class="flex items-center justify-between">
<div class="text-lg font-semibold mb-4">
{{ __('Assessments') }}
</div>
<Button v-if="canSeeAddButton()" @click="showModal = true">
@@ -19,7 +19,6 @@
:options="{
showTooltip: false,
getRowRoute: (row) => getRowRoute(row),
selectable: user.data?.is_student ? false : true,
}"
>
<ListHeader
@@ -39,18 +38,7 @@
<ListRow :row="row" v-for="row in assessments.data">
<template #default="{ column, item }">
<ListRowItem :item="row[column.key]" :align="column.align">
<div v-if="column.key == 'assessment_type'">
{{ row[column.key] == 'LMS Quiz' ? 'Quiz' : 'Assignment' }}
</div>
<div v-else-if="column.key == 'title'">
{{ row[column.key] }}
</div>
<div v-else-if="isNaN(row[column.key])">
<Badge :theme="getStatusTheme(row[column.key])">
{{ row[column.key] }}
</Badge>
</div>
<div v-else>
<div>
{{ row[column.key] }}
</div>
</ListRowItem>
@@ -92,7 +80,6 @@ import {
ListSelectBanner,
createResource,
Button,
Badge,
} from 'frappe-ui'
import { inject, ref } from 'vue'
import AssessmentModal from '@/components/Modals/AssessmentModal.vue'
@@ -158,7 +145,7 @@ const getRowRoute = (row) => {
return {
name: 'AssignmentSubmission',
params: {
assignmentID: row.assessment_name,
assignmentName: row.assessment_name,
submissionName: row.submission.name,
},
}
@@ -166,7 +153,7 @@ const getRowRoute = (row) => {
return {
name: 'AssignmentSubmission',
params: {
assignmentID: row.assessment_name,
assignmentName: row.assessment_name,
submissionName: 'new',
},
}
@@ -190,33 +177,20 @@ const getAssessmentColumns = () => {
{
label: 'Assessment',
key: 'title',
width: '25rem',
},
{
label: 'Type',
key: 'assessment_type',
width: '15rem',
},
]
if (!user.data?.is_moderator) {
columns.push({
label: 'Status/Percentage',
label: 'Status/Score',
key: 'status',
align: 'left',
width: '10rem',
align: 'center',
})
}
return columns
}
const getStatusTheme = (status) => {
if (status === 'Pass') {
return 'green'
} else if (status === 'Not Graded') {
return 'orange'
} else {
return 'red'
}
}
</script>

View File

@@ -1,448 +0,0 @@
<template>
<div
v-if="assignment.data"
class="grid grid-cols-[68%,32%] h-full"
:class="{ 'border rounded-lg': !showTitle }"
>
<div class="border-r p-5 overflow-y-auto h-[calc(100vh-3.2rem)]">
<div v-if="showTitle" class="text-lg font-semibold mb-5">
<div v-if="submissionName === 'new'">
{{ __('Submission by') }} {{ user.data?.full_name }}
</div>
<div v-else>
{{ __('Submission by') }} {{ submissionResource.doc?.member_name }}
</div>
</div>
<div class="text-sm text-gray-600 font-medium mb-2">
{{ __('Question') }}:
</div>
<div
v-html="assignment.data.question"
class="ProseMirror prose prose-table:table-fixed prose-td:p-2 prose-th:p-2 prose-td:border prose-th:border prose-td:border-gray-300 prose-th:border-gray-300 prose-td:relative prose-th:relative prose-th:bg-gray-100 prose-sm max-w-none !whitespace-normal"
></div>
</div>
<div class="flex flex-col">
<div class="p-5">
<div class="flex items-center justify-between mb-4">
<div class="font-semibold">
{{ __('Submission') }}
</div>
<div class="flex items-center space-x-2">
<Badge v-if="isDirty" theme="orange">
{{ __('Not Saved') }}
</Badge>
<Badge
v-else-if="submissionResource.doc?.status"
:theme="statusTheme"
size="lg"
>
{{ submissionResource.doc?.status }}
</Badge>
<Button variant="solid" @click="submitAssignment()">
{{ __('Save') }}
</Button>
</div>
</div>
<div
v-if="
submissionName != 'new' &&
!['Pass', 'Fail'].includes(submissionResource.doc?.status) &&
submissionResource.doc?.owner == user.data?.name
"
class="bg-blue-100 p-3 rounded-md leading-5 text-sm mb-4"
>
{{ __("You've successfully submitted the assignment.") }}
{{
__(
"Once the moderator grades your submission, you'll find the details here."
)
}}
{{ __('Feel free to make edits to your submission if needed.') }}
</div>
<div v-if="showUploader()">
<div class="text-xs text-gray-600 mt-1 mb-2">
{{ __('Add your assignment as {0}').format(assignment.data.type) }}
</div>
<FileUploader
v-if="!submissionFile"
:fileTypes="getType()"
:validateFile="validateFile"
@success="(file) => saveSubmission(file)"
>
<template #default="{ uploading, progress, openFileSelector }">
<Button @click="openFileSelector" :loading="uploading">
{{
uploading
? __('Uploading {0}%').format(progress)
: __('Upload File')
}}
</Button>
</template>
</FileUploader>
<div v-else>
<div class="flex items-center">
<div class="border rounded-md p-2 mr-2">
<FileText class="h-5 w-5 stroke-1.5 text-gray-700" />
</div>
<a
:href="submissionFile.file_url"
target="_blank"
class="flex flex-col cursor-pointer !no-underline"
>
<span>
{{ submissionFile.file_name }}
</span>
<span class="text-sm text-gray-500 mt-1">
{{ getFileSize(submissionFile.file_size) }}
</span>
</a>
<X
v-if="canModifyAssignment"
@click="removeSubmission()"
class="bg-gray-200 rounded-md cursor-pointer stroke-1.5 w-5 h-5 p-1 ml-4"
/>
</div>
</div>
</div>
<div v-else-if="assignment.data.type == 'URL'">
<div class="text-xs text-gray-600 mb-1">
{{ __('Enter a URL') }}
</div>
<FormControl
v-model="answer"
type="text"
:readonly="!canModifyAssignment"
/>
</div>
<div v-else>
<div class="text-sm mb-4">
{{ __('Write your answer here') }}
</div>
<TextEditor
:content="answer"
@change="(val) => (answer = 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]"
/>
</div>
<div
v-if="
user.data?.name == submissionResource.doc?.owner &&
submissionResource.doc?.comments
"
class="mt-8 p-3 bg-blue-100 rounded-md"
>
<div class="text-sm text-gray-600 font-medium mb-2">
{{ __('Comments by Evaluator') }}:
</div>
<div class="leading-5">
{{ submissionResource.doc.comments }}
</div>
</div>
<!-- Grading -->
<div v-if="canGradeSubmission" class="mt-8 space-y-4">
<div class="font-semibold mb-2">
{{ __('Grading') }}
</div>
<FormControl
v-if="submissionResource.doc"
v-model="submissionResource.doc.status"
:label="__('Grade')"
type="select"
:options="submissionStatusOptions"
/>
<FormControl
v-if="submissionResource.doc"
v-model="submissionResource.doc.comments"
:label="__('Comments')"
type="textarea"
/>
</div>
</div>
</div>
</div>
</template>
<script setup>
import {
Badge,
Button,
call,
createResource,
createDocumentResource,
FileUploader,
FormControl,
TextEditor,
} from 'frappe-ui'
import { computed, inject, onMounted, onBeforeUnmount, ref, watch } from 'vue'
import { FileText, X } from 'lucide-vue-next'
import { showToast, getFileSize } from '@/utils'
import { useRouter } from 'vue-router'
const submissionFile = ref(null)
const answer = ref(null)
const router = useRouter()
const user = inject('$user')
const showTitle = router.currentRoute.value.name == 'AssignmentSubmission'
const isDirty = ref(false)
const props = defineProps({
assignmentID: {
type: String,
required: true,
},
submissionName: {
type: String,
default: 'new',
},
})
onMounted(() => {
window.addEventListener('keydown', keyboardShortcut)
})
const keyboardShortcut = (e) => {
if (e.key === 's' && (e.ctrlKey || e.metaKey)) {
submitAssignment()
e.preventDefault()
}
}
onBeforeUnmount(() => {
window.removeEventListener('keydown', keyboardShortcut)
})
const assignment = createResource({
url: 'frappe.client.get',
params: {
doctype: 'LMS Assignment',
name: props.assignmentID,
},
auto: true,
onSuccess(data) {
if (props.submissionName != 'new') {
submissionResource.reload()
}
},
})
const newSubmission = createResource({
url: 'frappe.client.insert',
makeParams(values) {
let doc = {
doctype: 'LMS Assignment Submission',
assignment: props.assignmentID,
member: user.data?.name,
}
if (showUploader()) {
doc.assignment_attachment = submissionFile.value.file_url
} else {
doc.answer = answer.value
}
return {
doc: doc,
}
},
})
const imageResource = createResource({
url: 'lms.lms.api.get_file_info',
makeParams(values) {
return {
file_url: values.image,
}
},
auto: false,
onSuccess(data) {
submissionFile.value = data
},
})
const submissionResource = createDocumentResource({
doctype: 'LMS Assignment Submission',
name: props.submissionName,
onError(err) {
showToast(__('Error'), __(err.messages?.[0] || err), 'x')
},
auto: false,
cache: [user.data?.name, props.assignmentID],
})
watch(submissionResource, () => {
if (submissionResource.doc) {
if (submissionResource.doc.assignment_attachment) {
imageResource.reload({
image: submissionResource.doc.assignment_attachment,
})
}
if (submissionResource.doc.answer) {
answer.value = submissionResource.doc.answer
}
if (submissionResource.isDirty) {
isDirty.value = true
} else if (showUploader() && !submissionFile.value) {
isDirty.value = true
} else if (!showUploader() && !answer.value) {
isDirty.value = true
} else {
isDirty.value = false
}
}
})
watch(submissionFile, () => {
if (props.submissionName == 'new' && submissionFile.value) {
isDirty.value = true
}
})
const submitAssignment = () => {
if (props.submissionName != 'new') {
let evaluator =
submissionResource.doc && submissionResource.doc.owner != user.data?.name
? user.data?.name
: null
submissionResource.setValue.submit(
{
...submissionResource.doc,
evaluator: evaluator,
},
{
onSuccess(data) {
showToast(__('Success'), __('Changes saved successfully'), 'check')
},
}
)
} else {
addNewSubmission()
}
}
const addNewSubmission = () => {
newSubmission.submit(
{},
{
onSuccess(data) {
showToast('Success', 'Assignment submitted successfully.', 'check')
if (router.currentRoute.value.name == 'AssignmentSubmission') {
router.push({
name: 'AssignmentSubmission',
params: {
assignmentID: props.assignmentID,
submissionName: data.name,
},
})
} else {
markLessonProgress()
router.go()
}
submissionResource.name = data.name
submissionResource.reload()
},
onError(err) {
showToast('Error', err.messages?.[0] || err, 'x')
},
}
)
}
const saveSubmission = (file) => {
submissionFile.value = file
}
const markLessonProgress = () => {
if (router.currentRoute.value.name == 'Lesson') {
let courseName = router.currentRoute.value.params.courseName
let chapterNumber = router.currentRoute.value.params.chapterNumber
let lessonNumber = router.currentRoute.value.params.lessonNumber
call('lms.lms.api.mark_lesson_progress', {
course: courseName,
chapter_number: chapterNumber,
lesson_number: lessonNumber,
})
}
}
const getType = () => {
const type = assignment.data?.type
if (type == 'Image') {
return ['image/*']
} else if (type == 'Document') {
return [
'.doc',
'.docx',
'.xml',
'application/msword',
'application/vnd.openxmlformats-officedocument.wordprocessingml.document',
]
} else if (type == 'PDF') {
return ['.pdf']
}
}
const validateFile = (file) => {
let type = assignment.data?.type
let extension = file.name.split('.').pop().toLowerCase()
if (type == 'Image' && !['jpg', 'jpeg', 'png'].includes(extension)) {
return 'Only image file is allowed.'
} else if (
type == 'Document' &&
!['doc', 'docx', 'xml'].includes(extension)
) {
return 'Only document file is allowed.'
} else if (type == 'PDF' && !['pdf'].includes(extension)) {
return 'Only PDF file is allowed.'
}
}
const removeSubmission = () => {
submissionFile.value = null
}
const canGradeSubmission = computed(() => {
return (
(user.data?.is_moderator ||
user.data?.is_evaluator ||
user.data?.is_instructor) &&
props.submissionName != 'new' &&
router.currentRoute.value.name == 'AssignmentSubmission'
)
})
const canModifyAssignment = computed(() => {
return (
!submissionResource.doc ||
(submissionResource.doc?.owner == user.data?.name &&
submissionResource.doc?.status == 'Not Graded')
)
})
const submissionStatusOptions = computed(() => {
return [
{ label: 'Not Graded', value: 'Not Graded' },
{ label: 'Pass', value: 'Pass' },
{ label: 'Fail', value: 'Fail' },
]
})
const statusTheme = computed(() => {
if (!submissionResource.doc) {
return 'orange'
} else if (submissionResource.doc.status == 'Pass') {
return 'green'
} else if (submissionResource.doc.status == 'Not Graded') {
return 'blue'
} else {
return 'red'
}
})
const showUploader = () => {
return ['PDF', 'Image', 'Document'].includes(assignment.data?.type)
}
</script>

View File

@@ -1,46 +0,0 @@
<template>
<Assignment
v-if="user.data && submission.data"
:assignmentID="assignmentID"
:submissionName="submission.data?.name || 'new'"
/>
<div v-else class="border rounded-md text-center py-20">
<div>
{{ __('Please login to access the assignment.') }}
</div>
<Button @click="redirectToLogin()" class="mt-2">
<span>
{{ __('Login') }}
</span>
</Button>
</div>
</template>
<script setup>
import { inject, watch } from 'vue'
import { Button, createResource } from 'frappe-ui'
import Assignment from '@/components/Assignment.vue'
const user = inject('$user')
const props = defineProps({
assignmentID: {
type: String,
required: true,
},
})
const submission = createResource({
url: 'frappe.client.get_value',
makeParams(values) {
return {
doctype: 'LMS Assignment Submission',
fieldname: 'name',
filters: {
assignment: props.assignmentID,
member: user.data?.name,
},
}
},
auto: true,
})
</script>

View File

@@ -1,7 +1,7 @@
<template>
<div>
<div class="flex items-center justify-between mb-4">
<div class="text-lg font-semibold">
<div class="text-xl font-semibold">
{{ __('Courses') }}
</div>
<Button v-if="canSeeAddButton()" @click="openCourseModal()">
@@ -118,13 +118,13 @@ const getCoursesColumns = () => {
},
{
label: 'Lessons',
key: 'lessons',
key: 'lesson_count',
align: 'right',
},
{
label: 'Enrollments',
align: 'right',
key: 'enrollments',
key: 'enrollment_count',
},
]
}

View File

@@ -1,199 +1,80 @@
<template>
<div class="">
<div class="w-full flex items-center justify-between pb-4">
<div class="font-medium text-gray-600">
{{ __('Statistics') }}
</div>
</div>
<div class="grid grid-cols-3 gap-5 mb-8">
<div class="flex items-center shadow py-2 px-3 rounded-md">
<div class="p-2 rounded-md bg-gray-100 mr-3">
<User class="w-18 h-18 stroke-1.5 text-gray-700" />
</div>
<div class="flex flex-col">
<span class="text-xl font-semibold mb-1">
{{ students.data?.length }}
</span>
<span class="text-gray-700">
{{ __('Students') }}
</span>
</div>
</div>
<div class="flex items-center shadow py-2 px-3 rounded-md">
<div class="p-2 rounded-md bg-gray-100 mr-3">
<BookOpen class="w-18 h-18 stroke-1.5 text-gray-700" />
</div>
<div class="flex flex-col">
<span class="text-xl font-semibold mb-1">
{{ batch.courses?.length }}
</span>
<span class="text-gray-700">
{{ __('Courses') }}
</span>
</div>
</div>
<div class="flex items-center shadow py-2 px-3 rounded-md">
<div class="p-2 rounded-md bg-gray-100 mr-3">
<ShieldCheck class="w-18 h-18 stroke-1.5 text-gray-700" />
</div>
<div class="flex flex-col">
<span class="text-xl font-semibold mb-1">
{{ assessmentCount }}
</span>
<span class="text-gray-700">
{{ __('Assessments') }}
</span>
</div>
</div>
</div>
<div class="mb-8">
<div class="text-gray-600 font-medium">
{{ __('Progress') }}
</div>
<ApexChart
v-if="showProgressChart"
:options="chartOptions"
:series="chartData"
type="bar"
height="350"
/>
<div
class="flex items-center justify-center text-sm text-gray-700 space-x-4"
>
<div class="flex items-center space-x-2">
<div class="w-3 h-3" style="background-color: #0f736b"></div>
<div>
{{ __('Courses') }}
</div>
</div>
<div class="flex items-center space-x-2">
<div class="w-3 h-3" style="background-color: #0070cc"></div>
<div>
{{ __('Assessments') }}
</div>
</div>
</div>
</div>
<Button class="float-right mb-3" @click="openStudentModal()">
<template #prefix>
<Plus class="h-4 w-4" />
</template>
{{ __('Add') }}
</Button>
<div class="text-lg font-semibold mb-4">
{{ __('Students') }}
</div>
<div>
<div class="flex items-center justify-between mb-4">
<div class="text-gray-600 font-medium">
{{ __('Students') }}
</div>
<Button @click="openStudentModal()">
<template #prefix>
<Plus class="h-4 w-4" />
</template>
{{ __('Add') }}
</Button>
</div>
<div v-if="students.data?.length">
<ListView
:columns="getStudentColumns()"
:rows="students.data"
row-key="name"
:options="{
showTooltip: false,
}"
<div v-if="students.data?.length">
<ListView
:columns="getStudentColumns()"
:rows="students.data"
row-key="name"
:options="{ showTooltip: false }"
>
<ListHeader
class="mb-2 grid items-center space-x-4 rounded bg-gray-100 p-2"
>
<ListHeader
class="mb-2 grid items-center space-x-4 rounded bg-gray-100 p-2"
>
<ListHeaderItem
:item="item"
v-for="item in getStudentColumns()"
:title="item.label"
>
<template #prefix="{ item }">
<FeatherIcon
v-if="item.icon"
:name="item.icon"
class="h-4 w-4 stroke-1.5"
/>
</template>
</ListHeaderItem>
</ListHeader>
<ListRows>
<ListRow
:row="row"
v-for="row in students.data"
class="group cursor-pointer"
@click="openStudentProgressModal(row)"
>
<template #default="{ column, item }">
<ListRowItem :item="row[column.key]" :align="column.align">
<template #prefix>
<div v-if="column.key == 'full_name'">
<Avatar
class="flex items-center"
:image="row['user_image']"
:label="item"
size="sm"
/>
</div>
</template>
<div
v-if="column.key == 'progress'"
class="flex items-center space-x-4 w-full"
>
<ProgressBar :progress="row[column.key]" size="sm" />
</div>
<div
v-else-if="column.key == 'copy'"
class="invisible group-hover:visible"
>
<Button variant="ghost" @click="copyEmail(row)">
<template #icon>
<Clipboard class="h-4 w-4 stroke-1.5" />
</template>
</Button>
</div>
<div v-else>
{{ row[column.key] }}
</div>
</ListRowItem>
</template>
</ListRow>
</ListRows>
<ListSelectBanner>
<template #actions="{ unselectAll, selections }">
<div class="flex gap-2">
<Button
variant="ghost"
@click="removeStudents(selections, unselectAll)"
>
<Trash2 class="h-4 w-4 stroke-1.5" />
</Button>
</div>
<ListHeaderItem :item="item" v-for="item in getStudentColumns()">
<template #prefix="{ item }">
<component
v-if="item.icon"
:is="item.icon"
class="h-4 w-4 stroke-1.5 ml-4"
/>
</template>
</ListSelectBanner>
</ListView>
</div>
<div v-else class="text-sm italic text-gray-600">
{{ __('There are no students in this batch.') }}
</div>
</ListHeaderItem>
</ListHeader>
<ListRows>
<ListRow :row="row" v-for="row in students.data">
<template #default="{ column, item }">
<ListRowItem :item="row[column.key]" :align="column.align">
<template #prefix>
<div v-if="column.key == 'full_name'">
<Avatar
class="flex items-center"
:image="row['user_image']"
:label="item"
size="sm"
/>
</div>
</template>
<div>
{{ row[column.key] }}
</div>
</ListRowItem>
</template>
</ListRow>
</ListRows>
<ListSelectBanner>
<template #actions="{ unselectAll, selections }">
<div class="flex gap-2">
<Button
variant="ghost"
@click="removeStudents(selections, unselectAll)"
>
<Trash2 class="h-4 w-4 stroke-1.5" />
</Button>
</div>
</template>
</ListSelectBanner>
</ListView>
</div>
<div v-else class="text-sm italic text-gray-600">
{{ __('There are no students in this batch.') }}
</div>
<StudentModal
:batch="props.batch.name"
:batch="props.batch"
v-model="showStudentModal"
v-model:reloadStudents="students"
/>
<BatchStudentProgress
:student="selectedStudent"
v-model="showStudentProgressModal"
/>
</template>
<script setup>
import {
Avatar,
Button,
createResource,
FeatherIcon,
ListHeader,
ListHeaderItem,
ListSelectBanner,
@@ -201,89 +82,60 @@ import {
ListRows,
ListView,
ListRowItem,
Avatar,
Button,
} from 'frappe-ui'
import {
BookOpen,
Clipboard,
Plus,
ShieldCheck,
Trash2,
User,
} from 'lucide-vue-next'
import { ref, watch } from 'vue'
import { Trash2, Plus } from 'lucide-vue-next'
import { ref } from 'vue'
import StudentModal from '@/components/Modals/StudentModal.vue'
import { showToast } from '@/utils'
import ProgressBar from '@/components/ProgressBar.vue'
import BatchStudentProgress from '@/components/Modals/BatchStudentProgress.vue'
import ApexChart from 'vue3-apexcharts'
const showStudentModal = ref(false)
const showStudentProgressModal = ref(false)
const selectedStudent = ref(null)
const chartData = ref(null)
const chartOptions = ref(null)
const showProgressChart = ref(false)
const assessmentCount = ref(0)
const props = defineProps({
batch: {
type: Object,
type: String,
default: null,
},
})
const students = createResource({
url: 'lms.lms.utils.get_batch_students',
cache: ['students', props.batch.name],
cache: ['students', props.batch],
params: {
batch: props.batch?.name,
batch: props.batch,
},
auto: true,
onSuccess(data) {
chartData.value = getChartData()
showProgressChart.value = true
},
})
const getStudentColumns = () => {
let columns = [
return [
{
label: 'Full Name',
key: 'full_name',
width: '20rem',
icon: 'user',
width: 2,
},
{
label: 'Progress',
key: 'progress',
width: '10rem',
icon: 'activity',
label: 'Courses Done',
key: 'courses_completed',
align: 'center',
},
{
label: 'Assessments Done',
key: 'assessments_completed',
align: 'center',
},
{
label: 'Last Active',
key: 'last_active',
width: '15rem',
align: 'center',
icon: 'clock',
},
{
label: '',
key: 'copy',
},
]
return columns
}
const openStudentModal = () => {
showStudentModal.value = true
}
const openStudentProgressModal = (row) => {
showStudentProgressModal.value = true
selectedStudent.value = row
}
const deleteStudents = createResource({
url: 'lms.lms.api.delete_documents',
makeParams(values) {
@@ -308,110 +160,4 @@ const removeStudents = (selections, unselectAll) => {
}
)
}
const getChartData = () => {
let categories = {}
Object.keys(students.data?.[0].courses).forEach((course) => {
categories[course] = {
value: 0,
type: 'course',
label: course,
}
})
Object.keys(students.data?.[0].assessments).forEach((assessment) => {
categories[assessment] = {
value: 0,
type: 'assessment',
label: assessment,
}
})
students.data.forEach((student) => {
Object.keys(student.courses).forEach((course) => {
if (student.courses[course] === 100) {
categories[course].value += 1
}
})
Object.keys(student.assessments).forEach((assessment) => {
if (student.assessments[assessment] === 100) {
categories[assessment].value += 1
}
})
})
chartOptions.value = getChartOptions(categories)
return [
{
name: __('Completed by Students'),
data: Object.values(categories).map((item) => item.value),
},
]
}
const getChartOptions = (categories) => {
const courseColor = '#0F736B'
const assessmentColor = '#0070CC'
const maxY =
students.data?.length % 5
? students.data?.length + (5 - (students.data?.length % 5))
: students.data?.length
return {
chart: {
type: 'bar',
height: 50,
toolbar: {
show: false,
},
},
plotOptions: {
bar: {
distributed: true,
borderRadius: 0,
horizontal: true,
barHeight: '30%',
},
},
colors: Object.values(categories).map((item) =>
item.type === 'course' ? courseColor : assessmentColor
),
xaxis: {
categories: Object.values(categories).map((item) => item.label),
labels: {
style: {
fontSize: '10px',
},
rotate: 0,
formatter: function (value) {
return value.length > 20 ? `${value.substring(0, 20)}...` : value // Trim long labels
},
},
},
yaxis: {
max: maxY,
min: 0,
stepSize: 10,
tickAmount: maxY / 5,
},
}
}
const copyEmail = (row) => {
navigator.clipboard.writeText(row.email)
showToast(__('Success'), __('Email copied to clipboard'), 'check')
}
watch(students, () => {
if (students.data?.length) {
assessmentCount.value = Object.keys(students.data?.[0].assessments).length
}
})
</script>
<style>
.apexcharts-legend {
display: none !important;
}
</style>

View File

@@ -92,7 +92,7 @@
{{ option.label }}
</div>
<div
v-if="option.description"
v-if="option.label != option.description"
class="text-xs text-gray-700"
v-html="option.description"
></div>

View File

@@ -2,7 +2,6 @@
<div class="space-y-1.5">
<label class="block" :class="labelClasses" v-if="attrs.label">
{{ attrs.label }}
<span class="text-red-500" v-if="attrs.required">*</span>
</label>
<Autocomplete
ref="autocomplete"
@@ -29,8 +28,8 @@
<slot name="item-label" v-bind="{ active, selected, option }" />
</template>
<template #footer="{ value, close }">
<div v-if="attrs.onCreate">
<template v-if="attrs.onCreate" #footer="{ value, close }">
<div>
<Button
variant="ghost"
class="w-full !justify-start"
@@ -42,21 +41,8 @@
</template>
</Button>
</div>
<div>
<Button
variant="ghost"
class="w-full !justify-start"
:label="__('Clear')"
@click="() => clearValue(close)"
>
<template #prefix>
<X class="h-4 w-4 stroke-1.5" />
</template>
</Button>
</div>
</template>
</Autocomplete>
<p v-if="description" class="text-sm text-gray-600">{{ description }}</p>
</div>
</template>
@@ -64,7 +50,7 @@
import Autocomplete from '@/components/Controls/Autocomplete.vue'
import { watchDebounced } from '@vueuse/core'
import { createResource, Button } from 'frappe-ui'
import { Plus, X } from 'lucide-vue-next'
import { Plus } from 'lucide-vue-next'
import { useAttrs, computed, ref } from 'vue'
const props = defineProps({
@@ -80,14 +66,12 @@ const props = defineProps({
type: String,
default: '',
},
description: {
type: String,
default: '',
},
})
const emit = defineEmits(['update:modelValue', 'change'])
const attrs = useAttrs()
const valuePropPassed = computed(() => 'value' in attrs)
const value = computed({
@@ -133,7 +117,7 @@ const options = createResource({
transform: (data) => {
return data.map((option) => {
return {
label: option.label || option.value,
label: option.value,
value: option.value,
description: option.description,
}
@@ -141,7 +125,7 @@ const options = createResource({
},
})
const reload = (val) => {
function reload(val) {
options.update({
params: {
txt: val,
@@ -152,11 +136,6 @@ const reload = (val) => {
options.reload()
}
const clearValue = (close) => {
emit(valuePropPassed.value ? 'change' : 'update:modelValue', '')
close()
}
const labelClasses = computed(() => {
return [
{

View File

@@ -2,7 +2,6 @@
<div>
<label class="block mb-1" :class="labelClasses" v-if="label">
{{ label }}
<span class="text-red-500" v-if="required">*</span>
</label>
<div class="grid grid-cols-3 gap-1">
<Button
@@ -116,9 +115,6 @@ const props = defineProps({
type: Function,
default: (value) => `${value} is an Invalid value`,
},
required: {
type: Boolean,
},
})
const values = defineModel()

View File

@@ -10,13 +10,13 @@
:style="{ backgroundImage: 'url(\'' + encodeURI(course.image) + '\')' }"
>
<div
class="flex items-center flex-wrap space-x-1 relative top-4 px-2 w-fit"
class="flex items-center flex-wrap space-y-1 space-x-1 relative top-4 px-2 w-fit"
>
<Badge v-if="course.featured" variant="subtle" theme="green" size="md">
{{ __('Featured') }}
</Badge>
<Badge
variant="subtle"
variant="outline"
theme="gray"
size="md"
v-for="tag in course.tags"
@@ -30,36 +30,36 @@
</div>
<div class="flex flex-col flex-auto p-4">
<div class="flex items-center justify-between mb-2">
<div v-if="course.lessons">
<div v-if="course.lesson_count">
<Tooltip :text="__('Lessons')">
<span class="flex items-center">
<BookOpen class="h-4 w-4 stroke-1.5 text-gray-700 mr-1" />
{{ course.lessons }}
{{ course.lesson_count }}
</span>
</Tooltip>
</div>
<div v-if="course.enrollments">
<div v-if="course.enrollment_count">
<Tooltip :text="__('Enrolled Students')">
<span class="flex items-center">
<Users class="h-4 w-4 stroke-1.5 text-gray-700 mr-1" />
{{ course.enrollments }}
{{ course.enrollment_count }}
</span>
</Tooltip>
</div>
<div v-if="course.rating">
<div v-if="course.avg_rating">
<Tooltip :text="__('Average Rating')">
<span class="flex items-center">
<Star class="h-4 w-4 stroke-1.5 text-gray-700 mr-1" />
{{ course.rating }}
{{ course.avg_rating }}
</span>
</Tooltip>
</div>
<div v-if="course.status != 'Approved'">
<Badge
variant="subtle"
variant="solid"
:theme="course.status === 'Under Review' ? 'orange' : 'blue'"
size="sm"
>

View File

@@ -87,29 +87,27 @@
</span>
</Button>
</router-link>
<div class="space-y-4">
<div class="mt-8 font-medium">
{{ __('This course has:') }}
</div>
<div class="flex items-center">
<BookOpen class="h-4 w-4 stroke-1.5 text-gray-600" />
<span class="ml-2">
{{ course.data.lessons }} {{ __('Lessons') }}
</span>
</div>
<div class="flex items-center">
<Users class="h-4 w-4 stroke-1.5 text-gray-600" />
<span class="ml-2">
{{ formatAmount(course.data.enrollments) }}
{{ __('Enrolled Students') }}
</span>
</div>
<div v-if="parseInt(course.data.rating) > 0" class="flex items-center">
<Star class="h-4 w-4 stroke-1.5 fill-orange-500 text-gray-50" />
<span class="ml-2">
{{ course.data.rating }} {{ __('Rating') }}
</span>
</div>
<div class="mt-8 mb-4 font-medium">
{{ __('This course has:') }}
</div>
<div class="flex items-center mb-3">
<BookOpen class="h-5 w-5 stroke-1.5 text-gray-600" />
<span class="ml-2">
{{ course.data.lesson_count }} {{ __('Lessons') }}
</span>
</div>
<div class="flex items-center mb-3">
<Users class="h-5 w-5 stroke-1.5 text-gray-600" />
<span class="ml-2">
{{ course.data.enrollment_count_formatted }}
{{ __('Enrolled Students') }}
</span>
</div>
<div class="flex items-center">
<Star class="h-5 w-5 stroke-1.5 fill-orange-500 text-gray-50" />
<span class="ml-2">
{{ course.data.avg_rating }} {{ __('Rating') }}
</span>
</div>
</div>
</div>
@@ -118,7 +116,7 @@
import { BookOpen, Users, Star } from 'lucide-vue-next'
import { computed, inject } from 'vue'
import { Button, createResource } from 'frappe-ui'
import { showToast, formatAmount } from '@/utils/'
import { showToast } from '@/utils/'
import { capture } from '@/telemetry'
import { useRouter } from 'vue-router'
@@ -144,7 +142,7 @@ function enrollStudent() {
showToast(
__('Please Login'),
__('You need to login first to enroll for this course'),
'alert-circle'
'circle-warn'
)
setTimeout(() => {
window.location.href = `/login?redirect-to=${window.location.pathname}`

View File

@@ -1,5 +1,5 @@
<template>
<span v-if="instructors?.length == 1">
<span v-if="instructors.length == 1">
<router-link
:to="{
name: 'Profile',
@@ -9,7 +9,7 @@
{{ instructors[0].full_name }}
</router-link>
</span>
<span v-if="instructors?.length == 2">
<span v-if="instructors.length == 2">
<router-link
:to="{
name: 'Profile',
@@ -28,7 +28,7 @@
{{ instructors[1].first_name }}
</router-link>
</span>
<span v-if="instructors?.length > 2">
<span v-if="instructors.length > 2">
<router-link
:to="{
name: 'Profile',
@@ -37,7 +37,7 @@
>
{{ instructors[0].first_name }}
</router-link>
and {{ instructors?.length - 1 }} others
and {{ instructors.length - 1 }} others
</span>
</template>
<script setup>

View File

@@ -16,7 +16,7 @@
</div>
<div
:class="{
'shadow rounded-md py-2 px-2': showOutline && outline.data?.length,
'shadow rounded-md pt-2 px-2': showOutline && outline.data?.length,
}"
>
<Disclosure
@@ -25,42 +25,21 @@
:key="chapter.name"
:defaultOpen="openChapterDetail(chapter.idx)"
>
<DisclosureButton ref="" class="flex items-center w-full p-2 group">
<DisclosureButton ref="" class="flex w-full p-2">
<ChevronRight
:class="{
'rotate-90 transform duration-200': open,
'duration-200': !open,
hidden: chapter.is_scorm_package,
open: index == 1,
}"
class="h-4 w-4 text-gray-900 stroke-1"
class="h-4 w-4 text-gray-900 stroke-1 mr-2"
/>
<div
class="text-base text-left font-medium leading-5 ml-2"
@click="redirectToChapter(chapter)"
>
<div class="text-base text-left font-medium leading-5">
{{ chapter.title }}
</div>
<div class="flex ml-auto space-x-4">
<Tooltip :text="__('Edit Chapter')" placement="bottom">
<FilePenLine
v-if="allowEdit"
@click.prevent="openChapterModal(chapter)"
class="h-4 w-4 text-gray-900 invisible group-hover:visible"
/>
</Tooltip>
<Tooltip :text="__('Delete Chapter')" placement="bottom">
<Trash2
v-if="allowEdit"
@click.prevent="trashChapter(chapter.name)"
class="h-4 w-4 text-red-500 invisible group-hover:visible"
/>
</Tooltip>
</div>
</DisclosureButton>
<DisclosurePanel v-if="!chapter.is_scorm_package">
<DisclosurePanel>
<Draggable
v-if="!chapter.is_scorm_package"
:list="chapter.lessons"
:disabled="!allowEdit"
item-key="name"
@@ -110,7 +89,6 @@
</Draggable>
<div v-if="allowEdit" class="flex mt-2 mb-4 pl-8">
<router-link
v-if="!chapter.is_scorm_package"
:to="{
name: 'LessonForm',
params: {
@@ -124,6 +102,9 @@
{{ __('Add Lesson') }}
</Button>
</router-link>
<Button class="ml-2" @click="openChapterModal(chapter)">
{{ __('Edit Chapter') }}
</Button>
</div>
</DisclosurePanel>
</Disclosure>
@@ -137,26 +118,24 @@
/>
</template>
<script setup>
import { Button, createResource, Tooltip } from 'frappe-ui'
import { getCurrentInstance, inject, ref } from 'vue'
import { Button, createResource } from 'frappe-ui'
import { ref, getCurrentInstance } from 'vue'
import Draggable from 'vuedraggable'
import { Disclosure, DisclosureButton, DisclosurePanel } from '@headlessui/vue'
import {
Check,
ChevronRight,
FileText,
FilePenLine,
HelpCircle,
MonitorPlay,
HelpCircle,
FileText,
Check,
Trash2,
} from 'lucide-vue-next'
import { useRoute, useRouter } from 'vue-router'
import { useRoute } from 'vue-router'
import ChapterModal from '@/components/Modals/ChapterModal.vue'
import { showToast } from '@/utils'
const route = useRoute()
const router = useRouter()
const user = inject('$user')
const expandAll = ref(true)
const showChapterModal = ref(false)
const currentChapter = ref(null)
const app = getCurrentInstance()
@@ -226,10 +205,8 @@ const updateLessonIndex = createResource({
const trashLesson = (lessonName, chapterName) => {
$dialog({
title: __('Delete this lesson?'),
message: __(
'Deleting this lesson will permanently remove it from the course. This action cannot be undone. Are you sure you want to continue?'
),
title: __('Delete Lesson'),
message: __('Are you sure you want to delete this lesson?'),
actions: [
{
label: __('Delete'),
@@ -268,61 +245,6 @@ const updateOutline = (e) => {
idx: e.newIndex,
})
}
const deleteChapter = createResource({
url: 'lms.lms.api.delete_chapter',
makeParams(values) {
return {
chapter: values.chapter,
}
},
onSuccess() {
outline.reload()
showToast('Success', 'Chapter deleted successfully', 'check')
},
})
const trashChapter = (chapterName) => {
$dialog({
title: __('Delete this chapter?'),
message: __(
'Deleting this chapter will also delete all its lessons and permanently remove it from the course. This action cannot be undone. Are you sure you want to continue?'
),
actions: [
{
label: __('Delete'),
theme: 'red',
variant: 'solid',
onClick(close) {
deleteChapter.submit({ chapter: chapterName })
close()
},
},
],
})
}
const redirectToChapter = (chapter) => {
if (!chapter.is_scorm_package) return
event.preventDefault()
if (props.allowEdit) return
if (!user.data) {
showToast(
__('You are not enrolled'),
__('Please enroll for this course to view this lesson'),
'alert-circle'
)
return
}
router.push({
name: 'SCORMChapter',
params: {
courseName: props.courseName,
chapterName: chapter.name,
},
})
}
</script>
<style>
.outline-lesson:has(.router-link-active) {

View File

@@ -76,7 +76,7 @@ const props = defineProps({
required: true,
},
avg_rating: {
type: String,
type: Number,
required: true,
},
membership: {

View File

@@ -9,7 +9,7 @@
allowfullscreen
></iframe>
</div>
<div v-for="block in content?.split('\n\n')">
<div v-for="block in content.split('\n\n')">
<div v-if="block.includes('{{ YouTubeVideo')">
<iframe
class="youtube-video"

View File

@@ -1,20 +1,5 @@
<template>
<div class="space-y-5">
<div class="space-y-2">
<div class="flex items-center text-sm font-medium space-x-2">
<span>
{{ __('What does include in preview mean?') }}
</span>
</div>
<div class="text-xs text-gray-600 mb-1 leading-5">
{{
__(
'If Include in Preview is enabled for a lesson then the lesson will also be accessible to non logged in users.'
)
}}
</div>
</div>
<div class="space-y-2">
<div
class="flex items-center text-sm font-medium space-x-2 cursor-pointer"
@@ -36,11 +21,11 @@
<div class="space-y-2">
<div
class="flex text-sm font-medium space-x-2 cursor-pointer"
class="flex items-center text-sm font-medium space-x-2 cursor-pointer"
@click="openHelpDialog('upload')"
>
<span class="leading-5">
{{ __(contentMap['upload']) }}
{{ __('How to upload content from your system?') }}
</span>
<Info class="w-3 h-3 text-gray-700" />
</div>
@@ -59,7 +44,7 @@
@click="openHelpDialog('youtube')"
>
<span>
{{ __(contentMap['youtube']) }}
{{ __('How to add a YouTube Video?') }}
</span>
<Info class="w-3 h-3 text-gray-700" />
</div>
@@ -72,7 +57,7 @@
</div>
</div>
</div>
<ExplanationVideos v-model="showExplanation" :title="title" :type="type" />
<ExplanationVideos v-model="showExplanation" :type="type" />
</template>
<script setup>
import { Info } from 'lucide-vue-next'
@@ -81,16 +66,9 @@ import ExplanationVideos from '@/components/Modals/ExplanationVideos.vue'
const showExplanation = ref(false)
const type = ref(null)
const title = ref(null)
const contentMap = {
quiz: 'How to add a Quiz?',
upload: 'How to upload content from your system?',
youtube: 'How to add a YouTube Video?',
}
const openHelpDialog = (contentType) => {
type.value = contentType
title.value = contentMap[contentType]
showExplanation.value = true
}
</script>

View File

@@ -46,10 +46,9 @@
{{ __('Start') }}
</a>
<a
v-if="cls.date <= dayjs().format('YYYY-MM-DD')"
:href="cls.join_url"
target="_blank"
class="w-full cursor-pointer inline-flex items-center justify-center gap-2 transition-colors focus:outline-none text-gray-800 bg-gray-100 hover:bg-gray-200 active:bg-gray-300 focus-visible:ring focus-visible:ring-gray-400 h-7 text-base px-2 rounded"
class="w-1/2 cursor-pointer inline-flex items-center justify-center gap-2 transition-colors focus:outline-none text-gray-800 bg-gray-100 hover:bg-gray-200 active:bg-gray-300 focus-visible:ring focus-visible:ring-gray-400 h-7 text-base px-2 rounded"
>
<Video class="h-4 w-4 stroke-1.5" />
{{ __('Join') }}

View File

@@ -66,19 +66,8 @@
<div class="text-gray-900">
{{ member.full_name }}
</div>
<div
class="px-1"
v-if="member.role && getRole(member.role) !== 'Student'"
>
<Badge
:variant="'subtle'"
:ref_for="true"
theme="blue"
size="sm"
label="Badge"
>
{{ getRole(member.role) }}
</Badge>
<div v-if="getRole(member)">
{{ getRole(member) }}
</div>
</div>
<div class="text-sm text-gray-700">
@@ -110,7 +99,7 @@
</div>
</template>
<script setup lang="ts">
import { createResource, Avatar, Button, FormControl, Badge } from 'frappe-ui'
import { createResource, Avatar, Button, FormControl } from 'frappe-ui'
import { useRouter } from 'vue-router'
import { ref, watch, reactive, inject } from 'vue'
import { RefreshCw, Plus, X } from 'lucide-vue-next'

View File

@@ -18,7 +18,6 @@
<div class="">
<div class="mb-1.5 text-sm text-gray-600">
{{ __('Subject') }}
<span class="text-red-500">*</span>
</div>
<Input type="text" v-model="announcement.subject" />
</div>
@@ -45,7 +44,7 @@
<script setup>
import { Dialog, Input, TextEditor, createResource } from 'frappe-ui'
import { reactive } from 'vue'
import { showToast } from '@/utils/'
import { createToast } from '@/utils/'
const show = defineModel()
@@ -95,14 +94,22 @@ const makeAnnouncement = (close) => {
},
onSuccess() {
close()
showToast(
__('Success'),
__('Announcement has been sent successfully'),
'check'
)
createToast({
title: 'Success',
text: 'Announcement has been sent successfully',
icon: 'Check',
iconClasses: 'bg-green-600 text-white rounded-md p-px',
})
},
onError(err) {
showToast(__('Error'), __(err.messages?.[0] || err), 'check')
createToast({
title: 'Error',
text: err.messages?.[0] || err,
icon: 'x',
iconClasses: 'bg-red-600 text-white rounded-md p-px',
position: 'top-center',
timeout: 10,
})
},
}
)

View File

@@ -14,12 +14,7 @@
}"
>
<template #body-content>
<Link
doctype="LMS Course"
v-model="course"
:label="__('Course')"
:required="true"
/>
<Link doctype="LMS Course" v-model="course" :label="__('Course')" />
<Link
doctype="Course Evaluator"
v-model="evaluator"

View File

@@ -1,113 +0,0 @@
<template>
<Dialog v-model="show" :options="{}">
<template #body>
<div class="p-5 space-y-8 text-base">
<div class="flex items-center space-x-2">
<Avatar :image="student.user_image" size="3xl" />
<div class="space-y-1">
<div class="flex items-center space-x-2">
<div class="text-xl font-semibold">
{{ student.full_name }}
</div>
<Badge :theme="student.progress === 100 ? 'green' : 'red'">
{{ student.progress }}% {{ __('Complete') }}
</Badge>
</div>
<div class="text-sm text-gray-700">
{{ student.email }}
</div>
</div>
</div>
<!-- Assessments -->
<div>
<div>
<div
class="grid grid-cols-[70%,30%] border-b pl-2 pb-1 mb-2 text-xs text-gray-700 font-medium"
>
<span>
{{ __('Assessment') }}
</span>
<span>
{{ __('Progress') }}
</span>
</div>
<div
v-for="assessment in Object.keys(student.assessments)"
class="grid grid-cols-[70%,30%] pl-2 mb-2 text-gray-700 font-medium"
>
<span>
{{ assessment }}
</span>
<span v-if="isAssignment(student.assessments[assessment])">
<Badge :theme="getStatusTheme(student.assessments[assessment])">
{{ student.assessments[assessment] }}
</Badge>
</span>
<span v-else>
{{ student.assessments[assessment] }}
</span>
</div>
</div>
</div>
<!-- Courses -->
<div>
<div>
<div
class="grid grid-cols-[70%,30%] mb-2 text-xs text-gray-700 border-b pl-2 pb-1 font-medium"
>
<span>
{{ __('Courses') }}
</span>
<span>
{{ __('Progress') }}
</span>
</div>
<div
v-for="course in Object.keys(student.courses)"
class="grid grid-cols-[70%,30%] pl-2 mb-2 text-gray-700 font-medium"
>
<span>
{{ course }}
</span>
<span>
{{ Math.floor(student.courses[course]) }}
</span>
</div>
</div>
</div>
<!-- <span class="mt-4">
{{ student }}
</span> -->
</div>
</template>
</Dialog>
</template>
<script setup>
import { Avatar, Badge, Dialog } from 'frappe-ui'
import ProgressBar from '@/components/ProgressBar.vue'
const show = defineModel()
const props = defineProps({
student: {
type: Object,
default: null,
},
})
const isAssignment = (value) => {
return isNaN(value)
}
const getStatusTheme = (status) => {
if (status === 'Pass') {
return 'green'
} else if (status == 'Not Graded') {
return 'orange'
} else {
return 'red'
}
}
</script>

View File

@@ -1,132 +0,0 @@
<template>
<Dialog
v-model="show"
:options="{
title: __('Generate Certificates'),
size: 'lg',
actions: [
{
label: 'Create',
variant: 'solid',
onClick: ({ close }) => {
generateCertificates(close)
},
},
],
}"
>
<template #body-content>
<div class="space-y-4">
<FormControl
type="select"
v-model="details.course"
:label="__('Course')"
:options="getCourses()"
/>
<Link
v-model="details.evaluator"
:label="__('Evaluator')"
doctype="Course Evaluator"
/>
<FormControl
type="date"
v-model="details.issue_date"
:label="__('Issue Date')"
/>
<FormControl
type="date"
v-model="details.expiry_date"
:label="__('Expiry Date')"
/>
<Link
v-model="details.template"
:label="__('Template')"
doctype="Print Format"
:filters="{
doc_type: 'LMS Certificate',
}"
/>
<Switch
size="sm"
:label="__('Published')"
:description="
__(
'Enabling this will publish the certificate on the certified participants page.'
)
"
v-model="details.published"
/>
</div>
</template>
</Dialog>
</template>
<script setup>
import { inject, reactive } from 'vue'
import { createResource, Dialog, FormControl, Switch } from 'frappe-ui'
import Link from '@/components/Controls/Link.vue'
import { showToast } from '@/utils'
const show = defineModel()
const dayjs = inject('$dayjs')
const details = reactive({
issue_date: dayjs().format('YYYY-MM-DD'),
expiry_date: null,
template: null,
evaluator: null,
published: true,
})
const props = defineProps({
batch: {
type: [Object, null],
required: true,
},
})
const createCertificate = createResource({
url: 'frappe.client.insert',
makeParams(values) {
return {
doc: {
doctype: 'LMS Certificate',
issue_date: details.issue_date,
expiry_date: details.expiry_date,
template: details.template,
published: details.published,
course: values.course,
batch: values.batch,
member: values.member,
evaluator: details.evaluator,
},
}
},
})
const generateCertificates = (close) => {
props.batch?.students.forEach((student) => {
createCertificate.submit(
{
course: details.course,
batch: props.batch.name,
member: student,
},
{
onError(err) {
showToast(__('Error'), err.messages?.[0] || err, 'x')
},
}
)
})
close()
showToast(__('Success'), __('Certificates generated successfully'), 'check')
}
const getCourses = () => {
return props.batch?.courses.map((course) => {
return {
label: course.course,
value: course.course,
}
})
}
</script>

View File

@@ -2,11 +2,11 @@
<Dialog
v-model="show"
:options="{
title: chapterDetail ? __('Edit Chapter') : __('Add Chapter'),
title: __('Add Chapter'),
size: 'lg',
actions: [
{
label: chapterDetail ? __('Edit') : __('Create'),
label: chapterDetail ? __('Edit Chapter') : __('Add Chapter'),
variant: 'solid',
onClick: (close) =>
chapterDetail ? editChapter(close) : addChapter(close),
@@ -15,77 +15,24 @@
}"
>
<template #body-content>
<div class="space-y-4 text-base">
<FormControl label="Title" v-model="chapter.title" :required="true" />
<Switch
size="sm"
:label="__('SCORM Package')"
:description="
__(
'Enable this only if you want to upload a SCORM package as a chapter.'
)
"
v-model="chapter.is_scorm_package"
/>
<div v-if="chapter.is_scorm_package">
<FileUploader
v-if="!chapter.scorm_package"
:fileTypes="['.zip']"
:validateFile="validateFile"
@success="(file) => (chapter.scorm_package = file)"
>
<template v-slot="{ file, progress, uploading, openFileSelector }">
<div class="mb-4">
<Button @click="openFileSelector" :loading="uploading">
{{
uploading ? `Uploading ${progress}%` : 'Upload an zip file'
}}
</Button>
</div>
</template>
</FileUploader>
<div v-else class="">
<div class="flex items-center">
<div class="border rounded-md p-2 mr-2">
<FileText class="h-5 w-5 stroke-1.5 text-gray-700" />
</div>
<div class="flex flex-col">
<span>
{{ chapter.scorm_package.file_name }}
</span>
<span class="text-sm text-gray-500 mt-1">
{{ getFileSize(chapter.scorm_package.file_size) }}
</span>
</div>
<X
@click="() => (chapter.scorm_package = null)"
class="bg-gray-200 rounded-md cursor-pointer stroke-1.5 w-5 h-5 p-1 ml-4"
/>
</div>
</div>
</div>
</div>
<FormControl
ref="chapterInput"
label="Title"
v-model="chapter.title"
class="mb-4"
/>
</template>
</Dialog>
</template>
<script setup>
import {
Button,
createResource,
Dialog,
FileUploader,
FormControl,
Switch,
} from 'frappe-ui'
import { defineModel, reactive, watch } from 'vue'
import { showToast, getFileSize } from '@/utils/'
import { Dialog, FormControl, createResource } from 'frappe-ui'
import { defineModel, reactive, watch, ref } from 'vue'
import { createToast } from '@/utils/'
import { capture } from '@/telemetry'
import { FileText, X } from 'lucide-vue-next'
import { useSettings } from '@/stores/settings'
const show = defineModel()
const outline = defineModel('outline')
const settingsStore = useSettings()
const chapterInput = ref(null)
const props = defineProps({
course: {
@@ -99,19 +46,30 @@ const props = defineProps({
const chapter = reactive({
title: '',
is_scorm_package: 0,
scorm_package: null,
})
const chapterResource = createResource({
url: 'lms.lms.api.upsert_chapter',
url: 'frappe.client.insert',
makeParams(values) {
return {
title: chapter.title,
course: props.course,
is_scorm_package: chapter.is_scorm_package,
scorm_package: chapter.scorm_package,
doc: {
doctype: 'Course Chapter',
title: chapter.title,
description: chapter.description,
course: props.course,
},
}
},
})
const chapterEditResource = createResource({
url: 'frappe.client.set_value',
makeParams(values) {
return {
doctype: 'Course Chapter',
name: props.chapterDetail?.name,
fieldname: 'title',
value: chapter.title,
}
},
})
@@ -131,12 +89,14 @@ const chapterReference = createResource({
},
})
const addChapter = async (close) => {
const addChapter = (close) => {
chapterResource.submit(
{},
{
validate() {
return validateChapter()
if (!chapter.title) {
return 'Title is required'
}
},
onSuccess: (data) => {
capture('chapter_created')
@@ -144,48 +104,30 @@ const addChapter = async (close) => {
{ name: data.name },
{
onSuccess(data) {
cleanChapter()
if (!settingsStore.onboardingDetails.data?.is_onboarded) {
settingsStore.onboardingDetails.reload()
}
chapter.title = ''
outline.value.reload()
showToast(
__('Success'),
__('Chapter added successfully'),
'check'
)
createToast({
text: 'Chapter added successfully',
icon: 'check',
iconClasses: 'bg-green-600 text-white rounded-md p-px',
})
},
onError(err) {
showToast(__('Error'), err.messages?.[0] || err, 'x')
showError(err)
},
}
)
close()
},
onError(err) {
showToast(__('Error'), err.messages?.[0] || err, 'x')
showError(err)
},
}
)
}
const validateChapter = () => {
if (!chapter.title) {
return __('Title is required')
}
if (chapter.is_scorm_package && !chapter.scorm_package) {
return __('Please upload a SCORM package')
}
}
const cleanChapter = () => {
chapter.title = ''
chapter.is_scorm_package = 0
chapter.scorm_package = null
}
const editChapter = (close) => {
chapterResource.submit(
chapterEditResource.submit(
{},
{
validate() {
@@ -195,29 +137,43 @@ const editChapter = (close) => {
},
onSuccess() {
outline.value.reload()
showToast(__('Success'), __('Chapter updated successfully'), 'check')
createToast({
text: 'Chapter updated successfully',
icon: 'check',
iconClasses: 'bg-green-600 text-white rounded-md p-px',
})
close()
},
onError(err) {
showToast(__('Error'), err.messages?.[0] || err, 'x')
showError(err)
},
}
)
}
const showError = (err) => {
createToast({
title: 'Error',
text: err.messages?.[0] || err,
icon: 'x',
iconClasses: 'bg-red-600 text-white rounded-md p-px',
position: 'top-center',
timeout: 10,
})
}
watch(
() => props.chapterDetail,
(newChapter) => {
chapter.title = newChapter?.title
chapter.is_scorm_package = newChapter?.is_scorm_package
chapter.scorm_package = newChapter?.scorm_package
}
)
const validateFile = (file) => {
let extension = file.name.split('.').pop().toLowerCase()
if (extension !== 'zip') {
return __('Only zip files are allowed')
watch(show, () => {
if (show.value) {
setTimeout(() => {
chapterInput.value.$el.querySelector('input').focus()
}, 100)
}
}
})
</script>

View File

@@ -69,18 +69,7 @@
:label="__('Headline')"
class="mb-4"
/>
<div class="mb-4">
<div class="mb-1.5 text-sm text-gray-600">
{{ __('Bio') }}
</div>
<TextEditor
:fixedMenu="true"
@change="(val) => (profile.bio = val)"
:content="profile.bio"
editorClass="prose-sm py-2 px-2 min-h-[200px] border-gray-300 hover:border-gray-400 rounded-md bg-gray-200"
/>
</div>
<FormControl type="textarea" v-model="profile.bio" :label="__('Bio')" />
</div>
</template>
</Dialog>
@@ -92,7 +81,6 @@ import {
FileUploader,
Button,
createResource,
TextEditor,
} from 'frappe-ui'
import { reactive, watch, defineModel } from 'vue'
import { FileText, X } from 'lucide-vue-next'

View File

@@ -154,12 +154,10 @@ function submitEvaluation(close) {
const getCourses = () => {
let courses = []
for (const course of props.courses) {
if (course.evaluator) {
courses.push({
label: course.title,
value: course.course,
})
}
courses.push({
label: course.title,
value: course.course,
})
}
return courses
}

View File

@@ -3,11 +3,10 @@
v-model="show"
:options="{
size: '4xl',
title: title,
}"
>
<template #body-content>
<div>
<template #body>
<div class="p-4">
<VideoBlock :file="file" />
</div>
</template>
@@ -25,10 +24,6 @@ const props = defineProps({
type: [String, null],
required: true,
},
title: {
type: [String, null],
required: true,
},
})
const file = computed(() => {

View File

@@ -22,7 +22,6 @@
v-model="liveClass.title"
:label="__('Title')"
class="mb-4"
:required="true"
/>
<Tooltip
:text="
@@ -36,7 +35,6 @@
type="time"
:label="__('Time')"
class="mb-4"
:required="true"
/>
</Tooltip>
<FormControl
@@ -44,7 +42,6 @@
type="select"
:options="getTimezoneOptions()"
:label="__('Timezone')"
:required="true"
/>
</div>
<div>
@@ -53,7 +50,6 @@
type="date"
class="mb-4"
:label="__('Date')"
:required="true"
/>
<Tooltip :text="__('Duration of the live class in minutes')">
<FormControl
@@ -61,7 +57,6 @@
v-model="liveClass.duration"
:label="__('Duration')"
class="mb-4"
:required="true"
/>
</Tooltip>
<FormControl
@@ -161,34 +156,25 @@ const submitLiveClass = (close) => {
return createLiveClass.submit(liveClass, {
validate() {
if (!liveClass.title) {
return __('Please enter a title.')
return 'Please enter a title.'
}
if (!liveClass.date) {
return __('Please select a date.')
return 'Please select a date.'
}
if (dayjs(liveClass.date).isSameOrBefore(dayjs(), 'day')) {
return 'Please select a future date.'
}
if (!liveClass.time) {
return __('Please select a time.')
}
if (!liveClass.timezone) {
return __('Please select a timezone.')
return 'Please select a time.'
}
if (!valideTime()) {
return __('Please enter a valid time in the format HH:mm.')
}
const liveClassDateTime = dayjs(`${liveClass.date}T${liveClass.time}`).tz(
liveClass.timezone,
true
)
if (
liveClassDateTime.isSameOrBefore(
dayjs().tz(liveClass.timezone, false),
'minute'
)
) {
return __('Please select a future date and time.')
return 'Please enter a valid time in the format HH:mm.'
}
if (!liveClass.duration) {
return __('Please select a duration.')
return 'Please select a duration.'
}
if (!liveClass.timezone) {
return 'Please select a timezone.'
}
},
onSuccess() {

View File

@@ -12,9 +12,9 @@
id="existing"
value="existing"
v-model="questionType"
class="w-3 h-3 cursor-pointer"
class="w-3 h-3 accent-gray-900"
/>
<label for="existing" class="cursor-pointer">
<label for="existing">
{{ __('Add an existing question') }}
</label>
</div>
@@ -25,9 +25,9 @@
id="new"
value="new"
v-model="questionType"
class="w-3 h-3 cursor-pointer"
class="w-3 h-3"
/>
<label for="new" class="cursor-pointer">
<label for="new">
{{ __('Create a new question') }}
</label>
</div>
@@ -56,14 +56,12 @@
type="select"
:options="['Choices', 'User Input', 'Open Ended']"
class="pb-2"
:required="true"
/>
<div v-if="question.type == 'Choices'" class="divide-y border-t">
<div v-for="n in 4" class="space-y-4 py-2">
<FormControl
:label="__('Option') + ' ' + n"
v-model="question[`option_${n}`]"
:required="n <= 2 ? true : false"
/>
<FormControl
:label="__('Explanation')"
@@ -84,7 +82,6 @@
<FormControl
:label="__('Possibility') + ' ' + n"
v-model="question[`possibility_${n}`]"
:required="n == 1 ? true : false"
/>
</div>
</div>
@@ -130,7 +127,7 @@ const populateFields = () => {
let counter = 1
fields.forEach((field) => {
while (counter <= 4) {
question[`${field}_${counter}`] = field === 'is_correct' ? false : null
question[`${field}_${counter}`] = field === 'is_correct' ? false : ''
counter++
}
})

View File

@@ -108,31 +108,9 @@ const tabsStructure = computed(() => {
hideLabel: true,
items: [
{
label: 'General',
icon: 'Wrench',
fields: [
{
label: 'Enable Learning Paths',
name: 'enable_learning_paths',
description:
'This will enforce students to go through programs assigned to them in the correct order.',
type: 'checkbox',
},
{
label: 'Send calendar invite for evaluations',
name: 'send_calendar_invite_for_evaluations',
description:
'If enabled, it sends google calendar invite to the student for evaluations.',
type: 'checkbox',
},
{
label: 'Unsplash Access Key',
name: 'unsplash_access_key',
description:
'Optional. If this is set, students can pick a cover image from the unsplash library for their profile page. https://unsplash.com/documentation#getting-started.',
type: 'text',
},
],
label: 'Members',
description: 'Manage the members of your learning system',
icon: 'UserRoundPlus',
},
],
},
@@ -178,14 +156,9 @@ const tabsStructure = computed(() => {
],
},
{
label: 'Lists',
hideLabel: false,
label: 'Settings',
hideLabel: true,
items: [
{
label: 'Members',
description: 'Manage the members of your learning system',
icon: 'UserRoundPlus',
},
{
label: 'Categories',
description: 'Manage the members of your learning system',

View File

@@ -28,7 +28,6 @@
import { Dialog, createResource } from 'frappe-ui'
import { ref } from 'vue'
import Link from '@/components/Controls/Link.vue'
import { showToast } from '@/utils'
const students = defineModel('reloadStudents')
const student = ref()
@@ -62,11 +61,8 @@ const addStudent = (close) => {
{
onSuccess() {
students.value.reload()
student.value = null
close()
},
onError(err) {
showToast(__('Error'), __(err.messages?.[0] || err), 'x')
student.value = null
},
}
)

View File

@@ -1,151 +0,0 @@
<template>
<div v-if="showOnboardingBanner && onboardingDetails.data">
<Tooltip :text="__('Skip Onboarding')" placement="left">
<X
class="w-4 h-4 stroke-1 absolute top-2 right-2 cursor-pointer mr-1"
@click="skipOnboarding.reload()"
/>
</Tooltip>
<div class="flex items-center justify-evenly bg-gray-100 p-10">
<div
@click="redirectToCourseForm()"
class="flex items-center space-x-2"
:class="{
'cursor-pointer': !onboardingDetails.data.course_created?.length,
}"
>
<span
v-if="onboardingDetails.data.course_created?.length"
class="py-1 px-1 bg-white rounded-full"
>
<Check class="h-4 w-4 stroke-2 text-green-600" />
</span>
<span v-else class="font-semibold bg-white px-2 py-1 rounded-full">
1
</span>
<span class="text-lg font-semibold">
{{ __('Create a course') }}
</span>
</div>
<div
@click="redirectToChapterForm()"
class="flex items-center space-x-2"
:class="{
'cursor-pointer':
onboardingDetails.data.course_created?.length &&
!onboardingDetails.data.chapter_created?.length,
'text-gray-400': !onboardingDetails.data.course_created?.length,
}"
>
<span
v-if="onboardingDetails.data.chapter_created?.length"
class="py-1 px-1 bg-white rounded-full"
>
<Check class="h-4 w-4 stroke-2 text-green-600" />
</span>
<span v-else class="font-semibold bg-white px-2 py-1 rounded-full">
2
</span>
<span class="text-lg font-semibold">
{{ __('Add a chapter') }}
</span>
</div>
<div
@click="redirectToLessonForm()"
class="flex items-center space-x-2"
:class="{
'cursor-pointer':
onboardingDetails.data.course_created?.length &&
onboardingDetails.data.chapter_created?.length,
'text-gray-400':
!onboardingDetails.data.course_created?.length ||
!onboardingDetails.data.chapter_created?.length,
}"
>
<span
v-if="onboardingDetails.data.lesson_created?.length"
class="py-1 px-1 bg-white rounded-full"
>
<Check class="h-4 w-4 stroke-2 text-green-600" />
</span>
<span class="font-semibold bg-white px-2 py-1 rounded-full"> 3 </span>
<span class="text-lg font-semibold">
{{ __('Add a lesson') }}
</span>
</div>
</div>
</div>
</template>
<script setup lang="ts">
import { ref, watch } from 'vue'
import { Check, X } from 'lucide-vue-next'
import { useRouter } from 'vue-router'
import { useSettings } from '@/stores/settings'
import { createResource, Tooltip } from 'frappe-ui'
const showOnboardingBanner = ref(false)
const settings = useSettings()
const onboardingDetails = settings.onboardingDetails
const router = useRouter()
watch(onboardingDetails, () => {
if (!onboardingDetails.data?.is_onboarded) {
showOnboardingBanner.value = true
} else {
showOnboardingBanner.value = false
}
})
const redirectToCourseForm = () => {
if (onboardingDetails.data?.course_created.length) {
return
} else {
router.push({ name: 'CourseForm', params: { courseName: 'new' } })
}
}
const redirectToChapterForm = () => {
if (!onboardingDetails.data?.course_created.length) {
return
} else {
router.push({
name: 'CourseForm',
params: {
courseName: onboardingDetails.data?.first_course,
},
})
}
}
const redirectToLessonForm = () => {
if (!onboardingDetails.data?.course_created.length) {
return
} else if (!onboardingDetails.data?.chapter_created.length) {
return
} else {
router.push({
name: 'LessonForm',
params: {
courseName: onboardingDetails.data?.first_course,
chapterNumber: 1,
lessonNumber: 1,
},
})
}
}
const skipOnboarding = createResource({
url: 'frappe.client.set_value',
makeParams() {
return {
doctype: 'LMS Settings',
name: 'LMS Settings',
fieldname: 'is_onboarding_complete',
value: 1,
}
},
onSuccess(data) {
onboardingDetails.reload()
},
})
</script>

View File

@@ -1,44 +1,24 @@
<template>
<Tooltip :text="`${props.progress}%`">
<div class="w-full bg-gray-200 rounded-full h-1 my-2">
<div
class="bg-gray-900 rounded-full"
:class="progressBarHeight"
:style="{ width: progressBarWidth }"
></div>
</div>
</Tooltip>
<div class="w-full bg-gray-200 rounded-full h-1 my-2">
<div
class="bg-gray-900 h-1 rounded-full"
:style="{ width: progressBarWidth }"
></div>
</div>
</template>
<script setup>
import { computed } from 'vue'
import { Tooltip } from 'frappe-ui'
const props = defineProps({
progress: {
type: Number,
default: 0,
},
size: {
type: String,
default: 'sm',
},
})
const progressBarWidth = computed(() => {
const formattedPercentage = Math.min(Math.ceil(props.progress), 100)
return `${formattedPercentage}%`
})
const progressBarHeight = computed(() => {
if (props.size === 'sm') {
return 'h-1'
}
if (props.size === 'md') {
return 'h-2'
}
if (props.size === 'lg') {
return 'h-3'
}
})
</script>

View File

@@ -1,7 +1,7 @@
<template>
<div v-if="quiz.data">
<div
class="bg-blue-100 space-y-1 py-2 px-2 mb-4 rounded-md text-sm text-blue-800"
class="bg-blue-100 space-y-1 py-2 px-2 rounded-md text-sm text-blue-800"
>
<div class="leading-5">
{{
@@ -118,17 +118,15 @@
class="w-3.5 h-3.5 text-gray-900 rounded-sm focus:ring-gray-200"
@change="markAnswer(index)"
/>
<div
v-else-if="quiz.data.show_answers"
v-for="(answer, idx) in showAnswers"
>
<div v-if="index - 1 == idx">
<CheckCircle
v-if="answer == 1"
class="w-4 h-4 text-green-500"
/>
<CheckCircle v-if="answer" class="w-4 h-4 text-green-500" />
<MinusCircle
v-else-if="answer == 2"
v-else-if="questionDetails.data[`is_correct_${index}`]"
class="w-4 h-4 text-green-500"
/>
<XCircle
@@ -273,7 +271,6 @@
import {
Badge,
Button,
call,
createResource,
ListView,
TextEditor,
@@ -283,7 +280,6 @@ import { ref, watch, reactive, inject, computed } from 'vue'
import { createToast } from '@/utils/'
import { CheckCircle, XCircle, MinusCircle } from 'lucide-vue-next'
import { timeAgo } from '@/utils'
import { useRouter } from 'vue-router'
import ProgressBar from '@/components/ProgressBar.vue'
const user = inject('$user')
@@ -295,7 +291,6 @@ let questions = reactive([])
const possibleAnswer = ref(null)
const timer = ref(0)
let timerInterval = null
const router = useRouter()
const props = defineProps({
quizName: {
@@ -402,9 +397,6 @@ const attempts = createResource({
watch(
() => quiz.data,
() => {
if (quiz.data) {
populateQuestions()
}
if (quiz.data && quiz.data.max_attempts) {
attempts.reload()
resetQuiz()
@@ -501,8 +493,8 @@ const checkAnswer = () => {
selectedOptions.forEach((option, index) => {
if (option) {
showAnswers[index] = option && data[index]
} else if (data[index] == 2) {
showAnswers[index] = 2
} else if (questionDetails.data[`is_correct_${index + 1}`]) {
showAnswers[index] = 0
} else {
showAnswers[index] = undefined
}
@@ -565,7 +557,6 @@ const createSubmission = () => {
{},
{
onSuccess(data) {
markLessonProgress()
if (quiz.data && quiz.data.max_attempts) attempts.reload()
if (quiz.data.duration) clearInterval(timerInterval)
},
@@ -589,16 +580,6 @@ const getInstructions = (question) => {
else return __('Type your answer')
}
const markLessonProgress = () => {
if (router.currentRoute.value.name == 'Lesson') {
call('lms.lms.api.mark_lesson_progress', {
course: router.currentRoute.value.params.courseName,
chapter_number: router.currentRoute.value.params.chapterNumber,
lesson_number: router.currentRoute.value.params.lessonNumber,
})
}
}
const getSubmissionColumns = () => {
return [
{

View File

@@ -0,0 +1,58 @@
<template>
<Dialog
v-model="show"
:options="{
size: 'xl',
}"
>
<template #body>
<div class="p-5 space-y-4">
<div class="text-lg font-semibold">
{{ __('Add a quiz to your lesson') }}
</div>
<div>
<Link
v-model="quiz"
doctype="LMS Quiz"
:label="__('Select a quiz')"
:onCreate="(value, close) => redirectToQuizForm()"
/>
</div>
<div class="flex justify-end space-x-2">
<Button variant="solid" @click="addQuiz()">
{{ __('Save') }}
</Button>
</div>
</div>
</template>
</Dialog>
</template>
<script setup>
import { Dialog, Button } from 'frappe-ui'
import { onMounted, ref, nextTick } from 'vue'
import Link from '@/components/Controls/Link.vue'
const show = ref(false)
const quiz = ref(null)
const props = defineProps({
onQuizAddition: {
type: Function,
required: true,
},
})
onMounted(async () => {
await nextTick()
show.value = true
})
const addQuiz = () => {
props.onQuizAddition(quiz.value)
show.value = false
}
const redirectToQuizForm = () => {
window.open('/lms/quizzes/new', '_blank')
}
</script>

View File

@@ -29,7 +29,6 @@
<script setup>
import { Button, Badge } from 'frappe-ui'
import SettingFields from '@/components/SettingFields.vue'
import { showToast } from '@/utils'
const props = defineProps({
fields: {
@@ -55,14 +54,7 @@ const update = () => {
props.data.doc[f.name] = f.value
}
})
props.data.save.submit(
{},
{
onError(err) {
showToast(__('Error'), err.messages?.[0] || err, 'x')
},
}
)
props.data.save.submit()
}
</script>

View File

@@ -90,7 +90,6 @@
:type="field.type"
:rows="field.rows"
:options="field.options"
:description="field.description"
/>
</div>
</div>
@@ -101,7 +100,7 @@
import { FormControl, FileUploader, Button, Switch } from 'frappe-ui'
import { computed } from 'vue'
import { getFileSize, validateFile } from '@/utils'
import { X } from 'lucide-vue-next'
import { X, FileText } from 'lucide-vue-next'
import Link from '@/components/Controls/Link.vue'
import CodeEditor from '@/components/Controls/CodeEditor.vue'

View File

@@ -7,7 +7,7 @@
>
<div
class="flex items-center w-full duration-300 ease-in-out group"
:class="isCollapsed ? 'p-1 relative' : 'px-2 py-1'"
:class="isCollapsed ? 'p-1' : 'px-2 py-1'"
>
<Tooltip :text="link.label" placement="right">
<slot name="icon">
@@ -29,15 +29,7 @@
>
{{ __(link.label) }}
</span>
<span
v-if="link.count"
class="!ml-auto block text-xs text-gray-600"
:class="
isCollapsed && link.count > 9
? 'absolute top-[2px] right-0 bg-white'
: ''
"
>
<span v-if="link.count" class="!ml-auto block text-xs text-gray-600">
{{ link.count }}
</span>
<div

View File

@@ -4,7 +4,6 @@
@timeupdate="updateTime"
@ended="videoEnded"
@click="togglePlay"
oncontextmenu="return false"
class="rounded-lg border border-gray-100 group cursor-pointer"
ref="videoRef"
>

View File

@@ -1,191 +0,0 @@
<template>
<header
class="sticky top-0 z-10 flex items-center justify-between border-b bg-white px-3 py-2.5 sm:px-5"
>
<Breadcrumbs :items="breadcrumbs" />
<div class="space-x-2">
<router-link
v-if="assignment.doc?.name"
:to="{
name: 'AssignmentSubmissionList',
query: {
assignmentID: assignment.doc.name,
},
}"
>
<Button>
{{ __('Submission List') }}
</Button>
</router-link>
<Button variant="solid" @click="saveAssignment()">
{{ __('Save') }}
</Button>
</div>
</header>
<div class="w-3/4 mx-auto py-5">
<div class="font-semibold mb-4">
{{ __('Details') }}
</div>
<div class="grid grid-cols-2 gap-5 mt-4 mb-8">
<FormControl
v-model="model.title"
:label="__('Title')"
:required="true"
/>
<FormControl
v-model="model.type"
type="select"
:options="assignmentOptions"
:label="__('Type')"
:required="true"
/>
</div>
<div>
<div class="text-xs text-gray-600 mb-2">
{{ __('Question') }}
<span class="text-ink-red-3">*</span>
</div>
<TextEditor
:content="model.question"
@change="(val) => (model.question = 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]"
/>
</div>
</div>
</template>
<script setup>
import {
Breadcrumbs,
Button,
createDocumentResource,
createResource,
FormControl,
TextEditor,
} from 'frappe-ui'
import {
computed,
inject,
onMounted,
onBeforeUnmount,
reactive,
watch,
} from 'vue'
import { showToast } from '@/utils'
import { useRouter } from 'vue-router'
const user = inject('$user')
const router = useRouter()
const props = defineProps({
assignmentID: {
type: String,
required: true,
},
})
const model = reactive({
title: '',
type: 'PDF',
question: '',
})
onMounted(() => {
if (
props.assignmentID == 'new' &&
!user.data?.is_moderator &&
!user.data?.is_instructor
) {
router.push({ name: 'Courses' })
}
if (props.assignmentID !== 'new') {
assignment.reload()
}
window.addEventListener('keydown', keyboardShortcut)
})
const keyboardShortcut = (e) => {
if (e.key === 's' && (e.ctrlKey || e.metaKey)) {
saveAssignment()
e.preventDefault()
}
}
onBeforeUnmount(() => {
window.removeEventListener('keydown', keyboardShortcut)
})
const assignment = createDocumentResource({
doctype: 'LMS Assignment',
name: props.assignmentID,
auto: false,
})
const newAssignment = createResource({
url: 'frappe.client.insert',
makeParams(values) {
return {
doc: {
doctype: 'LMS Assignment',
...values,
},
}
},
onSuccess(data) {
router.push({ name: 'AssignmentForm', params: { assignmentID: data.name } })
},
onError(err) {
showToast(__('Error'), __(err.messages?.[0] || err), 'x')
},
})
const saveAssignment = () => {
if (props.assignmentID == 'new') {
newAssignment.submit({
...model,
})
} else {
assignment.setValue.submit(
{
...model,
},
{
onSuccess(data) {
showToast(__('Success'), __('Assignment saved successfully'), 'check')
assignment.reload()
},
onError(err) {
showToast(__('Error'), __(err.messages?.[0] || err), 'x')
},
}
)
}
}
watch(assignment, () => {
Object.keys(assignment.doc).forEach((key) => {
model[key] = assignment.doc[key]
})
})
const breadcrumbs = computed(() => [
{
label: __('Assignments'),
route: { name: 'Assignments' },
},
{
label: assignment.doc ? assignment.doc.title : __('New Assignment'),
},
])
const assignmentOptions = computed(() => {
return [
{ label: 'PDF', value: 'PDF' },
{ label: 'Image', value: 'Image' },
{ label: 'Document', value: 'Document' },
{ label: 'Text', value: 'Text' },
{ label: 'URL', value: 'URL' },
]
})
</script>

View File

@@ -3,20 +3,137 @@
class="flex justify-between sticky top-0 z-10 border-b bg-white px-3 py-2.5 sm:px-5"
>
<Breadcrumbs :items="breadcrumbs" />
<Button variant="solid" @click="submitAssignment()">
{{ __('Save') }}
</Button>
</header>
<div class="overflow-hidden h-[calc(100vh-3.2rem)]">
<Assignment :assignmentID="assignmentID" :submissionName="submissionName" />
<div class="container py-5">
<div
v-if="submissionResource.data"
class="bg-blue-100 p-2 rounded-md leading-5 text-sm italic"
>
{{ __("You've successfully submitted the assignment.") }}
{{
__(
"Once the moderator grades your submission, you'll find the details here."
)
}}
{{ __('Feel free to make edits to your submission if needed.') }}
</div>
<div v-if="assignment.data">
<div>
<div class="text-xl font-semibold hidden">
{{ __('Question') }}
</div>
<div class="text-sm mt-1 hidden">
{{
__('Read the question carefully before attempting the assignment.')
}}
</div>
<div
v-html="assignment.data.question"
class="ProseMirror prose prose-table:table-fixed prose-td:p-2 prose-th:p-2 prose-td:border prose-th:border prose-td:border-gray-300 prose-th:border-gray-300 prose-td:relative prose-th:relative prose-th:bg-gray-100 prose-sm max-w-none !whitespace-normal"
></div>
</div>
<div class="">
<div class="text-xl font-semibold mt-10">
{{ __('Submission') }}
</div>
<div v-if="showUploader()">
<div class="text-sm mt-1 mb-4">
{{ __('Add your assignment as {0}').format(assignment.data.type) }}
</div>
<FileUploader
v-if="!submissionFile"
:fileTypes="getType()"
:validateFile="validateFile"
@success="(file) => saveSubmission(file)"
>
<template
#default="{
file,
uploading,
progress,
uploaded,
message,
error,
total,
success,
openFileSelector,
}"
>
<Button @click="openFileSelector" :loading="uploading">
{{
uploading
? __('Uploading {0}%').format(progress)
: __('Upload File')
}}
</Button>
</template>
</FileUploader>
<div v-else>
<div class="flex items-center">
<div class="border rounded-md p-2 mr-2">
<FileText class="h-5 w-5 stroke-1.5 text-gray-700" />
</div>
<div class="flex flex-col">
<span>
{{ submissionFile.file_name }}
</span>
<span class="text-sm text-gray-500 mt-1">
{{ getFileSize(submissionFile.file_size) }}
</span>
</div>
<X
@click="removeSubmission()"
class="bg-gray-200 rounded-md cursor-pointer stroke-1.5 w-5 h-5 p-1 ml-4"
/>
</div>
</div>
</div>
<div v-else-if="assignment.data.type == 'URL'">
<div class="text-sm mb-4">
{{ __('Enter a URL') }}
</div>
<FormControl v-model="answer" />
</div>
<div v-else>
<div class="text-sm mb-4">
{{ __('Write your answer here') }}
</div>
<TextEditor
:content="answer"
@change="(val) => (answer = 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]"
/>
</div>
</div>
</div>
</div>
</template>
<script setup>
import { Breadcrumbs, createResource } from 'frappe-ui'
import { computed, inject, onMounted } from 'vue'
import Assignment from '@/components/Assignment.vue'
import {
Breadcrumbs,
createResource,
FileUploader,
Button,
FormControl,
TextEditor,
} from 'frappe-ui'
import { FileText, X } from 'lucide-vue-next'
import { computed, inject, onMounted, ref } from 'vue'
import { showToast, getFileSize } from '../utils'
import { useRouter } from 'vue-router'
const user = inject('$user')
const submissionFile = ref(null)
const answer = ref(null)
const router = useRouter()
const props = defineProps({
assignmentID: {
assignmentName: {
type: String,
required: true,
},
@@ -26,40 +143,186 @@ const props = defineProps({
},
})
const title = createResource({
url: 'frappe.client.get_value',
const assignment = createResource({
url: 'frappe.client.get',
params: {
doctype: 'LMS Assignment',
fieldname: 'title',
filters: {
name: props.assignmentID,
},
name: props.assignmentName,
},
auto: true,
})
const showUploader = () => {
return ['PDF', 'Image', 'Document'].includes(assignment.data?.type)
}
const updateSubmission = createResource({
url: 'frappe.client.set_value',
makeParams(values) {
let fieldname = {}
if (showUploader()) {
fieldname.assignment_attachment = submissionFile.value.file_url
} else {
fieldname.answer = answer.value
}
return {
doctype: 'LMS Assignment Submission',
name: props.submissionName,
fieldname: fieldname,
}
},
})
const imageResource = createResource({
url: 'lms.lms.api.get_file_info',
makeParams(values) {
return {
file_url: values.image,
}
},
auto: false,
onSuccess(data) {
submissionFile.value = data
},
})
const newSubmission = createResource({
url: 'frappe.client.insert',
makeParams(values) {
let doc = {
doctype: 'LMS Assignment Submission',
assignment: props.assignmentName,
member: user.data?.name,
}
if (showUploader()) {
doc.assignment_attachment = submissionFile.value.file_url
} else {
doc.answer = answer.value
}
return {
doc: doc,
}
},
})
const submissionResource = createResource({
url: 'frappe.client.get_value',
params: {
doctype: 'LMS Assignment Submission',
fieldname: showUploader() ? 'assignment_attachment' : 'answer',
filters: {
name: props.submissionName,
},
},
onSuccess(data) {
if (data.assignment_attachment)
imageResource.reload({ image: data.assignment_attachment })
if (data.answer) answer.value = data.answer
},
})
onMounted(() => {
if (!user.data) {
window.location.href = '/login'
}
if (props.submissionName != 'new') {
submissionResource.reload()
}
})
const submitAssignment = () => {
if (props.submissionName != 'new') {
updateSubmission.submit(
{},
{
onSuccess(data) {
showToast('Success', 'Submission updated successfully.', 'check')
},
onError(err) {
showToast('Error', err.messages?.[0] || err, 'x')
},
}
)
} else {
addNewSubmission()
}
}
const addNewSubmission = () => {
newSubmission.submit(
{},
{
onSuccess(data) {
showToast('Success', 'Assignment submitted successfully.', 'check')
router.push({
name: 'AssignmentSubmission',
params: {
assignmentName: props.assignmentName,
submissionName: data.name,
},
})
},
onError(err) {
showToast('Error', err.messages?.[0] || err, 'x')
},
}
)
}
const breadcrumbs = computed(() => {
let crumbs = [
{
label: 'Submissions',
route: { name: 'AssignmentSubmissionList' },
label: 'Assignment',
},
{
label: title.data?.title,
label: assignment.data?.title,
route: {
name: 'AssignmentSubmission',
params: {
assignmentID: props.assignmentID,
assignmentName: assignment.data?.name,
},
},
},
]
return crumbs
})
const saveSubmission = (file) => {
submissionFile.value = file
}
const getType = () => {
const type = assignment.data?.type
if (type == 'Image') {
return ['image/*']
} else if (type == 'Document') {
return [
'.doc',
'.docx',
'.xml',
'application/msword',
'application/vnd.openxmlformats-officedocument.wordprocessingml.document',
]
} else if (type == 'PDF') {
return ['.pdf']
}
}
const validateFile = (file) => {
let type = assignment.data?.type
let extension = file.name.split('.').pop().toLowerCase()
if (type == 'Image' && !['jpg', 'jpeg', 'png'].includes(extension)) {
return 'Only image file is allowed.'
} else if (
type == 'Document' &&
!['doc', 'docx', 'xml'].includes(extension)
) {
return 'Only document file is allowed.'
} else if (type == 'PDF' && !['pdf'].includes(extension)) {
return 'Only PDF file is allowed.'
}
}
const removeSubmission = () => {
submissionFile.value = null
}
</script>

View File

@@ -1,217 +0,0 @@
<template>
<header
class="sticky top-0 z-10 flex items-center justify-between border-b bg-white px-3 py-2.5 sm:px-5"
>
<Breadcrumbs :items="breadcrumbs" />
</header>
<div class="md:w-3/4 md:mx-auto py-5 mx-5">
<div class="grid grid-cols-3 gap-5 mb-5">
<Link
doctype="LMS Assignment"
v-model="assignmentID"
:placeholder="__('Assignment')"
/>
<Link doctype="User" v-model="member" :placeholder="__('Member')" />
<FormControl
v-model="status"
type="select"
:options="statusOptions"
:placeholder="__('Status')"
/>
</div>
<ListView
v-if="submissions.loading || submissions.data?.length"
:columns="submissionColumns"
:rows="submissions.data"
rowKey="name"
>
<ListHeader
class="mb-2 grid items-center space-x-4 rounded bg-gray-100 p-2"
>
<ListHeaderItem :item="item" v-for="item in submissionColumns" />
</ListHeader>
<ListRows>
<router-link
v-for="row in submissions.data"
:to="{
name: 'AssignmentSubmission',
params: {
assignmentID: row.assignment,
submissionName: row.name,
},
}"
>
<ListRow :row="row">
<template #default="{ column, item }">
<ListRowItem :item="row[column.key]" :align="column.align">
<div v-if="column.key == 'status'">
<Badge :theme="getStatusTheme(row[column.key])">
{{ row[column.key] }}
</Badge>
</div>
<div v-else>
{{ row[column.key] }}
</div>
</ListRowItem>
</template>
</ListRow>
</router-link>
</ListRows>
</ListView>
<div
v-else
class="text-center p-5 text-gray-600 mt-52 w-3/4 md:w-1/2 mx-auto space-y-2"
>
<Pencil class="size-8 mx-auto stroke-1 text-gray-500" />
<div class="text-xl font-medium">
{{ __('No submissions') }}
</div>
<div class="leading-5">
{{ __('There are no submissions for this assignment.') }}
</div>
</div>
</div>
</template>
<script setup>
import {
Badge,
Breadcrumbs,
createListResource,
FormControl,
ListView,
ListHeader,
ListHeaderItem,
ListRows,
ListRow,
ListRowItem,
} from 'frappe-ui'
import { computed, inject, onMounted, ref, watch } from 'vue'
import { useRouter } from 'vue-router'
import { Pencil } from 'lucide-vue-next'
import Link from '@/components/Controls/Link.vue'
const user = inject('$user')
const dayjs = inject('$dayjs')
const router = useRouter()
const assignmentID = ref('')
const member = ref('')
const status = ref('')
onMounted(() => {
if (!user.data?.is_instructor && !user.data?.is_moderator) {
router.push({ name: 'Courses' })
}
assignmentID.value = router.currentRoute.value.query.assignmentID
member.value = router.currentRoute.value.query.member
status.value = router.currentRoute.value.query.status
reloadSubmissions()
})
const getAssignmentFilters = () => {
let filters = {}
if (assignmentID.value) {
filters.assignment = assignmentID.value
}
if (member.value) {
filters.member = member.value
}
if (status.value) {
filters.status = status.value
}
return filters
}
const submissions = createListResource({
doctype: 'LMS Assignment Submission',
fields: [
'name',
'assignment',
'assignment_title',
'member_name',
'creation',
'status',
],
orderBy: 'creation desc',
transform(data) {
return data.map((row) => {
return {
...row,
creation: dayjs(row.creation).fromNow(),
}
})
},
})
// watch changes in assignmentID, member, and status and if changes in any then reload submissions. Also update the url query params for the same
watch([assignmentID, member, status], () => {
router.push({
query: {
assignmentID: assignmentID.value,
member: member.value,
status: status.value,
},
})
reloadSubmissions()
})
const reloadSubmissions = () => {
submissions.update({
filters: getAssignmentFilters(),
})
submissions.reload()
}
const submissionColumns = computed(() => {
return [
{
label: 'Member',
key: 'member_name',
width: 1,
},
{
label: 'Assignment',
key: 'assignment_title',
width: 2,
},
{
label: 'Submitted',
key: 'creation',
width: 1,
align: 'left',
},
{
label: 'Status',
key: 'status',
width: 1,
align: 'center',
},
]
})
const statusOptions = computed(() => {
return [
{ label: '', value: '' },
{ label: 'Pass', value: 'Pass' },
{ label: 'Fail', value: 'Fail' },
{ label: 'Not Graded', value: 'Not Graded' },
]
})
const getStatusTheme = (status) => {
if (status === 'Pass') {
return 'green'
} else if (status === 'Not Graded') {
return 'blue'
} else {
return 'red'
}
}
const breadcrumbs = computed(() => {
return [
{
label: 'Assignment Submissions',
},
]
})
</script>

View File

@@ -1,187 +0,0 @@
<template>
<header
class="sticky top-0 z-10 flex items-center justify-between border-b bg-white px-3 py-2.5 sm:px-5"
>
<Breadcrumbs :items="breadcrumbs" />
<router-link
:to="{
name: 'AssignmentForm',
params: {
assignmentID: 'new',
},
}"
>
<Button variant="solid">
<template #prefix>
<Plus class="w-4 h-4" />
</template>
{{ __('New') }}
</Button>
</router-link>
</header>
<div class="md:w-3/4 md:mx-auto py-5 mx-5">
<div class="grid grid-cols-3 gap-5 mb-5">
<FormControl v-model="titleFilter" :placeholder="__('Search by title')" />
<FormControl
v-model="typeFilter"
type="select"
:options="assignmentTypes"
:placeholder="__('Type')"
/>
</div>
<ListView
v-if="assignments.data?.length"
:columns="assignmentColumns"
:rows="assignments.data"
row-key="name"
:options="{
showTooltip: false,
selectable: false,
getRowRoute: (row) => ({
name: 'AssignmentForm',
params: {
assignmentID: row.name,
},
}),
}"
>
</ListView>
<div
v-else
class="text-center p-5 text-gray-600 mt-52 w-3/4 md:w-1/2 mx-auto space-y-2"
>
<Pencil class="size-10 mx-auto stroke-1 text-gray-500" />
<div class="text-xl font-medium">
{{ __('No assignments found') }}
</div>
<div class="leading-5">
{{
__(
'You have not created any assignments yet. To create a new assignment, click on the "New" button above.'
)
}}
</div>
</div>
<div
v-if="assignments.data && assignments.hasNextPage"
class="flex justify-center my-5"
>
<Button @click="assignments.next()">
{{ __('Load More') }}
</Button>
</div>
</div>
</template>
<script setup>
import {
Breadcrumbs,
Button,
createListResource,
FormControl,
ListView,
} from 'frappe-ui'
import { computed, inject, onMounted, ref, watch } from 'vue'
import { Plus, Pencil } from 'lucide-vue-next'
import { useRouter } from 'vue-router'
const user = inject('$user')
const dayjs = inject('$dayjs')
const titleFilter = ref('')
const typeFilter = ref('')
const router = useRouter()
onMounted(() => {
if (!user.data?.is_moderator && !user.data?.is_instructor) {
router.push({ name: 'Courses' })
}
titleFilter.value = router.currentRoute.value.query.title
typeFilter.value = router.currentRoute.value.query.type
})
watch([titleFilter, typeFilter], () => {
router.push({
query: {
title: titleFilter.value,
type: typeFilter.value,
},
})
reloadAssignments()
})
const reloadAssignments = () => {
assignments.update({
filters: assignmentFilter.value,
})
assignments.reload()
}
const assignmentFilter = computed(() => {
let filters = {}
if (titleFilter.value) {
filters.title = ['like', `%${titleFilter.value}%`]
}
if (typeFilter.value) {
filters.type = typeFilter.value
}
if (!user.data?.is_moderator) {
filters.owner = user.data?.email
}
return filters
})
const assignments = createListResource({
doctype: 'LMS Assignment',
fields: ['name', 'title', 'type', 'creation'],
orderBy: 'modified desc',
cache: ['assignments'],
transform(data) {
return data.map((row) => {
return {
...row,
creation: dayjs(row.creation).fromNow(),
}
})
},
})
const assignmentColumns = computed(() => {
return [
{
label: __('Title'),
key: 'title',
width: 2,
},
{
label: __('Type'),
key: 'type',
width: 1,
align: 'left',
},
{
label: __('Created'),
key: 'creation',
width: 1,
align: 'center',
},
]
})
const assignmentTypes = computed(() => {
let types = ['', 'Document', 'Image', 'PDF', 'URL', 'Text']
return types.map((type) => {
return {
label: __(type),
value: type,
}
})
})
const breadcrumbs = computed(() => [
{
label: 'Assignments',
route: { name: 'Assignments' },
},
])
</script>

View File

@@ -4,30 +4,18 @@
class="sticky top-0 z-10 flex items-center justify-between border-b bg-white px-3 py-2.5 sm:px-5"
>
<Breadcrumbs class="h-7" :items="breadcrumbs" />
<div class="flex items-center space-x-2">
<Button
v-if="user.data?.is_moderator"
@click="openCertificateDialog = true"
>
{{ __('Generate Certificates') }}
</Button>
<Button v-if="user.data?.is_moderator" @click="openAnnouncementModal()">
<span>
{{ __('Make an Announcement') }}
</span>
<template #suffix>
<SendIcon class="h-4 stroke-1.5" />
</template>
</Button>
</div>
<Button v-if="user.data?.is_moderator" @click="openAnnouncementModal()">
<span>
{{ __('Make an Announcement') }}
</span>
<template #suffix>
<SendIcon class="h-4 stroke-1.5" />
</template>
</Button>
</header>
<div v-if="batch.data" class="grid grid-cols-[70%,30%] h-screen">
<div class="border-r">
<Tabs
v-model="tabIndex"
:tabs="tabs"
tablistClass="overflow-y-hidden bg-white"
>
<div class="border-r-2">
<Tabs v-model="tabIndex" :tabs="tabs" tablistClass="overflow-y-hidden">
<template #tab="{ tab, selected }" class="overflow-x-hidden">
<div>
<button
@@ -59,15 +47,15 @@
<div v-if="tab.label == 'Courses'">
<BatchCourses :batch="batch.data.name" />
</div>
<div v-else-if="tab.label == 'Dashboard' && isStudent">
<BatchDashboard :batch="batch" :isStudent="isStudent" />
</div>
<div v-else-if="tab.label == 'Dashboard'">
<BatchStudents :batch="batch.data" />
<BatchDashboard :batch="batch" :isStudent="isStudent" />
</div>
<div v-else-if="tab.label == 'Live Class'">
<LiveClass :batch="batch.data.name" />
</div>
<div v-else-if="tab.label == 'Students'">
<BatchStudents :batch="batch.data.name" />
</div>
<div v-else-if="tab.label == 'Assessments'">
<Assessments :batch="batch.data.name" />
</div>
@@ -89,12 +77,12 @@
</Tabs>
</div>
<div class="p-5">
<div class="text-xl font-semibold mb-2">
<div class="text-2xl font-semibold mb-2">
{{ batch.data.title }}
</div>
<div v-html="batch.data.description" class="leading-5 mb-2"></div>
<div class="flex items-center avatar-group overlap mb-5">
<div class="flex avatar-group overlap mb-5">
<div
class="h-6 mr-1"
:class="{
@@ -177,7 +165,6 @@
</div>
</div>
</div>
<BulkCertificates v-model="openCertificateDialog" :batch="batch.data" />
</template>
<script setup>
import { Breadcrumbs, Button, createResource, Tabs, Badge } from 'frappe-ui'
@@ -195,7 +182,6 @@ import {
SendIcon,
MessageCircle,
Globe,
ShieldCheck,
} from 'lucide-vue-next'
import { formatTime, updateDocumentTitle } from '@/utils'
import BatchDashboard from '@/components/BatchDashboard.vue'
@@ -207,11 +193,9 @@ import Announcements from '@/components/Annoucements.vue'
import AnnouncementModal from '@/components/Modals/AnnouncementModal.vue'
import Discussions from '@/components/Discussions.vue'
import DateRange from '@/components/Common/DateRange.vue'
import BulkCertificates from '@/components/Modals/BulkCertificates.vue'
const user = inject('$user')
const showAnnouncementModal = ref(false)
const openCertificateDialog = ref(false)
const props = defineProps({
batchName: {
@@ -230,7 +214,7 @@ const batch = createResource({
})
const breadcrumbs = computed(() => {
let crumbs = [{ label: 'Batches', route: { name: 'Batches' } }]
let crumbs = [{ label: 'All Batches', route: { name: 'Batches' } }]
if (!isStudent.value) {
crumbs.push({
label: 'Details',
@@ -252,7 +236,7 @@ const breadcrumbs = computed(() => {
const isStudent = computed(() => {
return (
user?.data &&
batch.data?.students?.length &&
batch.data?.students.length &&
batch.data?.students.includes(user.data.name)
)
})
@@ -260,33 +244,34 @@ const isStudent = computed(() => {
const tabIndex = ref(0)
const tabs = computed(() => {
let batchTabs = []
batchTabs.push({
label: 'Dashboard',
icon: LayoutDashboard,
})
batchTabs.push({
label: 'Courses',
icon: BookOpen,
})
batchTabs.push({
label: 'Live Class',
icon: Laptop,
})
if (isStudent.value) {
batchTabs.push({
label: 'Dashboard',
icon: LayoutDashboard,
})
}
if (user.data?.is_moderator) {
batchTabs.push({
label: 'Students',
icon: Contact2,
})
batchTabs.push({
label: 'Assessments',
icon: BookOpenCheck,
})
}
batchTabs.push({
label: 'Live Class',
icon: Laptop,
})
batchTabs.push({
label: 'Courses',
icon: BookOpen,
})
batchTabs.push({
label: 'Announcements',
icon: Mail,
})
batchTabs.push({
label: 'Discussions',
icon: MessageCircle,

View File

@@ -137,7 +137,7 @@ const courses = createResource({
})
const breadcrumbs = computed(() => {
let items = [{ label: 'Batches', route: { name: 'Batches' } }]
let items = [{ label: 'All Batches', route: { name: 'Batches' } }]
items.push({
label: batch?.data?.title,
route: { name: 'BatchDetail', params: { batchName: batch?.data?.name } },

View File

@@ -15,11 +15,7 @@
</div>
<div class="grid grid-cols-2 gap-10 mb-4 space-y-2">
<div>
<FormControl
v-model="batch.title"
:label="__('Title')"
:required="true"
/>
<FormControl v-model="batch.title" :label="__('Title')" />
</div>
<div class="flex flex-col space-y-2">
<FormControl
@@ -36,73 +32,61 @@
</div>
</div>
<div class="mb-4">
<div class="text-xs text-gray-600 mb-2">
{{ __('Meta Image') }}
</div>
<FileUploader
v-if="!batch.image"
:fileTypes="['image/*']"
:validateFile="validateFile"
@success="(file) => saveImage(file)"
>
<template v-slot="{ file, progress, uploading, openFileSelector }">
<div class="flex items-center">
<div class="border rounded-md w-fit py-5 px-20">
<Image class="size-5 stroke-1 text-gray-700" />
</div>
<div class="ml-4">
<Button @click="openFileSelector">
{{ __('Upload') }}
<div>
<FileUploader
v-if="!batch.image"
class="mt-4"
:fileTypes="['image/*']"
:validateFile="validateFile"
@success="(file) => saveImage(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 class="mt-2 text-gray-600 text-sm">
{{
__(
'Appears when the batch URL is shared on any online platform'
)
}}
</div>
</div>
</template>
</FileUploader>
<div v-else class="mb-4">
<div class="text-xs text-gray-600 mb-1">
{{ __('Meta Image') }}
</div>
</template>
</FileUploader>
<div v-else class="mb-4">
<div class="flex items-center">
<img :src="batch.image.file_url" class="border rounded-md w-40" />
<div class="ml-4">
<Button @click="removeImage()">
{{ __('Remove') }}
</Button>
<div class="mt-2 text-gray-600 text-sm">
{{
__(
'Appears when the batch URL is shared on any online platform'
)
}}
<div class="flex items-center">
<div class="border rounded-md p-2 mr-2">
<FileText class="h-5 w-5 stroke-1.5 text-gray-700" />
</div>
<div class="flex flex-col">
<span>
{{ batch.image.file_name }}
</span>
<span class="text-sm text-gray-500 mt-1">
{{ getFileSize(batch.image.file_size) }}
</span>
</div>
<X
@click="removeImage()"
class="bg-gray-200 rounded-md cursor-pointer stroke-1.5 w-5 h-5 p-1 ml-4"
/>
</div>
</div>
</div>
<MultiSelect
v-model="instructors"
doctype="User"
:label="__('Instructors')"
/>
</div>
<MultiSelect
v-model="instructors"
doctype="User"
:label="__('Instructors')"
:required="true"
:filters="{ ignore_user_type: 1 }"
/>
<div class="mb-4">
<FormControl
v-model="batch.description"
:label="__('Description')"
type="textarea"
class="my-4"
:placeholder="__('Short description of the batch')"
:required="true"
/>
<div>
<label class="block text-sm text-gray-600 mb-1">
{{ __('Batch Details') }}
<span class="text-red-500">*</span>
</label>
<TextEditor
:content="batch.batch_details"
@@ -124,14 +108,12 @@
:label="__('Start Date')"
type="date"
class="mb-4"
:required="true"
/>
<FormControl
v-model="batch.end_date"
:label="__('End Date')"
type="date"
class="mb-4"
:required="true"
/>
</div>
<div>
@@ -140,22 +122,18 @@
:label="__('Start Time')"
type="time"
class="mb-4"
:required="true"
/>
<FormControl
v-model="batch.end_time"
:label="__('End Time')"
type="time"
class="mb-4"
:required="true"
/>
<FormControl
v-model="batch.timezone"
:label="__('Timezone')"
type="text"
:placeholder="__('Example: IST (+5:30)')"
class="mb-4"
:required="true"
/>
</div>
</div>
@@ -171,7 +149,6 @@
:label="__('Seat Count')"
type="number"
class="mb-4"
:placeholder="__('Number of seats available')"
/>
<FormControl
v-model="batch.evaluation_end_date"
@@ -251,11 +228,11 @@ import {
createResource,
} from 'frappe-ui'
import Link from '@/components/Controls/Link.vue'
import { useRouter } from 'vue-router'
import { showToast } from '@/utils'
import { Image } from 'lucide-vue-next'
import { capture } from '@/telemetry'
import MultiSelect from '@/components/Controls/MultiSelect.vue'
import { useRouter } from 'vue-router'
import { getFileSize, showToast } from '../utils'
import { X, FileText } from 'lucide-vue-next'
import { capture } from '@/telemetry'
const router = useRouter()
const user = inject('$user')
@@ -345,10 +322,6 @@ const batchDetail = createResource({
data.instructors.forEach((instructor) => {
instructors.value.push(instructor.instructor)
})
} else if (['start_time', 'end_time'].includes(key)) {
let [hours, minutes, seconds] = data[key].split(':')
hours = hours.length == 1 ? '0' + hours : hours
batch[key] = `${hours}:${minutes}`
} else if (Object.hasOwn(batch, key)) batch[key] = data[key]
})
let checkboxes = ['published', 'paid_batch', 'allow_self_enrollment']

View File

@@ -40,7 +40,6 @@
{{ __('Loading Batches...') }}
</div>
<Tabs
v-if="hasBatches"
v-model="tabIndex"
:tabs="makeTabs"
tablistClass="overflow-x-visible flex-wrap !gap-3 md:flex-nowrap"
@@ -80,63 +79,24 @@
<BatchCard :batch="batch" />
</router-link>
</div>
<div v-else class="p-5 italic text-gray-500">
{{ __('No {0} batches').format(tab.label.toLowerCase()) }}
<div
v-else
class="grid flex-1 place-items-center text-xl font-medium text-gray-500"
>
<div class="flex flex-col items-center justify-center mt-4">
<div>
{{ __('No {0} batches found').format(tab.label.toLowerCase()) }}
</div>
</div>
</div>
</template>
</Tabs>
<div
v-else-if="
!batches.loading &&
!hasBatches &&
(user.data?.is_instructor || user.data?.is_moderator)
"
class="grid grid-cols-3 p-5"
>
<router-link
:to="{
name: 'BatchForm',
params: {
batchName: 'new',
},
}"
>
<div class="bg-gray-50 py-32 px-5 rounded-md">
<div class="flex flex-col items-center text-center space-y-2">
<Plus
class="size-10 stroke-1 text-gray-800 p-1 rounded-full border bg-white"
/>
<div class="font-medium">
{{ __('Create a Batch') }}
</div>
<span class="text-gray-700 text-sm leading-4">
{{ __('You can link courses and assessments to it.') }}
</span>
</div>
</div>
</router-link>
</div>
<div
v-else-if="!batches.loading && !hasBatches"
class="text-center p-5 text-gray-600 mt-52 w-3/4 md:w-1/2 mx-auto space-y-2"
>
<BookOpen class="size-10 mx-auto stroke-1 text-gray-500" />
<div class="text-xl font-medium">
{{ __('No batches found') }}
</div>
<div>
{{
__(
'There are no batches available at the moment. Keep an eye out, fresh learning experiences are on the way soon!'
)
}}
</div>
</div>
</div>
</div>
</template>
<script setup>
import {
createListResource,
createResource,
Breadcrumbs,
Button,
@@ -144,14 +104,13 @@ import {
Badge,
Select,
} from 'frappe-ui'
import { BookOpen, Plus } from 'lucide-vue-next'
import { Plus } from 'lucide-vue-next'
import BatchCard from '@/components/BatchCard.vue'
import { inject, ref, computed, onMounted, watch } from 'vue'
import { updateDocumentTitle } from '@/utils'
const user = inject('$user')
const currentCategory = ref(null)
const hasBatches = ref(false)
onMounted(() => {
let queries = new URLSearchParams(location.search)
@@ -160,10 +119,10 @@ onMounted(() => {
}
})
const batches = createResource({
const batches = createListResource({
doctype: 'LMS Batch',
url: 'lms.lms.utils.get_batches',
cache: ['batches', user.data?.email],
cache: ['batches', user?.data?.email],
auto: true,
})
@@ -224,14 +183,6 @@ const addToTabs = (label) => {
})
}
watch(batches, () => {
Object.keys(batches.data).forEach((key) => {
if (batches.data[key].length) {
hasBatches.value = true
}
})
})
watch(
() => currentCategory.value,
() => {

View File

@@ -16,18 +16,16 @@
</div>
<div class="flex items-center">
<Tooltip
v-if="parseInt(course.data.rating) > 0"
v-if="course.data.avg_rating"
:text="__('Average Rating')"
class="flex items-center"
>
<Star class="h-5 w-5 text-gray-100 fill-orange-500" />
<span class="ml-1">
{{ course.data.rating }}
{{ course.data.avg_rating }}
</span>
</Tooltip>
<span v-if="parseInt(course.data.rating) > 0" class="mx-3"
>&middot;</span
>
<span v-if="course.data.avg_rating" class="mx-3">&middot;</span>
<Tooltip
v-if="course.data.enrollment_count"
:text="__('Enrolled Students')"
@@ -69,18 +67,14 @@
<CourseCardOverlay :course="course" class="md:hidden mb-4" />
<div
v-html="course.data.description"
class="ProseMirror prose prose-table:table-fixed prose-td:p-2 prose-th:p-2 prose-td:border prose-th:border prose-td:border-gray-300 prose-th:border-gray-300 prose-td:relative prose-th:relative prose-th:bg-gray-100 prose-sm max-w-none !whitespace-normal"
class="course-description"
></div>
<div class="mt-10">
<CourseOutline
:title="__('Course Outline')"
:courseName="course.data.name"
:showOutline="true"
/>
<CourseOutline :courseName="course.data.name" :showOutline="true" />
</div>
<CourseReviews
:courseName="course.data.name"
:avg_rating="course.data.rating"
:avg_rating="course.data.avg_rating"
:membership="course.data.membership"
/>
</div>
@@ -119,10 +113,10 @@ const course = createResource({
})
const breadcrumbs = computed(() => {
let items = [{ label: 'Courses', route: { name: 'Courses' } }]
let items = [{ label: 'All Courses', route: { name: 'Courses' } }]
items.push({
label: course?.data?.title,
route: { name: 'CourseDetail', params: { courseName: course?.data?.name } },
route: { name: 'CourseDetail', params: { course: course?.data?.name } },
})
return items
})
@@ -137,6 +131,26 @@ const pageMeta = computed(() => {
updateDocumentTitle(pageMeta)
</script>
<style>
.course-description p {
margin-bottom: 1rem;
line-height: 1.7;
}
.course-description li {
line-height: 1.7;
}
.course-description ol {
list-style: auto;
margin: revert;
padding: revert;
}
.course-description ul {
list-style: disc;
margin: revert;
padding: revert;
}
.avatar-group {
display: inline-flex;
align-items: center;

View File

@@ -7,14 +7,6 @@
>
<Breadcrumbs class="h-7" :items="breadcrumbs" />
<div class="flex items-center mt-3 md:mt-0">
<Button v-if="courseResource.data?.name" @click="trashCourse()">
<template #prefix>
<Trash2 class="w-4 h-4 stroke-1.5" />
</template>
<span>
{{ __('Delete') }}
</span>
</Button>
<Button variant="solid" @click="submitCourse()" class="ml-2">
<span>
{{ __('Save') }}
@@ -31,23 +23,15 @@
v-model="course.title"
:label="__('Title')"
class="mb-4"
:required="true"
/>
<FormControl
v-model="course.short_introduction"
:label="__('Short Introduction')"
:placeholder="
__(
'A one line introduction to the course that appears on the course card'
)
"
class="mb-4"
:required="true"
/>
<div class="mb-4">
<div class="mb-1.5 text-sm text-gray-600">
<div class="mb-1.5 text-sm text-gray-700">
{{ __('Course Description') }}
<span class="text-red-500">*</span>
</div>
<TextEditor
:content="course.description"
@@ -57,62 +41,49 @@
editorClass="prose-sm max-w-none border-b border-x bg-gray-100 rounded-b-md py-1 px-2 min-h-[7rem]"
/>
</div>
<div class="mb-4">
<div class="text-xs text-gray-600 mb-2">
{{ __('Course Image') }}
<span class="text-red-500">*</span>
</div>
<FileUploader
v-if="!course.course_image"
:fileTypes="['image/*']"
:validateFile="validateFile"
@success="(file) => saveImage(file)"
<FileUploader
v-if="!course.course_image"
:fileTypes="['image/*']"
:validateFile="validateFile"
@success="(file) => saveImage(file)"
>
<template
v-slot="{ file, progress, uploading, openFileSelector }"
>
<template
v-slot="{ file, progress, uploading, openFileSelector }"
>
<div class="flex items-center">
<div class="border rounded-md w-fit py-5 px-20">
<Image class="size-5 stroke-1 text-gray-700" />
</div>
<div class="ml-4">
<Button @click="openFileSelector">
{{ __('Upload') }}
</Button>
<div class="mt-2 text-gray-600 text-sm">
{{
__('Appears on the course card in the course list')
}}
</div>
</div>
</div>
</template>
</FileUploader>
<div v-else class="mb-4">
<div class="flex items-center">
<img
:src="course.course_image.file_url"
class="border rounded-md w-40"
/>
<div class="ml-4">
<Button @click="removeImage()">
{{ __('Remove') }}
</Button>
<div class="mt-2 text-gray-600 text-sm">
{{ __('Appears on the course card in the course list') }}
</div>
</div>
<div class="mb-4">
<Button @click="openFileSelector" :loading="uploading">
{{
uploading ? `Uploading ${progress}%` : 'Upload an image'
}}
</Button>
</div>
</template>
</FileUploader>
<div v-else class="mb-4">
<div class="text-xs text-gray-600 mb-1">
{{ __('Course Image') }}
</div>
<div class="flex items-center">
<div class="border rounded-md p-2 mr-2">
<FileText class="h-5 w-5 stroke-1.5 text-gray-700" />
</div>
<div class="flex flex-col">
<span>
{{ course.course_image.file_name }}
</span>
<span class="text-sm text-gray-500 mt-1">
{{ getFileSize(course.course_image.file_size) }}
</span>
</div>
<X
@click="removeImage()"
class="bg-gray-200 rounded-md cursor-pointer stroke-1.5 w-5 h-5 p-1 ml-4"
/>
</div>
</div>
<FormControl
v-model="course.video_link"
:label="__('Preview Video')"
:placeholder="
__(
'Paste the youtube link of a short video introducing the course'
)
"
class="mb-4"
/>
<div class="mb-4">
@@ -133,8 +104,6 @@
</div>
<FormControl
v-model="newTag"
:placeholder="__('Add a keyword and then press enter')"
class="w-72"
@keyup.enter="updateTags()"
id="tags"
/>
@@ -152,8 +121,6 @@
v-model="instructors"
doctype="User"
:label="__('Instructors')"
:filters="{ ignore_user_type: 1 }"
:required="true"
/>
</div>
<div class="container border-t">
@@ -163,7 +130,7 @@
<div class="grid grid-cols-3 gap-10 mb-4">
<div
v-if="user.data?.is_moderator"
class="flex flex-col space-y-4"
class="flex flex-col space-y-3"
>
<FormControl
type="checkbox"
@@ -256,11 +223,15 @@ import {
ref,
reactive,
watch,
getCurrentInstance,
} from 'vue'
import { showToast, updateDocumentTitle } from '@/utils'
import {
convertToTitleCase,
showToast,
getFileSize,
updateDocumentTitle,
} from '@/utils'
import Link from '@/components/Controls/Link.vue'
import { Image, Trash2, X } from 'lucide-vue-next'
import { FileText, X } from 'lucide-vue-next'
import { useRouter } from 'vue-router'
import CourseOutline from '@/components/CourseOutline.vue'
import MultiSelect from '@/components/Controls/MultiSelect.vue'
@@ -272,8 +243,6 @@ const newTag = ref('')
const router = useRouter()
const instructors = ref([])
const settingsStore = useSettings()
const app = getCurrentInstance()
const { $dialog } = app.appContext.config.globalProperties
const props = defineProps({
courseName: {
@@ -288,7 +257,6 @@ const course = reactive({
video_link: '',
course_image: null,
tags: '',
category: '',
published: false,
published_on: '',
featured: false,
@@ -435,9 +403,6 @@ const submitCourse = () => {
onSuccess(data) {
capture('course_created')
showToast('Success', 'Course created successfully', 'check')
if (!settingsStore.onboardingDetails.data?.is_onboarded) {
settingsStore.onboardingDetails.reload()
}
router.push({
name: 'CourseForm',
params: { courseName: data.name },
@@ -450,37 +415,23 @@ const submitCourse = () => {
}
}
const deleteCourse = createResource({
url: 'lms.lms.api.delete_course',
makeParams(values) {
return {
course: props.courseName,
const validateMandatoryFields = () => {
const mandatory_fields = [
'title',
'short_introduction',
'description',
'video_link',
'course_image',
]
for (const field of mandatory_fields) {
if (!course[field]) {
let fieldLabel = convertToTitleCase(field.split('_').join(' '))
return `${fieldLabel} is mandatory`
}
},
onSuccess() {
showToast(__('Success'), __('Course deleted successfully'), 'check')
router.push({ name: 'Courses' })
},
})
const trashCourse = () => {
$dialog({
title: __('Delete Course'),
message: __(
'Deleting the course will also delete all its chapters and lessons. Are you sure you want to delete this course?'
),
actions: [
{
label: __('Delete'),
theme: 'red',
variant: 'solid',
onClick(close) {
deleteCourse.submit()
close()
},
},
],
})
}
if (course.paid_course && (!course.course_price || !course.currency)) {
return __('Course price and currency are mandatory for paid courses')
}
}
watch(

View File

@@ -8,7 +8,7 @@
:items="[{ label: __('Courses'), route: { name: 'Courses' } }]"
/>
<div class="flex space-x-2 justify-end">
<div class="w-40 md:w-44">
<div class="w-46 md:w-44">
<FormControl
v-if="categories.data?.length"
type="select"
@@ -30,7 +30,6 @@
</FormControl>
</div>
<router-link
v-if="user.data?.is_moderator || user.data?.is_instructor"
:to="{
name: 'CourseForm',
params: {
@@ -38,7 +37,7 @@
},
}"
>
<Button variant="solid">
<Button v-if="user.data?.is_moderator" variant="solid">
<template #prefix>
<Plus class="h-4 w-4" />
</template>
@@ -49,7 +48,6 @@
</header>
<div class="">
<Tabs
v-if="hasCourses"
v-model="tabIndex"
tablistClass="overflow-x-visible flex-wrap !gap-3 md:flex-nowrap"
:tabs="makeTabs"
@@ -103,102 +101,47 @@
<CourseCard :course="course" />
</router-link>
</div>
<div v-else class="p-5 italic text-gray-500">
{{ __('No {0} courses').format(tab.label.toLowerCase()) }}
<div
v-else
class="grid flex-1 place-items-center text-xl font-medium text-gray-500"
>
<div class="flex flex-col items-center justify-center mt-4">
<div>
{{ __('No {0} courses found').format(tab.label.toLowerCase()) }}
</div>
</div>
</div>
</template>
</Tabs>
<div
v-else-if="
!courses.loading &&
(user.data?.is_moderator || user.data?.is_instructor)
"
class="grid grid-cols-3 p-5"
>
<router-link
:to="{
name: 'CourseForm',
params: {
courseName: 'new',
},
}"
>
<div class="bg-gray-50 py-32 px-5 rounded-md">
<div class="flex flex-col items-center text-center space-y-2">
<Plus
class="size-10 stroke-1 text-gray-800 p-1 rounded-full border bg-white"
/>
<div class="font-medium">
{{ __('Create a Course') }}
</div>
<span class="text-gray-700 text-sm leading-4">
{{ __('You can add chapters and lessons to it.') }}
</span>
</div>
</div>
</router-link>
</div>
<div
v-else-if="!courses.loading && !hasCourses"
class="text-center p-5 text-gray-600 mt-52 w-3/4 md:w-1/2 mx-auto space-y-2"
>
<BookOpen class="size-10 mx-auto stroke-1 text-gray-500" />
<div class="text-xl font-medium">
{{ __('No courses found') }}
</div>
<div class="leading-5">
{{
__(
'There are no courses available at the moment. Keep an eye out, fresh learning experiences are on the way soon!'
)
}}
</div>
</div>
</div>
</div>
</template>
<script setup>
import {
Badge,
Breadcrumbs,
Button,
call,
createResource,
FormControl,
Tabs,
Badge,
Button,
FormControl,
createResource,
} from 'frappe-ui'
import CourseCard from '@/components/CourseCard.vue'
import { BookOpen, Plus, Search } from 'lucide-vue-next'
import { Plus, Search } from 'lucide-vue-next'
import { ref, computed, inject, onMounted, watch } from 'vue'
import { updateDocumentTitle } from '@/utils'
import { useRouter } from 'vue-router'
import { useSettings } from '@/stores/settings'
const user = inject('$user')
const searchQuery = ref('')
const currentCategory = ref(null)
const hasCourses = ref(false)
const router = useRouter()
const settings = useSettings()
onMounted(() => {
checkLearningPath()
let queries = new URLSearchParams(location.search)
if (queries.has('category')) {
currentCategory.value = queries.get('category')
}
})
const checkLearningPath = () => {
if (
settings.learningPaths.data &&
(!user.data?.is_moderator || !user.data?.is_instructor)
) {
router.push({ name: 'Programs' })
}
}
const courses = createResource({
url: 'lms.lms.utils.get_courses',
cache: ['courses', user.data?.email],
@@ -280,16 +223,6 @@ const categories = createResource({
},
})
watch(courses, () => {
if (courses.data) {
Object.keys(courses.data).forEach((section) => {
if (courses.data[section].length) {
hasCourses.value = true
}
})
}
})
watch(
() => currentCategory.value,
() => {

View File

@@ -19,13 +19,8 @@
v-model="job.job_title"
:label="__('Title')"
class="mb-4"
:required="true"
/>
<FormControl
v-model="job.location"
:label="__('Location')"
:required="true"
/>
<FormControl v-model="job.location" :label="__('Location')" />
</div>
<div>
<FormControl
@@ -34,21 +29,18 @@
type="select"
:options="jobTypes"
class="mb-4"
:required="true"
/>
<FormControl
v-model="job.status"
:label="__('Status')"
type="select"
:options="jobStatuses"
:required="true"
/>
</div>
</div>
<div class="mt-4">
<label class="block text-gray-600 text-xs mb-1">
{{ __('Description') }}
<span class="text-red-500">*</span>
</label>
<TextEditor
:content="job.description"
@@ -69,12 +61,10 @@
v-model="job.company_name"
:label="__('Company Name')"
class="mb-4"
:required="true"
/>
<FormControl
v-model="job.company_website"
:label="__('Company Website')"
:required="true"
/>
</div>
<div>
@@ -82,11 +72,9 @@
v-model="job.company_email_address"
:label="__('Company Email Address')"
class="mb-4"
:required="true"
/>
<label class="block text-gray-600 text-xs mb-1 mt-4">
{{ __('Company Logo') }}
<span class="text-red-500">*</span>
</label>
<FileUploader
v-if="!job.image"

View File

@@ -7,22 +7,7 @@
class="h-7"
:items="[{ label: __('Jobs'), route: { name: 'Jobs' } }]"
/>
<div class="flex space-x-2">
<div class="w-40 md:w-44">
<FormControl
v-model="jobType"
type="select"
:options="jobTypes"
:placeholder="__('Type')"
/>
</div>
<div class="w-28 md:w-36">
<FormControl type="text" placeholder="Search" v-model="searchQuery">
<template #prefix>
<Search class="w-4 h-4 stroke-1.5 text-gray-600" name="search" />
</template>
</FormControl>
</div>
<div class="flex">
<router-link
v-if="user.data?.name"
:to="{
@@ -41,12 +26,9 @@
</router-link>
</div>
</header>
<div v-if="jobsList?.length">
<div class="lg:w-3/4 mx-auto p-5">
<div class="text-xl font-semibold mb-5">
{{ __('Find the perfect job for you') }}
</div>
<div v-for="job in jobsList" class="divide-y">
<div v-if="jobs.data?.length">
<div class="divide-y lg:w-3/4 mx-auto p-5">
<div v-for="job in jobs.data">
<router-link
:to="{
name: 'JobDetail',
@@ -65,22 +47,13 @@
</div>
</template>
<script setup>
import { Button, Breadcrumbs, createResource, FormControl } from 'frappe-ui'
import { Plus, Search } from 'lucide-vue-next'
import { inject, computed, ref, onMounted } from 'vue'
import { Button, Breadcrumbs, createResource } from 'frappe-ui'
import { Plus } from 'lucide-vue-next'
import { inject, computed } from 'vue'
import JobCard from '@/components/JobCard.vue'
import { updateDocumentTitle } from '@/utils'
const user = inject('$user')
const jobType = ref(null)
const searchQuery = ref('')
onMounted(() => {
let queries = new URLSearchParams(location.search)
if (queries.has('type')) {
jobType.value = queries.get('type')
}
})
const jobs = createResource({
url: 'lms.lms.api.get_job_opportunities',
@@ -95,32 +68,5 @@ const pageMeta = computed(() => {
}
})
const jobsList = computed(() => {
let jobData = jobs.data
if (jobType.value && jobType.value != '') {
jobData = jobData.filter((job) => job.type == jobType.value)
}
if (searchQuery.value) {
let query = searchQuery.value.toLowerCase()
jobData = jobData.filter(
(job) =>
job.job_title.toLowerCase().includes(query) ||
job.company_name.toLowerCase().includes(query) ||
job.location.toLowerCase().includes(query)
)
}
return jobData
})
const jobTypes = computed(() => {
return [
'',
{ label: __('Full Time'), value: 'Full Time' },
{ label: __('Part Time'), value: 'Part Time' },
{ label: __('Contract'), value: 'Contract' },
{ label: __('Freelance'), value: 'Freelance' },
]
})
updateDocumentTitle(pageMeta)
</script>

View File

@@ -17,9 +17,14 @@
)
}}
</p>
<Button v-if="user.data" @click="enrollStudent()" variant="solid">
{{ __('Start Learning') }}
</Button>
<router-link
v-if="user.data"
:to="{ name: 'CourseDetail', params: { courseName: courseName } }"
>
<Button variant="solid">
{{ __('Start Learning') }}
</Button>
</router-link>
<Button v-else @click="redirectToLogin()">
{{ __('Login') }}
</Button>
@@ -103,7 +108,7 @@
<span
class="h-6 mr-1"
:class="{
'avatar-group overlap': lesson.data.instructors?.length > 1,
'avatar-group overlap': lesson.data.instructors.length > 1,
}"
>
<UserAvatar
@@ -111,10 +116,7 @@
:user="instructor"
/>
</span>
<CourseInstructors
v-if="lesson.data?.instructors"
:instructors="lesson.data.instructors"
/>
<CourseInstructors :instructors="lesson.data.instructors" />
</div>
<div
v-if="
@@ -149,7 +151,6 @@
class="ProseMirror prose prose-table:table-fixed prose-td:p-2 prose-th:p-2 prose-td:border prose-th:border prose-td:border-gray-300 prose-th:border-gray-300 prose-td:relative prose-th:relative prose-th:bg-gray-100 prose-sm max-w-none !whitespace-normal mt-5"
>
<LessonContent
v-if="lesson.data?.body"
:content="lesson.data.body"
:youtube="lesson.data.youtube"
:quizId="lesson.data.quiz_id"
@@ -193,7 +194,7 @@ import { createResource, Breadcrumbs, Button } from 'frappe-ui'
import { computed, watch, inject, ref, onMounted, onBeforeUnmount } from 'vue'
import CourseOutline from '@/components/CourseOutline.vue'
import UserAvatar from '@/components/UserAvatar.vue'
import { useRouter, useRoute } from 'vue-router'
import { useRoute } from 'vue-router'
import { ChevronLeft, ChevronRight } from 'lucide-vue-next'
import Discussions from '@/components/Discussions.vue'
import { getEditorTools, updateDocumentTitle } from '../utils'
@@ -203,7 +204,6 @@ import CourseInstructors from '@/components/CourseInstructors.vue'
import ProgressBar from '@/components/ProgressBar.vue'
const user = inject('$user')
const router = useRouter()
const route = useRoute()
const allowDiscussions = ref(false)
const editor = ref(null)
@@ -243,13 +243,6 @@ const lesson = createResource({
},
auto: true,
onSuccess(data) {
if (Object.keys(data).length === 0) {
router.push({
name: 'CourseDetail',
params: { courseName: props.courseName },
})
return
}
lessonProgress.value = data.membership?.progress
if (data.content) editor.value = renderEditor('editor', data.content)
if (
@@ -305,17 +298,17 @@ const progress = createResource({
})
const breadcrumbs = computed(() => {
let items = [{ label: 'Courses', route: { name: 'Courses' } }]
let items = [{ label: 'All Courses', route: { name: 'Courses' } }]
items.push({
label: lesson?.data?.course_title,
route: { name: 'CourseDetail', params: { courseName: props.courseName } },
route: { name: 'CourseDetail', params: { course: props.courseName } },
})
items.push({
label: lesson?.data?.title,
route: {
name: 'Lesson',
params: {
courseName: props.courseName,
course: props.courseName,
chapterNumber: props.chapterNumber,
lessonNumber: props.lessonNumber,
},
@@ -376,40 +369,16 @@ const checkIfDiscussionsAllowed = () => {
const allowEdit = () => {
if (user.data?.is_moderator) return true
if (lesson.data?.instructors?.includes(user.data?.name)) return true
if (lesson.data?.instructors.includes(user.data?.name)) return true
return false
}
const allowInstructorContent = () => {
if (user.data?.is_moderator) return true
if (lesson.data?.instructors?.includes(user.data?.name)) return true
if (lesson.data?.instructors.includes(user.data?.name)) return true
return false
}
const enrollment = createResource({
url: 'frappe.client.insert',
makeParams() {
return {
doc: {
doctype: 'LMS Enrollment',
course: props.courseName,
member: user.data?.name,
},
}
},
})
const enrollStudent = () => {
enrollment.submit(
{},
{
onSuccess() {
window.location.reload()
},
}
)
}
const redirectToLogin = () => {
window.location.href = `/login?redirect-to=/lms/courses/${props.courseName}`
}

View File

@@ -6,22 +6,13 @@
class="sticky top-0 z-10 flex flex-col md:flex-row md:items-center justify-between border-b overflow-hidden bg-white px-3 py-2.5 sm:px-5"
>
<Breadcrumbs class="text-ellipsis" :items="breadcrumbs" />
<Button
variant="solid"
@click="saveLesson({ showSuccessMessage: true })"
class="mt-3 md:mt-0"
>
<Button variant="solid" @click="saveLesson()" class="mt-3 md:mt-0">
{{ __('Save') }}
</Button>
</header>
<div class="py-5">
<div class="w-5/6 mx-auto">
<FormControl
v-model="lesson.title"
label="Title"
class="mb-4"
:required="true"
/>
<FormControl v-model="lesson.title" label="Title" class="mb-4" />
<FormControl
v-model="lesson.include_in_preview"
type="checkbox"
@@ -78,7 +69,7 @@
</div>
</template>
<script setup>
import { Breadcrumbs, Button, createResource, FormControl } from 'frappe-ui'
import { Breadcrumbs, FormControl, createResource, Button } from 'frappe-ui'
import {
computed,
reactive,
@@ -92,15 +83,12 @@ import LessonHelp from '@/components/LessonHelp.vue'
import { ChevronRight } from 'lucide-vue-next'
import { updateDocumentTitle, createToast, getEditorTools } from '@/utils'
import { capture } from '@/telemetry'
import { useSettings } from '@/stores/settings'
const editor = ref(null)
const instructorEditor = ref(null)
const user = inject('$user')
const openInstructorEditor = ref(false)
const settingsStore = useSettings()
let autoSaveInterval
let showSuccessMessage = false
const props = defineProps({
courseName: {
@@ -124,7 +112,6 @@ onMounted(() => {
capture('lesson_form_opened')
editor.value = renderEditor('content')
instructorEditor.value = renderEditor('instructor-notes')
window.addEventListener('keydown', keyboardShortcut)
})
const renderEditor = (holder) => {
@@ -132,7 +119,6 @@ const renderEditor = (holder) => {
holder: holder,
tools: getEditorTools(true),
autofocus: true,
defaultBlock: 'markdown',
})
}
@@ -195,24 +181,12 @@ const addInstructorNotes = (data) => {
const enableAutoSave = () => {
autoSaveInterval = setInterval(() => {
saveLesson({ showSuccessMessage: false })
saveLesson()
}, 10000)
}
const keyboardShortcut = (e) => {
if (
e.key === 's' &&
(e.ctrlKey || e.metaKey) &&
!e.target.classList.contains('ProseMirror')
) {
saveLesson({ showSuccessMessage: true })
e.preventDefault()
}
}
onBeforeUnmount(() => {
clearInterval(autoSaveInterval)
window.removeEventListener('keydown', keyboardShortcut)
})
const newLessonResource = createResource({
@@ -364,11 +338,7 @@ const convertToJSON = (lessonData) => {
return blocks
}
const saveLesson = (e) => {
showSuccessMessage = false
if (typeof e != 'undefined' && e.showSuccessMessage) {
showSuccessMessage = true
}
const saveLesson = () => {
editor.value.save().then((outputData) => {
lesson.content = JSON.stringify(outputData)
instructorEditor.value.save().then((outputData) => {
@@ -396,9 +366,6 @@ const createNewLesson = () => {
onSuccess() {
capture('lesson_created')
showToast('Success', 'Lesson created successfully', 'check')
if (!settingsStore.onboardingDetails.data?.is_onboarded) {
settingsStore.onboardingDetails.reload()
}
lessonDetails.reload()
},
}
@@ -420,11 +387,6 @@ const editCurrentLesson = () => {
validate() {
return validateLesson()
},
onSuccess() {
showSuccessMessage
? showToast('Success', 'Lesson updated successfully', 'check')
: ''
},
onError(err) {
showToast('Error', err.message, 'x')
},

View File

@@ -1,367 +0,0 @@
<template>
<header
class="sticky top-0 z-10 flex flex-col md:flex-row md:items-center justify-between border-b bg-white px-3 py-2.5 sm:px-5"
>
<Breadcrumbs :items="breadbrumbs" />
<Button variant="solid" @click="saveProgram()">
{{ __('Save') }}
</Button>
</header>
<div v-if="program.doc" class="pt-5 px-5 w-3/4 mx-auto space-y-10">
<FormControl v-model="program.doc.title" :label="__('Title')" />
<!-- Courses -->
<div>
<div class="flex items-center justify-between mb-2">
<div class="text-lg font-semibold">
{{ __('Program Courses') }}
</div>
<Button
@click="
() => {
currentForm = 'course'
showDialog = true
}
"
>
<template #prefix>
<Plus class="w-4 h-4" />
</template>
{{ __('Add') }}
</Button>
</div>
<ListView
:columns="courseColumns"
:rows="program.doc.program_courses"
row-key="name"
:options="{
showTooltip: false,
}"
>
<ListHeader
class="mb-2 grid items-center space-x-4 rounded bg-gray-100 p-2"
>
<ListHeaderItem :item="item" v-for="item in courseColumns" />
</ListHeader>
<ListRows>
<Draggable
:list="program.doc.program_courses"
item-key="name"
group="items"
@end="updateOrder"
class="cursor-move"
>
<template #item="{ element: row }">
<ListRow :row="row" />
</template>
</Draggable>
</ListRows>
<ListSelectBanner>
<template #actions="{ unselectAll, selections }">
<div class="flex gap-2">
<Button
variant="ghost"
@click="remove(selections, unselectAll, 'program_courses')"
>
<Trash2 class="h-4 w-4 stroke-1.5" />
</Button>
</div>
</template>
</ListSelectBanner>
</ListView>
</div>
<!-- Members -->
<div>
<div class="flex items-center justify-between mb-2">
<div class="text-lg font-semibold">
{{ __('Program Members') }}
</div>
<Button
@click="
() => {
currentForm = 'member'
showDialog = true
}
"
>
<template #prefix>
<Plus class="w-4 h-4" />
</template>
{{ __('Add') }}
</Button>
</div>
<ListView
:columns="memberColumns"
:rows="program.doc.program_members"
row-key="name"
:options="{
showTooltip: false,
}"
>
<ListHeader
class="mb-2 grid items-center space-x-4 rounded bg-gray-100 p-2"
>
<ListHeaderItem :item="item" v-for="item in memberColumns" />
</ListHeader>
<ListRows>
<ListRow :row="row" v-for="row in program.doc.program_members" />
</ListRows>
<ListSelectBanner>
<template #actions="{ unselectAll, selections }">
<div class="flex gap-2">
<Button
variant="ghost"
@click="remove(selections, unselectAll, 'program_members')"
>
<Trash2 class="h-4 w-4 stroke-1.5" />
</Button>
</div>
</template>
</ListSelectBanner>
</ListView>
</div>
</div>
<Dialog
v-model="showDialog"
:options="{
title:
currentForm == 'course'
? __('New Program Course')
: __('New Program Member'),
actions: [
{
label: __('Add'),
variant: 'solid',
onClick: () =>
currentForm == 'course'
? addProgramCourse(close)
: addProgramMember(close),
},
],
}"
>
<template #body-content>
<Link
v-if="currentForm == 'course'"
v-model="course"
doctype="LMS Course"
:filters="{
disable_self_learning: 1,
}"
:label="__('Program Course')"
:description="
__(
'Only courses for which self learning is disabled can be added to program.'
)
"
/>
<Link
v-if="currentForm == 'member'"
v-model="member"
doctype="User"
:filters="{
ignore_user_type: 1,
}"
:label="__('Program Member')"
/>
</template>
</Dialog>
</template>
<script setup>
import {
Breadcrumbs,
Button,
call,
createDocumentResource,
Dialog,
FormControl,
ListView,
ListRows,
ListRow,
ListHeader,
ListHeaderItem,
ListSelectBanner,
} from 'frappe-ui'
import { computed, ref } from 'vue'
import { Plus, Trash2 } from 'lucide-vue-next'
import Link from '@/components/Controls/Link.vue'
import { showToast } from '@/utils/'
import Draggable from 'vuedraggable'
import { useRouter } from 'vue-router'
const showDialog = ref(false)
const currentForm = ref(null)
const course = ref(null)
const member = ref(null)
const router = useRouter()
const props = defineProps({
programName: {
type: String,
required: true,
},
})
const program = createDocumentResource({
doctype: 'LMS Program',
name: props.programName,
auto: true,
cache: ['program', props.programName],
})
const addProgramCourse = () => {
program.setValue.submit(
{
program_courses: [
...program.doc.program_courses,
{ course: course.value },
],
},
{
onSuccess(data) {
showDialog.value = false
course.value = null
showToast(__('Success'), __('Course added to program'), 'check')
program.reload()
},
onError(err) {
showToast('Error', err.messages?.[0] || err, 'x')
},
}
)
}
const addProgramMember = () => {
program.setValue.submit(
{
program_members: [
...program.doc.program_members,
{ member: member.value },
],
},
{
onSuccess(data) {
showDialog.value = false
member.value = null
showToast(__('Success'), __('Member added to program'), 'check')
program.reload()
},
onError(err) {
showToast('Error', err.messages?.[0] || err, 'x')
},
}
)
}
const remove = (selections, unselectAll, doctype) => {
selections = Array.from(selections)
program.setValue.submit(
{
[doctype]: program.doc[doctype].filter(
(row) => !selections.includes(row.name)
),
},
{
onSuccess(data) {
unselectAll()
showToast(__('Success'), __('Items removed successfully'), 'check')
program.reload()
},
onError(err) {
showToast('Error', err.messages?.[0] || err, 'x')
},
}
)
}
const updateOrder = (e) => {
let sourceIdx = e.from.dataset.idx
let targetIdx = e.to.dataset.idx
let courses = program.doc.program_courses
courses.splice(targetIdx, 0, courses.splice(sourceIdx, 1)[0])
courses.forEach((course, index) => {
course.idx = index + 1
})
program.setValue.submit(
{
program_courses: courses,
},
{
onSuccess(data) {
showToast(__('Success'), __('Course moved successfully'), 'check')
program.reload()
},
onError(err) {
showToast('Error', err.messages?.[0] || err, 'x')
},
}
)
}
const saveProgram = () => {
call('frappe.model.rename_doc.update_document_title', {
doctype: 'LMS Program',
docname: program.doc.name,
name: program.doc.title,
}).then((data) => {
router.push({ name: 'ProgramForm', params: { programName: data } })
})
}
const courseColumns = computed(() => {
return [
{
label: 'Title',
key: 'course_title',
width: 3,
},
{
label: 'ID',
key: 'course',
width: 3,
},
]
})
const memberColumns = computed(() => {
return [
{
label: 'Member',
key: 'member',
width: 3,
align: 'left',
},
{
label: 'Full Name',
key: 'full_name',
width: 3,
align: 'left',
},
{
label: 'Progress (%)',
key: 'progress',
width: 3,
align: 'right',
},
]
})
const breadbrumbs = computed(() => {
return [
{
label: 'Programs',
route: { name: 'Programs' },
},
{
label: props.programName === 'new' ? 'New Program' : props.programName,
},
]
})
</script>

View File

@@ -1,215 +0,0 @@
<template>
<header
class="sticky top-0 z-10 flex items-center justify-between border-b bg-white px-3 py-2.5 sm:px-5"
>
<Breadcrumbs :items="breadbrumbs" />
<Button
v-if="user.data?.is_moderator || user.data?.is_instructor"
@click="showDialog = true"
variant="solid"
>
<template #prefix>
<Plus class="h-4 w-4 stroke-1.5" />
</template>
{{ __('New') }}
</Button>
</header>
<div v-if="programs.data?.length" class="pt-5 px-5">
<div v-for="program in programs.data" class="mb-10">
<div class="flex items-center justify-between">
<div class="text-xl font-semibold">
{{ program.name }}
</div>
<div class="flex items-center space-x-2">
<Badge
v-if="program.members"
variant="subtle"
theme="green"
size="lg"
>
{{ program.members }}
{{
program.members == 1 ? __(singularize('members')) : __('members')
}}
</Badge>
<Badge
v-if="program.progress"
variant="subtle"
theme="blue"
size="lg"
>
{{ program.progress }}{{ __('% completed') }}
</Badge>
<router-link
v-if="user.data?.is_moderator || user.data?.is_instructor"
:to="{
name: 'ProgramForm',
params: { programName: program.name },
}"
>
<Button>
<template #prefix>
<Edit class="h-4 w-4 stroke-1.5" />
</template>
{{ __('Edit') }}
</Button>
</router-link>
</div>
</div>
<div
v-if="program.courses?.length"
class="grid grid-cols-1 md:grid-cols-2 lg:grid-cols-3 gap-5 mt-5"
>
<div v-for="course in program.courses" class="relative group">
<CourseCard
:course="course"
@click="enrollMember(program.name, course.name)"
class="cursor-pointer"
/>
<div
v-if="lockCourse(course)"
class="absolute inset-0 bg-black-overlay-500 opacity-60 rounded-md"
></div>
<div
v-if="lockCourse(course)"
class="absolute inset-0 flex items-center justify-center"
>
<LockKeyhole class="size-10 text-white" />
</div>
</div>
</div>
<div v-else class="text-sm italic text-gray-600 mt-4">
{{ __('No courses in this program') }}
</div>
</div>
</div>
<div
v-else
class="text-center p-5 text-gray-600 mt-52 w-3/4 md:w-1/2 mx-auto space-y-2"
>
<BookOpen class="size-10 mx-auto stroke-1 text-gray-500" />
<div class="text-xl font-medium">
{{ __('No programs found') }}
</div>
<div class="leading-5">
{{
__(
'There are no programs available at the moment. Keep an eye out, fresh learning experiences are on the way soon!'
)
}}
</div>
</div>
<Dialog
v-model="showDialog"
:options="{
title: __('New Program'),
actions: [
{
label: __('Create'),
variant: 'solid',
onClick: () => createProgram(close),
},
],
}"
>
<template #body-content>
<FormControl :label="__('Title')" v-model="title" />
</template>
</Dialog>
</template>
<script setup>
import {
Badge,
Breadcrumbs,
Button,
call,
createResource,
Dialog,
FormControl,
} from 'frappe-ui'
import { computed, inject, onMounted, ref } from 'vue'
import { BookOpen, Edit, Plus, LockKeyhole } from 'lucide-vue-next'
import CourseCard from '@/components/CourseCard.vue'
import { useRouter } from 'vue-router'
import { showToast, singularize } from '@/utils'
import { useSettings } from '@/stores/settings'
const user = inject('$user')
const showDialog = ref(false)
const router = useRouter()
const title = ref('')
const settings = useSettings()
onMounted(() => {
if (
!settings.learningPaths.data &&
!user.data?.is_moderator &&
!user.data?.is_instructor
) {
router.push({ name: 'Courses' })
}
})
const programs = createResource({
url: 'lms.lms.utils.get_programs',
auto: true,
cache: 'programs',
})
const createProgram = (close) => {
call('frappe.client.insert', {
doc: {
doctype: 'LMS Program',
title: title.value,
},
}).then((res) => {
router.push({ name: 'ProgramForm', params: { programName: res.name } })
})
}
const enrollMember = (program, course) => {
call('lms.lms.utils.enroll_in_program_course', {
program: program,
course: course,
})
.then((data) => {
if (data.current_lesson) {
router.push({
name: 'Lesson',
params: {
courseName: course,
chapterNumber: data.current_lesson.split('-')[0],
lessonNumber: data.current_lesson.split('-')[1],
},
})
} else if (data) {
router.push({
name: 'Lesson',
params: {
courseName: course,
chapterNumber: 1,
lessonNumber: 1,
},
})
}
})
.catch((err) => {
showToast('Error', err.messages?.[0] || err, 'x')
})
}
const lockCourse = (course) => {
if (user.data?.is_moderator || user.data?.is_instructor) return false
if (course.membership) return false
if (course.eligible) return false
return true
}
const breadbrumbs = computed(() => [
{
label: 'Programs',
},
])
</script>

View File

@@ -48,7 +48,6 @@
? __('Title')
: __('Enter a title and save the quiz to proceed')
"
:required="true"
/>
<div v-if="quizDetails.data?.name">
<div class="grid grid-cols-2 gap-5 mt-4 mb-8">
@@ -142,7 +141,6 @@
v-slot="{ idx, column, item }"
v-for="row in quiz.questions"
@click="openQuestionModal(row)"
class="cursor-pointer"
>
<ListRowItem :item="item">
<div
@@ -206,6 +204,7 @@ import {
inject,
onBeforeUnmount,
watch,
isReactive,
} from 'vue'
import { Plus, Trash2 } from 'lucide-vue-next'
import Question from '@/components/Modals/Question.vue'
@@ -256,7 +255,11 @@ onMounted(() => {
})
const keyboardShortcut = (e) => {
if (e.key === 's' && (e.ctrlKey || e.metaKey)) {
if (
e.key === 's' &&
(e.ctrlKey || e.metaKey) &&
!e.target.classList.contains('ProseMirror')
) {
submitQuiz()
e.preventDefault()
}

View File

@@ -15,45 +15,38 @@
</Button>
</div>
</header>
<div v-if="submisisonDetails.doc" class="w-1/2 mx-auto py-5 space-y-5">
<div class="text-xl font-semibold">
{{ submisisonDetails.doc.member_name }}
<div v-if="submisisonDetails.doc" class="w-1/2 mx-auto py-5 space-y-4">
<div class="grid grid-cols-2 gap-5">
<FormControl
v-model="submisisonDetails.doc.quiz_title"
:label="__('Quiz')"
:disabled="true"
/>
<FormControl
v-model="submisisonDetails.doc.member_name"
:label="__('Member')"
:disabled="true"
/>
</div>
<div class="space-y-4 border p-5 rounded-md">
<div class="grid grid-cols-2 gap-5">
<FormControl
v-model="submisisonDetails.doc.quiz_title"
:label="__('Quiz')"
:disabled="true"
/>
<FormControl
v-model="submisisonDetails.doc.member_name"
:label="__('Member')"
:disabled="true"
/>
</div>
<div class="grid grid-cols-2 gap-5">
<FormControl
v-model="submisisonDetails.doc.score"
:label="__('Score')"
:disabled="true"
/>
<FormControl
v-model="submisisonDetails.doc.percentage"
:label="__('Percentage')"
:disabled="true"
/>
</div>
<div class="grid grid-cols-2 gap-5">
<FormControl
v-model="submisisonDetails.doc.score"
:label="__('Score')"
:disabled="true"
/>
<FormControl
v-model="submisisonDetails.doc.percentage"
:label="__('Percentage')"
:disabled="true"
/>
</div>
<div
v-for="row in submisisonDetails.doc.result"
class="border p-5 rounded-md space-y-4"
>
<div class="flex space-x-1 font-semibold">
<span class="leading-5" v-html="row.question"> </span>
</div>
<div class="font-semibold">{{ row.idx }}. {{ row.question }}</div>
<div v-html="row.answer" class="leading-5"></div>
<div class="grid grid-cols-2 gap-5">
<FormControl v-model="row.marks" :label="__('Marks')" />
@@ -74,7 +67,7 @@ import {
Button,
Badge,
} from 'frappe-ui'
import { computed, onBeforeUnmount, onMounted, inject } from 'vue'
import { computed, onMounted, inject } from 'vue'
import { useRouter } from 'vue-router'
import { showToast } from '@/utils'
@@ -84,25 +77,8 @@ const user = inject('$user')
onMounted(() => {
if (!user.data?.is_instructor && !user.data?.is_moderator)
router.push({ name: 'Courses' })
window.addEventListener('keydown', keyboardShortcut)
})
onBeforeUnmount(() => {
window.removeEventListener('keydown', keyboardShortcut)
})
const keyboardShortcut = (e) => {
if (
e.key === 's' &&
(e.ctrlKey || e.metaKey) &&
!e.target.classList.contains('ProseMirror')
) {
saveSubmission()
e.preventDefault()
}
}
const props = defineProps({
submission: {
type: String,

View File

@@ -5,9 +5,6 @@
<Breadcrumbs :items="breadcrumbs" />
</header>
<div v-if="submissions.data?.length" class="md:w-3/4 md:mx-auto py-5 mx-5">
<div class="text-xl font-semibold mb-5">
{{ submissions.data[0].quiz_title }}
</div>
<ListView
:columns="quizColumns"
:rows="submissions.data"
@@ -34,18 +31,12 @@
</router-link>
</ListRows>
</ListView>
<div class="flex justify-center my-5">
<Button v-if="submissions.hasNextPage" @click="submissions.next()">
{{ __('Load More') }}
</Button>
</div>
</div>
</template>
<script setup>
import {
createListResource,
Breadcrumbs,
Button,
ListView,
ListRow,
ListRows,
@@ -85,7 +76,12 @@ const quizColumns = computed(() => {
{
label: __('Member'),
key: 'member_name',
width: 1,
width: 2,
},
{
label: __('Quiz'),
key: 'quiz_title',
width: 2,
},
{
label: __('Score'),

View File

@@ -46,43 +46,22 @@
</router-link>
</ListRows>
</ListView>
<div class="flex justify-center my-5">
<Button v-if="quizzes.hasNextPage" @click="quizzes.next()">
{{ __('Load More') }}
</Button>
</div>
</div>
<div
v-else
class="text-center p-5 text-gray-600 mt-52 w-3/4 md:w-1/2 mx-auto space-y-2"
>
<BookOpen class="size-10 mx-auto stroke-1 text-gray-500" />
<div class="text-xl font-medium">
{{ __('No quizzes found') }}
</div>
<div class="leading-5">
{{
__(
'You have not created any quizzes yet. To create a new quiz, click on the "New Quiz" button above.'
)
}}
</div>
</div>
</template>
<script setup>
import {
Breadcrumbs,
Button,
createListResource,
ListView,
ListRows,
ListRow,
ListHeader,
ListHeaderItem,
Button,
} from 'frappe-ui'
import { useRouter } from 'vue-router'
import { computed, inject, onMounted } from 'vue'
import { BookOpen, Plus } from 'lucide-vue-next'
import { Plus } from 'lucide-vue-next'
import { updateDocumentTitle } from '@/utils'
const user = inject('$user')
@@ -108,6 +87,9 @@ const quizzes = createListResource({
auto: true,
cache: ['quizzes', user.data?.name],
orderBy: 'modified desc',
onSuccess(data) {
data.forEach((row) => {})
},
})
const quizColumns = computed(() => {

View File

@@ -1,208 +0,0 @@
<template>
<header
class="sticky top-0 z-10 flex items-center justify-between border-b bg-white px-3 py-2.5 sm:px-5"
>
<Breadcrumbs class="h-7" :items="breadcrumbs" />
</header>
<div
v-if="
readyToRender &&
(enrollment.data?.length ||
user.data?.is_moderator ||
user.data?.is_instructor)
"
>
<iframe :src="chapter.doc.launch_file" class="w-full h-screen" />
</div>
<div v-else-if="!enrollment.data?.length">
<div class="text-center pt-10 px-5 md:px-0 pb-10">
<div class="text-center">
<div class="mb-4">
{{
__(
'You are not enrolled in this course. Please enroll to access this lesson.'
)
}}
</div>
<Button variant="solid" @click="enrollStudent()">
{{ __('Start Learning') }}
</Button>
</div>
</div>
</div>
</template>
<script setup>
import {
Breadcrumbs,
Button,
call,
createDocumentResource,
createListResource,
createResource,
} from 'frappe-ui'
import { computed, inject, onBeforeMount, ref } from 'vue'
import { useSidebar } from '@/stores/sidebar'
import { updateDocumentTitle } from '@/utils'
const sidebarStore = useSidebar()
const user = inject('$user')
const readyToRender = ref(false)
const props = defineProps({
courseName: {
type: String,
required: true,
},
chapterName: {
type: String,
required: true,
},
})
onBeforeMount(() => {
sidebarStore.isSidebarCollapsed = true
setupSCORMAPI()
})
const chapter = createDocumentResource({
doctype: 'Course Chapter',
name: props.chapterName,
auto: true,
cache: ['chapter', props.chapterName],
onSuccess(data) {
progress.submit()
},
})
const enrollment = createListResource({
doctype: 'LMS Enrollment',
fields: ['member', 'course'],
filters: {
course: props.courseName,
member: user.data?.name,
},
auto: true,
cache: ['enrollments', props.courseName, user.data?.name],
})
const getDataFromLMS = (key) => {
if (key == 'cmi.core.lesson_status') {
if (progress.data?.status == 'Complete') {
return 'passed'
}
return 'incomplete'
}
return ''
}
const saveDataToLMS = (key, value) => {
if (key == 'cmi.core.lesson_status' && value == 'passed') {
saveProgress()
}
}
const saveProgress = () => {
call('lms.lms.doctype.course_lesson.course_lesson.save_progress', {
lesson: chapter.doc.lessons[0].lesson,
course: props.courseName,
})
}
const progress = createResource({
url: 'frappe.client.get_value',
makeParams(values) {
return {
doctype: 'LMS Course Progress',
fieldname: 'status',
filters: {
member: user.data?.name,
lesson: chapter.doc.lessons[0].lesson,
chapter: chapter.doc.name,
course: chapter.doc?.course,
},
}
},
onSuccess(data) {
readyToRender.value = true
},
})
const enrollStudent = () => {
enrollment.insert.submit(
{
course: props.courseName,
member: user.data?.name,
},
{
onSuccess(data) {
window.location.reload()
},
}
)
}
const setupSCORMAPI = () => {
window.API_1484_11 = {
Initialize: () => 'true',
Terminate: () => 'true',
GetValue: (key) => {
console.log(`GET: ${key}`)
return getDataFromLMS(key)
},
SetValue: (key, value) => {
console.log(`SET: ${key} to value: ${value}`)
saveDataToLMS(key, value)
return 'true'
},
Commit: () => 'true',
GetLastError: () => '0',
GetErrorString: () => '',
GetDiagnostic: () => '',
}
window.API = {
LMSInitialize: () => 'true',
LMSFinish: () => 'true',
LMSGetValue: (key) => {
console.log(`GET: ${key}`)
return getDataFromLMS(key)
},
LMSSetValue: (key, value) => {
console.log(`SET: ${key} to value: ${value}`)
saveDataToLMS(key, value)
return 'true'
},
LMSCommit: () => 'true',
LMSGetLastError: () => '0',
LMSGetErrorString: () => '',
LMSGetDiagnostic: () => '',
}
}
const breadcrumbs = computed(() => {
return [
{
label: 'Courses',
route: { name: 'Courses' },
},
{
label: chapter.doc?.course_title,
route: { name: 'CourseDetail', params: { courseName: props.courseName } },
},
{
label: chapter.doc?.title,
},
]
})
const pageMeta = computed(() => {
return {
title: chapter?.doc?.title,
description: __('This is a chapter in the course {0}').format(
chapter?.doc?.course_title
),
}
})
updateDocumentTitle(pageMeta)
</script>

View File

@@ -27,12 +27,6 @@ const routes = [
component: () => import('@/pages/Lesson.vue'),
props: true,
},
{
path: '/courses/:courseName/learn/:chapterName',
name: 'SCORMChapter',
component: () => import('@/pages/SCORMChapter.vue'),
props: true,
},
{
path: '/batches',
name: 'Batches',
@@ -131,6 +125,12 @@ const routes = [
component: () => import('@/pages/JobCreation.vue'),
props: true,
},
{
path: '/assignment-submission/:assignmentName/:submissionName',
name: 'AssignmentSubmission',
component: () => import('@/pages/AssignmentSubmission.vue'),
props: true,
},
{
path: '/certified-participants',
name: 'CertifiedParticipants',
@@ -176,39 +176,6 @@ const routes = [
component: () => import('@/pages/QuizSubmission.vue'),
props: true,
},
{
path: '/programs/:programName',
name: 'ProgramForm',
component: () => import('@/pages/ProgramForm.vue'),
props: true,
},
{
path: '/programs',
name: 'Programs',
component: () => import('@/pages/Programs.vue'),
},
{
path: '/assignments',
name: 'Assignments',
component: () => import('@/pages/Assignments.vue'),
},
{
path: '/assignments/:assignmentID',
name: 'AssignmentForm',
component: () => import('@/pages/AssignmentForm.vue'),
props: true,
},
{
path: '/assignment-submission/:assignmentID/:submissionName',
name: 'AssignmentSubmission',
component: () => import('@/pages/AssignmentSubmission.vue'),
props: true,
},
{
path: '/assignment-submissions',
name: 'AssignmentSubmissionList',
component: () => import('@/pages/AssignmentSubmissionList.vue'),
},
]
let router = createRouter({

View File

@@ -1,32 +1,12 @@
import { defineStore } from 'pinia'
import { ref } from 'vue'
import { createResource } from 'frappe-ui'
export const useSettings = defineStore('settings', () => {
const isSettingsOpen = ref(false)
const activeTab = ref(null)
const learningPaths = createResource({
url: 'frappe.client.get_single_value',
makeParams(values) {
return {
doctype: 'LMS Settings',
field: 'enable_learning_paths',
}
},
auto: true,
cache: ['learningPaths'],
})
const onboardingDetails = createResource({
url: 'lms.lms.utils.is_onboarding_complete',
auto: true,
cache: ['onboardingDetails'],
})
return {
isSettingsOpen,
activeTab,
learningPaths,
onboardingDetails,
}
})

View File

@@ -1,10 +0,0 @@
import { defineStore } from 'pinia'
import { ref } from 'vue'
export const useSidebar = defineStore('sidebar', () => {
const isSidebarCollapsed = ref(false)
return {
isSidebarCollapsed,
}
})

View File

@@ -1,83 +0,0 @@
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'
export class Assignment {
constructor({ data, api, readOnly }) {
this.data = data
this.readOnly = readOnly
}
static get toolbox() {
const app = createApp({
render: () =>
h(Pencil, { size: 18, strokeWidth: 1.5, color: 'black' }),
})
const div = document.createElement('div')
app.mount(div)
return {
title: __('Assignment'),
icon: div.innerHTML,
}
}
static get isReadOnlySupported() {
return true
}
render() {
this.wrapper = document.createElement('div')
if (Object.keys(this.data).length) {
this.renderAssignment(this.data.assignment)
} else {
this.renderAssignmentModal()
}
return this.wrapper
}
renderAssignment(assignment) {
if (this.readOnly) {
const app = createApp(AssignmentBlock, {
assignmentID: assignment,
})
app.use(translationPlugin)
app.use(router)
const { userResource } = usersStore()
app.provide('$user', userResource)
app.mount(this.wrapper)
return
}
this.wrapper.innerHTML = `<div class='border rounded-md p-10 text-center bg-gray-50 mb-2'>
<span class="font-medium">
Assignment: ${assignment}
</span>
</div>`
return
}
renderAssignmentModal() {
if (this.readOnly) {
return
}
const app = createApp(AssessmentPlugin, {
onAddition: (assignment) => {
this.data.assignment = assignment
this.renderAssignment(assignment)
},
})
app.use(translationPlugin)
app.mount(this.wrapper)
}
save(blockContent) {
return {
assignment: this.data.assignment,
}
}
}

View File

@@ -5,8 +5,6 @@ import updateLocale from 'dayjs/esm/plugin/updateLocale'
import isToday from 'dayjs/esm/plugin/isToday'
import isSameOrBefore from 'dayjs/esm/plugin/isSameOrBefore'
import isSameOrAfter from 'dayjs/esm/plugin/isSameOrAfter'
import utc from 'dayjs/esm/plugin/utc'
import timezone from 'dayjs/esm/plugin/timezone'
dayjs.extend(updateLocale)
dayjs.extend(relativeTime)
@@ -14,7 +12,5 @@ dayjs.extend(localizedFormat)
dayjs.extend(isToday)
dayjs.extend(isSameOrBefore)
dayjs.extend(isSameOrAfter)
dayjs.extend(utc)
dayjs.extend(timezone)
export default dayjs

View File

@@ -1,9 +1,7 @@
import { toast } from 'frappe-ui'
import { useTimeAgo } from '@vueuse/core'
import { Quiz } from '@/utils/quiz'
import { Assignment } from '@/utils/assignment'
import { Upload } from '@/utils/upload'
import { Markdown } from '@/utils/markdownParser'
import Header from '@editorjs/header'
import Paragraph from '@editorjs/paragraph'
import { CodeBox } from '@/utils/code'
@@ -13,7 +11,6 @@ import { watch } from 'vue'
import dayjs from '@/utils/dayjs'
import Embed from '@editorjs/embed'
import SimpleImage from '@editorjs/simple-image'
import Table from '@editorjs/table'
export function createToast(options) {
toast({
@@ -60,15 +57,6 @@ export function formatNumberIntoCurrency(number, currency) {
return ''
}
// create a function that formats numbers in thousands to k
export function formatAmount(amount) {
if (amount > 999) {
return (amount / 1000).toFixed(1) + 'k'
}
return amount
}
export function convertToTitleCase(str) {
if (!str) {
return ''
@@ -96,7 +84,7 @@ export function showToast(title, text, icon, iconClasses = null) {
if (!iconClasses) {
if (icon == 'check') {
iconClasses = 'bg-green-600 text-white rounded-md p-px'
} else if (icon == 'alert-circle') {
} else if (icon == 'circle-warn') {
iconClasses = 'bg-yellow-600 text-white rounded-md p-px'
} else {
iconClasses = 'bg-red-600 text-white rounded-md p-px'
@@ -149,18 +137,10 @@ export function htmlToText(html) {
export function getEditorTools() {
return {
header: {
class: Header,
config: {
placeholder: 'Header',
},
},
header: Header,
quiz: Quiz,
assignment: Assignment,
upload: Upload,
markdown: Markdown,
image: SimpleImage,
table: Table,
paragraph: {
class: Paragraph,
inlineToolbar: true,

View File

@@ -1,156 +0,0 @@
export class Markdown {
constructor({ data, api, readOnly, config }) {
this.api = api
this.data = data || {}
this.config = config || {}
this.text = data.text || ''
this.readOnly = readOnly
}
static get isReadOnlySupported() {
return true
}
static get conversionConfig() {
return {
export: 'text',
import: 'text',
}
}
onPaste(event) {
const data = {
text: event.detail.data.innerHTML,
}
this.data = data
window.requestAnimationFrame(() => {
if (!this.wrapper) {
return
}
this.wrapper.innerHTML = this.data.text || ''
})
}
static get pasteConfig() {
return {
tags: ['P'],
}
}
render() {
this.wrapper = document.createElement('div')
this.wrapper.classList.add('cdx-block')
this.wrapper.classList.add('ce-paragraph')
this.wrapper.innerHTML = this.text
if (!this.readOnly) {
this.wrapper.contentEditable = true
this.wrapper.innerHTML = this.text
this.wrapper.addEventListener('keydown', (event) => {
const value = event.target.textContent
if (event.keyCode === 32 && value.startsWith('#')) {
this.convertToHeader(event, value)
} else if (event.keyCode === 13) {
this.parseContent(event)
}
})
}
return this.wrapper
}
convertToHeader(event, value) {
event.preventDefault()
if (['#', '##', '###', '####', '#####', '######'].includes(value)) {
let level = value.length
event.target.textContent = ''
this.convertBlock('header', {
level: level,
})
}
}
parseContent(event) {
event.preventDefault()
const previousLine = this.wrapper.textContent
if (previousLine && this.hasImage(previousLine)) {
this.wrapper.textContent = ''
this.convertBlock('image')
} else if (previousLine && this.hasLink(previousLine)) {
const { text, url } = this.extractLink(previousLine)
const anchorTag = `<a href="${url}" target="_blank">${text}</a>`
this.convertBlock('paragraph', {
text: previousLine.replace(/\[.+?\]\(.+?\)/, anchorTag),
})
} else if (previousLine && previousLine.startsWith('- ')) {
this.convertBlock('list', {
style: 'unordered',
items: [
{
content: previousLine.replace('- ', ''),
},
],
})
} else if (previousLine && previousLine.startsWith('1. ')) {
this.convertBlock('list', {
style: 'ordered',
items: [
{
content: previousLine.replace('1. ', ''),
},
],
})
} else if (previousLine && this.canBeEmbed(previousLine)) {
this.wrapper.textContent = ''
this.convertBlock('embed', {
source: previousLine,
})
}
}
async convertBlock(type, data, index = null) {
const currentIndex = this.api.blocks.getCurrentBlockIndex()
const currentBlock = this.api.blocks.getBlockByIndex(currentIndex)
await this.api.blocks.convert(currentBlock.id, type, data)
this.api.caret.focus(true)
}
save(blockContent) {
return {
text: blockContent.innerHTML,
}
}
hasImage(line) {
return /!\[.+?\]\(.+?\)/.test(line)
}
extractImage(line) {
const match = line.match(/!\[(.+?)\]\((.+?)\)/)
if (match) {
return { alt: match[1], url: match[2] }
}
return { alt: '', url: '' }
}
hasLink(line) {
return /\[.+?\]\(.+?\)/.test(line)
}
extractLink(line) {
const match = line.match(/\[(.+?)\]\((.+?)\)/)
if (match) {
return { text: match[1], url: match[2] }
}
return { text: '', url: '' }
}
canBeEmbed(line) {
return /^https?:\/\/.+/.test(line)
}
}
export default Markdown

View File

@@ -1,5 +1,5 @@
import QuizBlock from '@/components/QuizBlock.vue'
import AssessmentPlugin from '@/components/AssessmentPlugin.vue'
import QuizPlugin from '@/components/QuizPlugin.vue'
import { createApp, h } from 'vue'
import { usersStore } from '../stores/user'
import translationPlugin from '../translation'
@@ -51,7 +51,7 @@ export class Quiz {
app.mount(this.wrapper)
return
}
this.wrapper.innerHTML = `<div class='border rounded-md p-10 text-center bg-gray-50 mb-2'>
this.wrapper.innerHTML = `<div class='border rounded-md p-10 text-center mb-2'>
<span class="font-medium">
Quiz: ${quiz}
</span>
@@ -60,11 +60,8 @@ export class Quiz {
}
renderQuizModal() {
if (this.readOnly) {
return
}
const app = createApp(AssessmentPlugin, {
onAddition: (quiz) => {
const app = createApp(QuizPlugin, {
onQuizAddition: (quiz) => {
this.data.quiz = quiz
this.renderQuiz(quiz)
},

File diff suppressed because it is too large Load Diff

View File

@@ -1 +1 @@
__version__ = "2.18.0"
__version__ = "2.9.0"

View File

@@ -110,8 +110,7 @@ doc_events = {
# ---------------
scheduler_events = {
"hourly": [
"lms.lms.doctype.lms_certificate_request.lms_certificate_request.schedule_evals",
"lms.lms.api.update_course_statistics",
"lms.lms.doctype.lms_certificate_request.lms_certificate_request.schedule_evals"
],
"daily": ["lms.job.doctype.job_opportunity.job_opportunity.update_job_openings"],
}
@@ -225,7 +224,6 @@ page_renderer = [
"lms.page_renderers.ProfileRedirectPage",
"lms.page_renderers.ProfilePage",
"lms.page_renderers.CoursePage",
"lms.page_renderers.SCORMRenderer",
]
# set this to "/" to have profiles on the top-level

View File

@@ -1,12 +1,10 @@
import frappe
from frappe.desk.page.setup_wizard.setup_wizard import add_all_roles_to
from lms.lms.api import give_dicussions_permission
def after_install():
add_pages_to_nav()
create_batch_source()
give_dicussions_permission()
def after_sync():
@@ -66,9 +64,7 @@ def delete_lms_roles():
def create_course_creator_role():
if frappe.db.exists("Role", "Course Creator"):
frappe.db.set_value("Role", "Course Creator", "desk_access", 0)
else:
if not frappe.db.exists("Role", "Course Creator"):
role = frappe.get_doc(
{
"doctype": "Role",
@@ -81,9 +77,7 @@ def create_course_creator_role():
def create_moderator_role():
if frappe.db.exists("Role", "Moderator"):
frappe.db.set_value("Role", "Moderator", "desk_access", 0)
else:
if not frappe.db.exists("Role", "Moderator"):
role = frappe.get_doc(
{
"doctype": "Role",
@@ -96,9 +90,7 @@ def create_moderator_role():
def create_evaluator_role():
if frappe.db.exists("Role", "Batch Evaluator"):
frappe.db.set_value("Role", "Batch Evaluator", "desk_access", 0)
else:
if not frappe.db.exists("Role", "Batch Evaluator"):
role = frappe.new_doc("Role")
role.update(
{
@@ -111,9 +103,7 @@ def create_evaluator_role():
def create_lms_student_role():
if frappe.db.exists("Role", "LMS Student"):
frappe.db.set_value("Role", "LMS Student", "desk_access", 0)
else:
if not frappe.db.exists("Role", "LMS Student"):
role = frappe.new_doc("Role")
role.update(
{

View File

@@ -1,23 +1,13 @@
"""API methods for the LMS.
"""
import json
import frappe
import zipfile
import os
import re
import shutil
import requests
import xml.etree.ElementTree as ET
from frappe.translate import get_all_translations
from frappe import _
from frappe.query_builder import DocType
from frappe.query_builder.functions import Count
from frappe.utils import time_diff, now_datetime, get_datetime, flt
from frappe.utils import time_diff, now_datetime, get_datetime
from typing import Optional
from lms.lms.utils import get_average_rating, get_lesson_count
from xml.dom.minidom import parseString
from lms.lms.doctype.course_lesson.course_lesson import save_progress
@frappe.whitelist()
@@ -169,7 +159,6 @@ def get_user_info():
user.is_instructor = "Course Creator" in user.roles
user.is_moderator = "Moderator" in user.roles
user.is_evaluator = "Batch Evaluator" in user.roles
user.is_student = "LMS Student" in user.roles
return user
@@ -305,8 +294,7 @@ def get_branding():
for field in image_fields:
if website_settings.get(field):
file_info = get_file_info(website_settings.get(field))
website_settings.update({field: json.loads(json.dumps(file_info))})
website_settings.update({field: get_file_info(website_settings.get(field))})
else:
website_settings.update({field: None})
@@ -501,15 +489,7 @@ def delete_sidebar_item(webpage):
@frappe.whitelist()
def delete_lesson(lesson, chapter):
# Delete Reference
chapter = frappe.get_doc("Course Chapter", chapter)
chapter.lessons = [row for row in chapter.lessons if row.lesson != lesson]
chapter.save()
# Delete progress
frappe.db.delete("LMS Course Progress", {"lesson": lesson})
# Delete Lesson
frappe.db.delete("Lesson Reference", {"parent": chapter, "lesson": lesson})
frappe.db.delete("Course Lesson", lesson)
@@ -594,7 +574,7 @@ def get_categories(doctype, filters):
def get_members(start=0, search=""):
"""Get members for the given search term and start index.
Args: start (int): Start index for the query.
search (str): Search term to filter the results.
search (str): Search term to filter the results.
Returns: List of members.
"""
@@ -780,266 +760,3 @@ def get_payment_gateway_details(payment_gateway):
"doctype": doctype,
"docname": docname,
}
def update_course_statistics():
courses = frappe.get_all("LMS Course", fields=["name"])
for course in courses:
lessons = get_lesson_count(course.name)
enrollments = frappe.db.count(
"LMS Enrollment", {"course": course.name, "member_type": "Student"}
)
avg_rating = get_average_rating(course.name) or 0
avg_rating = flt(avg_rating, frappe.get_system_settings("float_precision") or 3)
frappe.db.set_value(
"LMS Course",
course.name,
{"lessons": lessons, "enrollments": enrollments, "rating": avg_rating},
)
@frappe.whitelist()
def get_announcements(batch):
return frappe.get_all(
"Communication",
filters={
"reference_doctype": "LMS Batch",
"reference_name": batch,
},
fields=[
"subject",
"content",
"recipients",
"cc",
"communication_date",
"sender",
"sender_full_name",
],
order_by="communication_date desc",
)
@frappe.whitelist()
def delete_course(course):
chapters = frappe.get_all("Course Chapter", {"course": course}, pluck="name")
chapter_references = frappe.get_all(
"Chapter Reference", {"parent": course}, pluck="name"
)
for chapter in chapters:
lessons = frappe.get_all("Course Lesson", {"chapter": chapter}, pluck="name")
lesson_references = frappe.get_all(
"Lesson Reference", {"parent": chapter}, pluck="name"
)
for lesson in lesson_references:
frappe.delete_doc("Lesson Reference", lesson)
for lesson in lessons:
topics = frappe.get_all(
"Discussion Topic",
{"reference_doctype": "Course Lesson", "reference_docname": lesson},
pluck="name",
)
for topic in topics:
frappe.db.delete("Discussion Reply", {"topic": topic})
frappe.db.delete("Discussion Topic", topic)
frappe.delete_doc("Course Lesson", lesson)
for chapter in chapter_references:
frappe.delete_doc("Chapter Reference", chapter)
for chapter in chapters:
frappe.delete_doc("Course Chapter", chapter)
frappe.db.delete("LMS Course Progress", {"course": course})
frappe.db.delete("LMS Quiz", {"course": course})
frappe.db.delete("LMS Quiz Submission", {"course": course})
frappe.db.delete("LMS Enrollment", {"course": course})
frappe.delete_doc("LMS Course", course)
def give_dicussions_permission():
doctypes = ["Discussion Topic", "Discussion Reply"]
roles = ["LMS Student", "Course Creator", "Moderator", "Batch Evaluator"]
for doctype in doctypes:
for role in roles:
if not frappe.db.exists("Custom DocPerm", {"parent": doctype, "role": role}):
frappe.get_doc(
{
"doctype": "Custom DocPerm",
"parent": doctype,
"role": role,
"read": 1,
"write": 1,
"create": 1,
"delete": 1,
}
).save(ignore_permissions=True)
@frappe.whitelist()
def upsert_chapter(title, course, is_scorm_package, scorm_package, name=None):
values = frappe._dict(
{"title": title, "course": course, "is_scorm_package": is_scorm_package}
)
if is_scorm_package:
scorm_package = frappe._dict(scorm_package)
extract_path = extract_package(course, title, scorm_package)
values.update(
{
"scorm_package": scorm_package.name,
"scorm_package_path": extract_path.split("public")[1],
"manifest_file": get_manifest_file(extract_path).split("public")[1],
"launch_file": get_launch_file(extract_path).split("public")[1],
}
)
if name:
chapter = frappe.get_doc("Course Chapter", name)
else:
chapter = frappe.new_doc("Course Chapter")
chapter.update(values)
chapter.save()
if is_scorm_package and not len(chapter.lessons):
add_lesson(title, chapter.name, course)
return chapter
def extract_package(course, title, scorm_package):
package = frappe.get_doc("File", scorm_package.name)
zip_path = package.get_full_path()
# check_for_malicious_code(zip_path)
extract_path = frappe.get_site_path("public", "scorm", course, title)
zipfile.ZipFile(zip_path).extractall(extract_path)
return extract_path
def check_for_malicious_code(zip_path):
suspicious_patterns = [
# Unsafe inline JavaScript
r'on(click|load|mouseover|error|submit|focus|blur|change|keyup|keydown|keypress|resize)=".*?"', # Inline event handlers (e.g., onerror, onclick)
r'<script.*?src=["\']http', # External script tags
r"eval\(", # Usage of eval()
r"Function\(", # Usage of Function constructor
r"(btoa|atob)\(", # Base64 encoding/decoding
# Dangerous XML patterns
r"<!ENTITY", # XXE-related
r"<\?xml-stylesheet .*?>", # External stylesheets in XML
]
with zipfile.ZipFile(zip_path, "r") as zf:
for file_name in zf.namelist():
if file_name.endswith((".html", ".js", ".xml")):
with zf.open(file_name) as file:
content = file.read().decode("utf-8", errors="ignore")
for pattern in suspicious_patterns:
if re.search(pattern, content):
frappe.throw(
_("Suspicious pattern found in {0}: {1}").format(file_name, pattern)
)
def get_manifest_file(extract_path):
manifest_file = None
for root, dirs, files in os.walk(extract_path):
for file in files:
if file == "imsmanifest.xml":
manifest_file = os.path.join(root, file)
break
if manifest_file:
break
return manifest_file
def get_launch_file(extract_path):
launch_file = None
manifest_file = get_manifest_file(extract_path)
if manifest_file:
with open(manifest_file) as file:
data = file.read()
dom = parseString(data)
resource = dom.getElementsByTagName("resource")
for res in resource:
if (
res.getAttribute("adlcp:scormtype") == "sco"
or res.getAttribute("adlcp:scormType") == "sco"
):
launch_file = res.getAttribute("href")
break
if launch_file:
launch_file = os.path.join(os.path.dirname(manifest_file), launch_file)
return launch_file
def add_lesson(title, chapter, course):
lesson = frappe.new_doc("Course Lesson")
lesson.update(
{
"title": title,
"chapter": chapter,
"course": course,
}
)
lesson.insert()
lesson_reference = frappe.new_doc("Lesson Reference")
lesson_reference.update(
{
"lesson": lesson.name,
"parent": chapter,
"parenttype": "Course Chapter",
"parentfield": "lessons",
}
)
lesson_reference.insert()
@frappe.whitelist()
def delete_chapter(chapter):
chapterInfo = frappe.db.get_value(
"Course Chapter", chapter, ["is_scorm_package", "scorm_package_path"], as_dict=True
)
if chapterInfo.is_scorm_package:
delete_scorm_package(chapterInfo.scorm_package_path)
frappe.db.delete("Chapter Reference", {"chapter": chapter})
frappe.db.delete("Lesson Reference", {"parent": chapter})
frappe.db.delete("Course Lesson", {"chapter": chapter})
frappe.db.delete("Course Chapter", chapter)
def delete_scorm_package(scorm_package_path):
scorm_package_path = frappe.get_site_path("public", scorm_package_path[1:])
if os.path.exists(scorm_package_path):
shutil.rmtree(scorm_package_path)
@frappe.whitelist()
def mark_lesson_progress(course, chapter_number, lesson_number):
chapter_name = frappe.get_value(
"Chapter Reference", {"parent": course, "idx": chapter_number}, "chapter"
)
lesson_name = frappe.get_value(
"Lesson Reference", {"parent": chapter_name, "idx": lesson_number}, "lesson"
)
save_progress(lesson_name, course)

View File

@@ -7,3 +7,17 @@ from frappe.model.document import Document
class BatchStudent(Document):
pass
@frappe.whitelist()
def enroll_batch(batch_name):
if frappe.db.exists(
"Batch Student", {"student": frappe.session.user, "parent": batch_name}
):
frappe.throw("You are already enrolled in this batch")
enrollment = frappe.new_doc("Batch Student")
enrollment.student = frappe.session.user
enrollment.parent = batch_name
enrollment.parentfield = "students"
enrollment.parenttype = "LMS Batch"
enrollment.save(ignore_permissions=True)

View File

@@ -8,17 +8,10 @@
"editable_grid": 1,
"engine": "InnoDB",
"field_order": [
"course",
"title",
"column_break_3",
"course",
"course_title",
"scorm_section",
"is_scorm_package",
"scorm_package",
"scorm_package_path",
"column_break_dlnw",
"manifest_file",
"launch_file",
"description",
"section_break_5",
"lessons"
],
@@ -42,6 +35,11 @@
"fieldname": "column_break_3",
"fieldtype": "Column Break"
},
{
"fieldname": "description",
"fieldtype": "Small Text",
"label": "Description"
},
{
"fieldname": "section_break_5",
"fieldtype": "Section Break"
@@ -51,56 +49,6 @@
"fieldtype": "Table",
"label": "Lessons",
"options": "Lesson Reference"
},
{
"default": "0",
"fieldname": "is_scorm_package",
"fieldtype": "Check",
"label": "Is SCORM Package"
},
{
"depends_on": "is_scorm_package",
"fieldname": "manifest_file",
"fieldtype": "Code",
"label": "Manifest File",
"read_only": 1
},
{
"depends_on": "is_scorm_package",
"fieldname": "launch_file",
"fieldtype": "Code",
"label": "Launch File",
"read_only": 1
},
{
"fieldname": "scorm_section",
"fieldtype": "Section Break",
"label": "SCORM"
},
{
"fieldname": "scorm_package",
"fieldtype": "Link",
"label": "SCORM Package",
"options": "File",
"read_only": 1
},
{
"fieldname": "column_break_dlnw",
"fieldtype": "Column Break"
},
{
"depends_on": "is_scorm_package",
"fieldname": "scorm_package_path",
"fieldtype": "Code",
"label": "SCORM Package Path",
"read_only": 1
},
{
"fetch_from": "course.title",
"fieldname": "course_title",
"fieldtype": "Data",
"label": "Course Title",
"read_only": 1
}
],
"index_web_pages_for_search": 1,
@@ -111,7 +59,7 @@
"link_fieldname": "chapter"
}
],
"modified": "2024-11-15 12:03:31.370943",
"modified": "2023-09-29 17:03:58.013819",
"modified_by": "Administrator",
"module": "LMS",
"name": "Course Chapter",
@@ -131,14 +79,17 @@
"write": 1
},
{
"create": 1,
"email": 1,
"export": 1,
"if_owner": 1,
"print": 1,
"read": 1,
"report": 1,
"role": "LMS Student",
"select": 1,
"share": 1
"share": 1,
"write": 1
}
],
"search_fields": "title",

View File

@@ -1,27 +1,10 @@
# Copyright (c) 2021, FOSS United and contributors
# For license information, please see license.txt
import frappe
# import frappe
from frappe.model.document import Document
from lms.lms.utils import get_course_progress
from lms.lms.api import update_course_statistics
from frappe.utils.telemetry import capture
class CourseChapter(Document):
def on_update(self):
self.recalculate_course_progress()
update_course_statistics()
def recalculate_course_progress(self):
previous_lessons = (
self.get_doc_before_save() and self.get_doc_before_save().as_dict().lessons
)
current_lessons = self.lessons
if previous_lessons and previous_lessons != current_lessons:
enrolled_members = frappe.get_all(
"LMS Enrollment", {"course": self.course}, ["member", "name"]
)
for enrollment in enrolled_members:
new_progress = get_course_progress(self.course, enrollment.member)
frappe.db.set_value("LMS Enrollment", enrollment.name, "progress", new_progress)
pass

View File

@@ -8,18 +8,12 @@
"editable_grid": 1,
"engine": "InnoDB",
"field_order": [
"chapter",
"course",
"column_break_4",
"title",
"include_in_preview",
"column_break_4",
"chapter",
"is_scorm_package",
"course",
"section_break_11",
"content",
"body",
"column_break_cjmf",
"instructor_content",
"instructor_notes",
"index_label",
"section_break_6",
"youtube",
"column_break_9",
@@ -28,7 +22,13 @@
"question",
"column_break_15",
"file_type",
"column_break_syza",
"section_break_11",
"content",
"body",
"column_break_cjmf",
"instructor_content",
"instructor_notes",
"help_section",
"help"
],
"fields": [
@@ -59,6 +59,12 @@
"label": "Title",
"reqd": 1
},
{
"fieldname": "index_label",
"fieldtype": "Data",
"label": "Index Label",
"read_only": 1
},
{
"fieldname": "section_break_6",
"fieldtype": "Section Break",
@@ -68,7 +74,14 @@
"fieldname": "body",
"fieldtype": "Markdown Editor",
"ignore_xss_filter": 1,
"label": "Body"
"label": "Body",
"reqd": 1
},
{
"fieldname": "help_section",
"fieldtype": "Section Break",
"hidden": 1,
"label": "Help"
},
{
"fieldname": "help",
@@ -145,23 +158,11 @@
"fieldname": "instructor_content",
"fieldtype": "Text",
"label": "Instructor Content"
},
{
"fieldname": "column_break_syza",
"fieldtype": "Column Break"
},
{
"default": "0",
"fetch_from": "chapter.is_scorm_package",
"fieldname": "is_scorm_package",
"fieldtype": "Check",
"label": "Is SCORM Package",
"read_only": 1
}
],
"index_web_pages_for_search": 1,
"links": [],
"modified": "2024-11-14 13:46:56.838659",
"modified": "2024-10-08 11:04:54.748773",
"modified_by": "Administrator",
"module": "LMS",
"name": "Course Lesson",

View File

@@ -52,6 +52,7 @@ class CourseLesson(Document):
ex.lesson = None
ex.course = None
ex.index_ = 0
ex.index_label = ""
ex.save(ignore_permissions=True)
def check_and_create_folder(self):
@@ -89,25 +90,27 @@ def save_progress(lesson, course):
"LMS Enrollment", {"course": course, "member": frappe.session.user}
)
if not membership:
return 0
return
frappe.db.set_value("LMS Enrollment", membership, "current_lesson", lesson)
already_completed = frappe.db.exists(
"LMS Course Progress", {"lesson": lesson, "member": frappe.session.user}
)
quiz_completed = get_quiz_progress(lesson)
assignment_completed = get_assignment_progress(lesson)
if not quiz_completed:
return 0
if not already_completed and quiz_completed and assignment_completed:
frappe.get_doc(
{
"doctype": "LMS Course Progress",
"lesson": lesson,
"status": "Complete",
"member": frappe.session.user,
}
).save(ignore_permissions=True)
if frappe.db.exists(
"LMS Course Progress", {"lesson": lesson, "member": frappe.session.user}
):
return
frappe.get_doc(
{
"doctype": "LMS Course Progress",
"lesson": lesson,
"status": "Complete",
"member": frappe.session.user,
}
).save(ignore_permissions=True)
progress = get_course_progress(course)
capture_progress_for_analytics(progress, course)
@@ -157,32 +160,6 @@ def get_quiz_progress(lesson):
return True
def get_assignment_progress(lesson):
lesson_details = frappe.db.get_value(
"Course Lesson", lesson, ["body", "content"], as_dict=1
)
assignments = []
if lesson_details.content:
content = json.loads(lesson_details.content)
for block in content.get("blocks"):
if block.get("type") == "assignment":
assignments.append(block.get("data").get("assignment"))
elif lesson_details.body:
macros = find_macros(lesson_details.body)
assignments = [value for name, value in macros if name == "Assignment"]
for assignment in assignments:
if not frappe.db.exists(
"LMS Assignment Submission",
{"assignment": assignment, "member": frappe.session.user},
):
return False
return True
@frappe.whitelist()
def get_lesson_info(chapter):
return frappe.db.get_value("Course Chapter", chapter, "course")

View File

@@ -9,11 +9,10 @@
"engine": "InnoDB",
"field_order": [
"title",
"grade_assignment",
"question",
"column_break_hmwv",
"type",
"grade_assignment",
"section_break_sjti",
"show_answer",
"answer"
],
@@ -21,8 +20,7 @@
{
"fieldname": "question",
"fieldtype": "Text Editor",
"label": "Question",
"reqd": 1
"label": "Question"
},
{
"fieldname": "type",
@@ -30,16 +28,14 @@
"in_list_view": 1,
"in_standard_filter": 1,
"label": "Type",
"options": "Document\nPDF\nURL\nImage\nText",
"reqd": 1
"options": "Document\nPDF\nURL\nImage\nText"
},
{
"fieldname": "title",
"fieldtype": "Data",
"in_list_view": 1,
"in_standard_filter": 1,
"label": "Title",
"reqd": 1
"label": "Title"
},
{
"fieldname": "column_break_hmwv",
@@ -64,15 +60,11 @@
"fieldname": "grade_assignment",
"fieldtype": "Check",
"label": "Grade Assignment"
},
{
"fieldname": "section_break_sjti",
"fieldtype": "Section Break"
}
],
"index_web_pages_for_search": 1,
"links": [],
"modified": "2024-12-24 09:36:31.464508",
"modified": "2024-04-05 12:01:36.601160",
"modified_by": "Administrator",
"module": "LMS",
"name": "LMS Assignment",

View File

@@ -14,17 +14,19 @@
"member",
"member_name",
"section_break_dlzh",
"question",
"column_break_zvis",
"assignment_attachment",
"answer",
"column_break_oqqy",
"evaluator",
"status",
"comments",
"section_break_rqal",
"question",
"status",
"evaluator",
"column_break_esgd",
"comments",
"section_break_cwaw",
"lesson",
"course",
"lesson"
"column_break_ygdu"
],
"fields": [
{
@@ -87,7 +89,8 @@
"fieldname": "evaluator",
"fieldtype": "Link",
"label": "Evaluator",
"options": "User"
"options": "User",
"read_only": 1
},
{
"depends_on": "eval:!([\"URL\", \"Text\"]).includes(doc.type);",
@@ -125,6 +128,14 @@
"fieldname": "column_break_esgd",
"fieldtype": "Column Break"
},
{
"fieldname": "section_break_cwaw",
"fieldtype": "Section Break"
},
{
"fieldname": "column_break_ygdu",
"fieldtype": "Column Break"
},
{
"depends_on": "eval:([\"URL\", \"Text\"]).includes(doc.type);",
"fieldname": "answer",
@@ -137,14 +148,14 @@
"fieldtype": "Section Break"
},
{
"fieldname": "column_break_oqqy",
"fieldname": "column_break_zvis",
"fieldtype": "Column Break"
}
],
"index_web_pages_for_search": 1,
"links": [],
"make_attachments_public": 1,
"modified": "2024-12-24 21:22:35.212732",
"modified": "2024-04-05 15:57:22.758563",
"modified_by": "Administrator",
"module": "LMS",
"name": "LMS Assignment Submission",

View File

@@ -6,14 +6,12 @@ from frappe import _
from frappe.model.document import Document
from frappe.utils import validate_url, validate_email_address
from frappe.email.doctype.email_template.email_template import get_email_template
from frappe.desk.doctype.notification_log.notification_log import make_notification_logs
class LMSAssignmentSubmission(Document):
def validate(self):
self.validate_duplicates()
self.validate_url()
self.validate_status()
def after_insert(self):
if not frappe.flags.in_test:
@@ -71,28 +69,6 @@ class LMSAssignmentSubmission(Document):
header=[subject, "green"],
)
def validate_status(self):
doc_before_save = self.get_doc_before_save()
if doc_before_save.status != self.status or doc_before_save.comments != self.comments:
self.trigger_update_notification()
def trigger_update_notification(self):
notification = frappe._dict(
{
"subject": _(
"There has been an update on your submission for assignment {0}"
).format(self.assignment_title),
"email_content": self.comments,
"document_type": self.doctype,
"document_name": self.name,
"for_user": self.owner,
"from_user": self.evaluator,
"type": "Alert",
"link": f"/assignment-submission/{self.assignment}/{self.name}",
}
)
make_notification_logs(notification, [self.member])
@frappe.whitelist()
def upload_assignment(

View File

@@ -193,15 +193,13 @@
"depends_on": "paid_batch",
"fieldname": "amount",
"fieldtype": "Currency",
"label": "Amount",
"mandatory_depends_on": "paid_batch"
"label": "Amount"
},
{
"depends_on": "paid_batch",
"fieldname": "currency",
"fieldtype": "Link",
"label": "Currency",
"mandatory_depends_on": "paid_batch",
"options": "Currency"
},
{
@@ -330,7 +328,7 @@
],
"index_web_pages_for_search": 1,
"links": [],
"modified": "2024-11-18 16:28:41.336928",
"modified": "2024-07-18 18:06:37.229885",
"modified_by": "Administrator",
"module": "LMS",
"name": "LMS Batch",

View File

@@ -28,13 +28,11 @@ class LMSBatch(Document):
self.validate_duplicate_courses()
self.validate_duplicate_students()
self.validate_payments_app()
self.validate_amount_and_currency()
self.validate_duplicate_assessments()
self.validate_membership()
self.validate_timetable()
self.send_confirmation_mail()
self.validate_evaluation_end_date()
self.add_students_to_live_class()
def validate_batch_end_date(self):
if self.end_date < self.start_date:
@@ -65,10 +63,6 @@ class LMSBatch(Document):
if "payments" not in installed_apps:
frappe.throw(_("Please install the Payments app to create a paid batches."))
def validate_amount_and_currency(self):
if self.paid_batch and (not self.amount or not self.currency):
frappe.throw(_("Amount and currency are required for paid batches."))
def validate_duplicate_assessments(self):
assessments = [row.assessment_name for row in self.assessment]
for assessment in self.assessment:
@@ -145,27 +139,6 @@ class LMSBatch(Document):
if cint(self.seat_count) < len(self.students):
frappe.throw(_("There are no seats available in this batch."))
def add_students_to_live_class(self):
for student in self.students:
if student.is_new():
live_classes = frappe.get_all(
"LMS Live Class", {"batch_name": self.name}, ["name", "event"]
)
for live_class in live_classes:
if live_class.event:
frappe.get_doc(
{
"doctype": "Event Participants",
"reference_doctype": "User",
"reference_docname": student.student,
"email": student.student,
"parent": live_class.event,
"parenttype": "Event",
"parentfield": "event_participants",
}
).save()
def validate_timetable(self):
for schedule in self.timetable:
if schedule.start_time and schedule.end_time:

View File

@@ -114,7 +114,7 @@
],
"index_web_pages_for_search": 1,
"links": [],
"modified": "2024-09-11 11:37:20.419956",
"modified": "2024-09-11 11:37:20.419955",
"modified_by": "Administrator",
"module": "LMS",
"name": "LMS Certificate",

View File

@@ -48,12 +48,7 @@
"certification_section",
"enable_certification",
"column_break_rxww",
"expiry",
"tab_4_tab",
"statistics_section",
"enrollments",
"lessons",
"rating"
"expiry"
],
"fields": [
{
@@ -254,36 +249,6 @@
"fieldtype": "Link",
"label": "Category",
"options": "LMS Category"
},
{
"fieldname": "tab_4_tab",
"fieldtype": "Tab Break",
"label": "Statistics"
},
{
"fieldname": "statistics_section",
"fieldtype": "Section Break"
},
{
"default": "0",
"fieldname": "enrollments",
"fieldtype": "Data",
"label": "Enrollments",
"read_only": 1
},
{
"default": "0",
"fieldname": "lessons",
"fieldtype": "Data",
"label": "Lessons",
"read_only": 1
},
{
"default": "0",
"fieldname": "rating",
"fieldtype": "Data",
"label": "Rating",
"read_only": 1
}
],
"is_published_field": "published",
@@ -310,7 +275,7 @@
}
],
"make_attachments_public": 1,
"modified": "2024-10-30 23:08:31.842860",
"modified": "2024-09-21 10:23:58.633912",
"modified_by": "Administrator",
"module": "LMS",
"name": "LMS Course",

Some files were not shown because too many files have changed in this diff Show More