Merge branch 'develop' of https://github.com/frappe/lms into share-badge

frontend/src/components/CourseCard.vue

@@ -10,6 +10,15 @@
 			:style="{ backgroundImage: 'url(\'' + encodeURI(course.image) + '\')' }"
 		>
 			<div class="flex relative top-4 left-4 w-fit flex-wrap">
+				<Badge
+					v-if="course.featured"
+					variant="subtle"
+					theme="green"
+					size="md"
+					class="mr-2"
+				>
+					{{ __('Featured') }}
+				</Badge>
 				<Badge
 					variant="outline"
 					theme="gray"

frontend/src/components/CourseOutline.vue

@@ -2,7 +2,7 @@
 	<div class="text-base">
 		<div
 			v-if="title && (outline.data?.length || allowEdit)"
-			class="grid grid-cols-[70%,30%] mb-4"
+			class="grid grid-cols-[70%,30%] mb-4 px-2"
 		>
 			<div class="font-semibold text-lg">
 				{{ __(title) }}

frontend/src/pages/CertifiedParticipants.vue

@@ -38,9 +38,6 @@
 								{{ participant.full_name }}
 							</div>
 						</router-link>
-						<div class="font-medium text-gray-700 text-xs mb-1">
-							{{ __('is certified for') }}
-						</div>
 						<div class="leading-5" v-for="course in participant.courses">
 							{{ course }}
 						</div>

frontend/src/pages/Courses.vue

@@ -26,14 +26,7 @@
 			</div>
 		</header>
 		<div class="">
-			<div
-				v-if="courses.data.length == 0 && courses.list.loading"
-				class="p-5 text-base text-gray-700"
-			>
-				{{ __('Loading Courses...') }}
-			</div>
 			<Tabs
-				v-else
 				v-model="tabIndex"
 				tablistClass="overflow-x-visible flex-wrap !gap-3 md:flex-nowrap"
 				:tabs="tabs"

frontend/src/pages/CreateCourse.vue

@@ -126,32 +126,41 @@
 						<div class="text-lg font-semibold mt-5 mb-4">
 							{{ __('Settings') }}
 						</div>
-						<div
-							v-if="user.data?.is_moderator"
-							class="flex items-center justify-between mb-4"
-						>
-							<FormControl
-								type="checkbox"
-								v-model="course.published"
-								:label="__('Published')"
-							/>
-							<FormControl
-								type="checkbox"
-								v-model="course.upcoming"
-								:label="__('Upcoming')"
-							/>
-							<FormControl
-								type="checkbox"
-								v-model="course.disable_self_learning"
-								:label="__('Disable Self Enrollment')"
-							/>
+						<div class="grid grid-cols-2 gap-10 mb-4">
+							<div
+								v-if="user.data?.is_moderator"
+								class="flex flex-col space-y-3"
+							>
+								<FormControl
+									type="checkbox"
+									v-model="course.published"
+									:label="__('Published')"
+								/>
+								<FormControl
+									v-model="course.published_on"
+									:label="__('Published On')"
+									type="date"
+									class="mb-5"
+								/>
+							</div>
+							<div class="flex flex-col space-y-3">
+								<FormControl
+									type="checkbox"
+									v-model="course.upcoming"
+									:label="__('Upcoming')"
+								/>
+								<FormControl
+									type="checkbox"
+									v-model="course.featured"
+									:label="__('Featured')"
+								/>
+								<FormControl
+									type="checkbox"
+									v-model="course.disable_self_learning"
+									:label="__('Disable Self Enrollment')"
+								/>
+							</div>
 						</div>
-						<FormControl
-							v-model="course.published_on"
-							:label="__('Published On')"
-							type="date"
-							class="mb-5"
-						/>
 					</div>
 					<div class="container border-t">
 						<div class="text-lg font-semibold mt-5 mb-4">
@@ -196,11 +205,18 @@ import {
 	TextEditor,
 	Button,
 	createResource,
-	createDocumentResource,
 	FormControl,
 	FileUploader,
 } from 'frappe-ui'
-import { inject, onMounted, computed, ref, reactive, watch } from 'vue'
+import {
+	inject,
+	onMounted,
+	onBeforeUnmount,
+	computed,
+	ref,
+	reactive,
+	watch,
+} from 'vue'
 import { convertToTitleCase, showToast, getFileSize } from '../utils'
 import Link from '@/components/Controls/Link.vue'
 import { FileText, X } from 'lucide-vue-next'
@@ -227,6 +243,7 @@ const course = reactive({
 	tags: '',
 	published: false,
 	published_on: '',
+	featured: false,
 	upcoming: false,
 	disable_self_learning: false,
 	paid_course: false,
@@ -246,6 +263,22 @@ onMounted(() => {
 	if (props.courseName !== 'new') {
 		courseResource.reload()
 	}
+	window.addEventListener('keydown', keyboardShortcut)
+})
+
+const keyboardShortcut = (e) => {
+	if (
+		e.key === 's' &&
+		(e.ctrlKey || e.metaKey) &&
+		!e.target.classList.contains('ProseMirror')
+	) {
+		submitCourse()
+		e.preventDefault()
+	}
+}
+
+onBeforeUnmount(() => {
+	window.removeEventListener('keydown', keyboardShortcut)
 })
 
 const courseCreationResource = createResource({

frontend/src/pages/Statistics.vue

@@ -13,7 +13,7 @@
 					</div>
 					<div>
 						<div class="text-xl font-semibold mb-1">
-							{{ chartDetails.data.courses }}
+							{{ formatNumber(chartDetails.data.courses) }}
 						</div>
 						<div class="text-gray-700">
 							{{ __('Published Courses') }}
@@ -26,7 +26,7 @@
 					</div>
 					<div>
 						<div class="text-xl font-semibold mb-1">
-							{{ chartDetails.data.users }}
+							{{ formatNumber(chartDetails.data.users) }}
 						</div>
 						<div class="text-gray-700">
 							{{ __('Total Signups') }}
@@ -39,7 +39,7 @@
 					</div>
 					<div>
 						<div class="text-xl font-semibold mb-1">
-							{{ chartDetails.data.enrollments }}
+							{{ formatNumber(chartDetails.data.enrollments) }}
 						</div>
 						<div class="text-gray-700">
 							{{ __('Enrolled Users') }}
@@ -52,7 +52,7 @@
 					</div>
 					<div>
 						<div class="text-xl font-semibold mb-1">
-							{{ chartDetails.data.completions }}
+							{{ formatNumber(chartDetails.data.completions) }}
 						</div>
 						<div class="text-gray-700">
 							{{ __('Courses Completed') }}
@@ -65,7 +65,7 @@
 					</div>
 					<div>
 						<div class="text-xl font-semibold mb-1">
-							{{ chartDetails.data.lesson_completions }}
+							{{ formatNumber(chartDetails.data.lesson_completions) }}
 						</div>
 						<div class="text-gray-700">
 							{{ __('Lessons Completed') }}
@@ -109,6 +109,7 @@
 <script setup>
 import { createResource, Breadcrumbs } from 'frappe-ui'
 import { computed, inject } from 'vue'
+import { formatNumber } from '@/utils'
 import { Line, Pie } from 'vue-chartjs'
 import {
 	Chart as ChartJS,

frontend/src/utils/index.js

@@ -47,6 +47,12 @@ export function formatTime(timeString) {
 	return formattedTime
 }
 
+export function formatNumber(number) {
+	return number.toLocaleString('en-IN', {
+		maximumFractionDigits: 0,
+	})
+}
+
 export function formatNumberIntoCurrency(number, currency) {
 	if (number) {
 		return number.toLocaleString('en-IN', {