feat: add and remove students and courses from class
This commit is contained in:
Jannat Patel
@@ -0,0 +1,142 @@
|
||||
{% extends "templates/base.html" %}
|
||||
{% block title %}
|
||||
{{ _(class_info.title) }}
|
||||
{% endblock %}
|
||||
|
||||
|
||||
{% block content %}
|
||||
<div class="common-page-style">
|
||||
<div class="container">
|
||||
{{ BreadCrumb(class_info) }}
|
||||
<div class="common-card-style column-card">
|
||||
{{ ClassDetails(class_info) }}
|
||||
{{ ClassSections(class_info, class_courses, class_students, published_courses) }}
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
{% endblock %}
|
||||
|
||||
|
||||
<!-- BreadCrumb -->
|
||||
{% macro BreadCrumb(class_info) %}
|
||||
<div class="breadcrumb">
|
||||
<a class="dark-links" href="/classes">{{ _("All Classes") }}</a>
|
||||
<img class="ml-1 mr-1" src="/assets/lms/icons/chevron-right.svg">
|
||||
<span class="breadcrumb-destination">{{ class_info.title }}</span>
|
||||
</div>
|
||||
{% endmacro %}
|
||||
|
||||
|
||||
<!-- Class Details -->
|
||||
{% macro ClassDetails(class_info) %}
|
||||
<div class="class-details" data-class="{{ class_info.name }}">
|
||||
<div class="course-home-headings">
|
||||
{{ class_info.title }}
|
||||
</div>
|
||||
<div>
|
||||
{{ class_info.description }}
|
||||
</div>
|
||||
<div class="medium">
|
||||
{% if class_info.start_date %}
|
||||
<span>
|
||||
{{ frappe.utils.format_date(class_info.start_date, "medium") }} -
|
||||
</span>
|
||||
{% endif %}
|
||||
{% if class_info.end_date %}
|
||||
<span>
|
||||
{{ frappe.utils.format_date(class_info.end_date, "medium") }}
|
||||
</span>
|
||||
{% endif %}
|
||||
</div>
|
||||
</div>
|
||||
{% endmacro %}
|
||||
|
||||
|
||||
<!-- Class Sections -->
|
||||
{% macro ClassSections(class_info, class_courses, class_students, published_courses) %}
|
||||
<div class="mt-4">
|
||||
<ul class="nav lms-nav" id="classes-tab">
|
||||
<li class="nav-item">
|
||||
<a class="nav-link active" data-toggle="tab" href="#courses">
|
||||
{{ _("Courses") }}
|
||||
</a>
|
||||
</li>
|
||||
|
||||
<li class="nav-item">
|
||||
<a class="nav-link" data-toggle="tab" href="#students">
|
||||
{{ _("Students") }}
|
||||
</a>
|
||||
</li>
|
||||
|
||||
</ul>
|
||||
|
||||
<div class="border-bottom mb-4"></div>
|
||||
|
||||
<div class="tab-content">
|
||||
<div class="tab-pane active" id="courses" role="tabpanel" aria-labelledby="courses">
|
||||
{{ CoursesSection(class_info, class_courses, published_courses) }}
|
||||
</div>
|
||||
|
||||
<div class="tab-pane" id="students" role="tabpanel" aria-labelledby="students">
|
||||
{{ StudentsSection(class_info, class_students) }}
|
||||
</div>
|
||||
|
||||
</div>
|
||||
</div>
|
||||
{% endmacro %}
|
||||
|
||||
|
||||
{% macro CoursesSection(class_info, class_courses, published_courses) %}
|
||||
<div class="class-course-list">
|
||||
{% if published_courses | length %}
|
||||
{% for course in published_courses %}
|
||||
{% set checked = course.name in class_courses %}
|
||||
<label class="class-course" data-course="{{ course.name }}">
|
||||
<input type="checkbox" {% if checked %} checked {% endif %}>
|
||||
{{ course.title }}
|
||||
</label>
|
||||
{% endfor %}
|
||||
{% endif %}
|
||||
</div>
|
||||
{% endmacro %}
|
||||
|
||||
|
||||
{% macro StudentsSection(class_info, class_students) %}
|
||||
<div class="medium">
|
||||
{{ AddStudents() }}
|
||||
|
||||
{% if class_students | length %}
|
||||
<div class="mt-10">
|
||||
{% for student in class_students %}
|
||||
<div class="">
|
||||
<span>{{ student.student_name }}</span>
|
||||
<svg class="icon icon-md pull-right remove-student" data-student="{{ student.student }}">
|
||||
<use href="#icon-delete"></use>
|
||||
</svg>
|
||||
</div>
|
||||
{% if not loop.last %} <hr> {% endif %}
|
||||
{% endfor %}
|
||||
</div>
|
||||
{% else %}
|
||||
<p class="text-muted"> {{ _("No Students are added to this class.") }} </p>
|
||||
{% endif %}
|
||||
</div>
|
||||
{% endmacro %}
|
||||
|
||||
|
||||
{% macro AddStudents() %}
|
||||
<div>
|
||||
<div class="mb-2">
|
||||
{{ _("Add Student") }}
|
||||
</div>
|
||||
<form>
|
||||
<div class="control-input-wrapper mb-2 w-50">
|
||||
<div class="control-input">
|
||||
<input type="text" autocomplete="off" class="input-with-feedback form-control" id="student-email"
|
||||
spellcheck="false">
|
||||
</div>
|
||||
</div>
|
||||
<button class="btn btn-primary btn-sm" id="submit-student"> {{ _("Add") }} </button>
|
||||
</form>
|
||||
</div>
|
||||
{% endmacro %}
|
||||
|
||||
67
lms/www/classes/class.js
Normal file
67
lms/www/classes/class.js
Normal file
@@ -0,0 +1,67 @@
|
||||
frappe.ready(() => {
|
||||
|
||||
$("#submit-student").click((e) => {
|
||||
submit_student(e);
|
||||
});
|
||||
|
||||
$(".remove-student").click((e) => {
|
||||
remove_student(e);
|
||||
});
|
||||
|
||||
$(".class-course").click((e) => {
|
||||
update_course(e);
|
||||
});
|
||||
|
||||
});
|
||||
|
||||
|
||||
const submit_student = (e) => {
|
||||
e.preventDefault();
|
||||
frappe.call({
|
||||
method: "lms.lms.doctype.lms_class.lms_class.add_student",
|
||||
args: {
|
||||
"email": $("#student-email").val(),
|
||||
"class_name": $(".class-details").data("class")
|
||||
},
|
||||
callback: (data) => {
|
||||
frappe.show_alert({
|
||||
message: __("Student added successfully"),
|
||||
indicator: "green",
|
||||
} ,3);
|
||||
window.location.reload();
|
||||
}
|
||||
})
|
||||
};
|
||||
|
||||
|
||||
const remove_student = (e) => {
|
||||
frappe.confirm("Are you sure you want to remove this student from the class?",
|
||||
() => {
|
||||
frappe.call({
|
||||
method: "lms.lms.doctype.lms_class.lms_class.remove_student",
|
||||
args: {
|
||||
"student": $(e.currentTarget).data("student"),
|
||||
"class_name": $(".class-details").data("class")
|
||||
},
|
||||
callback: (data) => {
|
||||
frappe.show_alert({
|
||||
message: __("Student removed successfully"),
|
||||
indicator: "green",
|
||||
}, 3);
|
||||
window.location.reload();
|
||||
}
|
||||
});
|
||||
})
|
||||
}
|
||||
|
||||
|
||||
const update_course = (e) => {
|
||||
frappe.call({
|
||||
method: "lms.lms.doctype.lms_class.lms_class.update_course",
|
||||
args: {
|
||||
"course": $(e.currentTarget).data("course"),
|
||||
"value": $(e.currentTarget).children("input").prop("checked") ? 1 : 0,
|
||||
"class_name": $(".class-details").data("class")
|
||||
}
|
||||
})
|
||||
};
|
||||
@@ -0,0 +1,17 @@
|
||||
import frappe
|
||||
|
||||
|
||||
def get_context(context):
|
||||
context.no_cache = 1
|
||||
class_name = frappe.form_dict["classname"]
|
||||
|
||||
context.class_info = frappe.db.get_value("LMS Class", class_name, ["name", "title", "start_date", "end_date", "description"], as_dict=True)
|
||||
context.published_courses = frappe.get_all("LMS Course", {"published": 1}, ["name", "title"])
|
||||
|
||||
context.class_courses = frappe.get_all("Class Course", {
|
||||
"parent": class_name
|
||||
}, pluck="course")
|
||||
|
||||
context.class_students = frappe.get_all("Class Student", {
|
||||
"parent": class_name
|
||||
}, ["student", "student_name"])
|
||||
|
||||
@@ -6,17 +6,39 @@
|
||||
{% block content %}
|
||||
<div class="common-page-style">
|
||||
<div class="container">
|
||||
<a class="btn btn-default btn-sm pull-right" href="/classes/new-class">
|
||||
<a class="btn btn-default btn-sm pull-right" href="/class/new">
|
||||
{{ _("Create Class") }}
|
||||
</a>
|
||||
<div class="course-home-headings"> {{ _("All Classes") }} </div>
|
||||
{% if classes %}
|
||||
<div class="cards-parent">
|
||||
{% for class in classes %}
|
||||
<div class="common-card-style column-card">
|
||||
<div class="course-card-title">
|
||||
{{ class.title }}
|
||||
</div>
|
||||
<div class="medium">
|
||||
{% if class.start_date %}
|
||||
<span>
|
||||
{{ frappe.utils.format_date(class.start_date, "medium") }} -
|
||||
</span>
|
||||
{% endif %}
|
||||
{% if class.end_date %}
|
||||
<span>
|
||||
{{ frappe.utils.format_date(class.end_date, "medium") }}
|
||||
</span>
|
||||
{% endif %}
|
||||
</div>
|
||||
<a class="stretched-link" href="/classes/{{ class.name }}"></a>
|
||||
</div>
|
||||
{% endfor %}
|
||||
</div>
|
||||
{% else %}
|
||||
<div class="empty-state">
|
||||
<img class="icon icon-xl" src="/assets/lms/icons/comment.svg">
|
||||
<div class="empty-state-text">
|
||||
<div class="empty-state-heading">{{ _("No Classes") }}</div>
|
||||
<div class="course-meta">{{ _("There are no classes on this site.") }}</div>
|
||||
<div class="course-meta">{{ _("Nothing to see here.") }}</div>
|
||||
</div>
|
||||
</div>
|
||||
{% endif %}
|
||||
|
||||
@@ -2,3 +2,4 @@ import frappe
|
||||
|
||||
def get_context(context):
|
||||
context.no_cache = 1
|
||||
context.classes = frappe.get_all("LMS Class", fields=["name", "title", "start_date", "end_date"])
|
||||
|
||||
Reference in New Issue
Block a user