diff --git a/lms/lms/doctype/lms_settings/lms_settings.json b/lms/lms/doctype/lms_settings/lms_settings.json index c69e4d8f..8abdf6f6 100644 --- a/lms/lms/doctype/lms_settings/lms_settings.json +++ b/lms/lms/doctype/lms_settings/lms_settings.json @@ -16,6 +16,7 @@ "portal_course_creation", "section_break_szgq", "send_calendar_invite_for_evaluations", + "show_day_view", "allow_student_progress", "column_break_2", "show_dashboard", @@ -341,12 +342,18 @@ { "fieldname": "column_break_uwsp", "fieldtype": "Column Break" + }, + { + "default": "0", + "fieldname": "show_day_view", + "fieldtype": "Check", + "label": "Show Day View in Timetable" } ], "index_web_pages_for_search": 1, "issingle": 1, "links": [], - "modified": "2023-11-07 11:23:14.257687", + "modified": "2023-12-12 10:32:13.638368", "modified_by": "Administrator", "module": "LMS", "name": "LMS Settings", diff --git a/lms/public/css/style.css b/lms/public/css/style.css index eb82e49d..9e5791ab 100644 --- a/lms/public/css/style.css +++ b/lms/public/css/style.css @@ -2387,6 +2387,7 @@ select { border: 1px solid var(--gray-200) !important; border-radius: var(--border-radius-md) !important; background-color: var(--gray-100) !important; + overflow: auto; } .toastui-calendar-panel .toastui-calendar-day-names.toastui-calendar-week { @@ -2442,13 +2443,23 @@ select { } .calendar-legends { - display: flex; - align-items: center; - justify-content: space-between; - width: 50%; + display: grid; + grid-template-columns: repeat(4, 1fr); + width: 75%; margin: 0 auto 1rem; } +@media (max-width: 767px) { + .calendar-legends { + grid-template-columns: repeat(2, 1fr); + width: 100%; + } + + .legend-item { + margin-bottom: 0.5rem; + } +} + .batch-details { width: 50%; margin: 2rem 0; diff --git a/lms/www/batches/batch.html b/lms/www/batches/batch.html index cd38e0ef..cc501ddc 100644 --- a/lms/www/batches/batch.html +++ b/lms/www/batches/batch.html @@ -638,8 +638,10 @@ frappe.boot.single_types = [] let courses = {{ course_list | json }}; const legends = {{ legends | json }}; - const allow_future = {{ batch_info.allow_future }} + const allow_future = {{ batch_info.allow_future }}; + const is_student = "{{ is_student or '' }}"; const evaluation_end_date = "{{ batch_info.evaluation_end_date if batch_info.evaluation_end_date else '' }}" + const show_day_view = {{ settings.show_day_view }}; diff --git a/lms/www/batches/batch.js b/lms/www/batches/batch.js index 9a71e5e6..155b762d 100644 --- a/lms/www/batches/batch.js +++ b/lms/www/batches/batch.js @@ -672,7 +672,7 @@ const get_calendar_options = (element, calendar_id) => { const end_time = element.data("end"); return { - defaultView: "week", + defaultView: $(window).width() < 768 || show_day_view ? "day" : "week", usageStatistics: false, week: { narrowWeekend: true, @@ -692,6 +692,17 @@ const get_calendar_options = (element, calendar_id) => { }, ], template: { + allday: function (event) { + let hide = event.raw.completed ? "" : "hide"; + return `
+ +
${event.title}
+
`; + }, time: function (event) { let hide = event.raw.completed ? "" : "hide"; return `
{ calendar.on("clickEvent", ({ event }) => { let event_date = event.start.d.d; event_date = moment(event_date).format("YYYY-MM-DD"); - let current_date = moment().format("YYYY-MM-DD"); - if (!moment(event_date).isSameOrBefore(current_date) && !allow_future) + if ( + is_student && + !moment(event_date).isSameOrBefore(current_date) && + !allow_future + ) return; - if (event.raw.milestone) { + if (is_student && event.raw.milestone) { frappe.call({ method: "lms.lms.doctype.lms_batch.lms_batch.is_milestone_complete", args: { @@ -783,29 +798,49 @@ const add_links_to_events = (calendar) => { const scroll_to_date = (calendar, events) => { if ( new Date() < new Date(events[0].date) || - new Date() > new Date(events.slice(-1).date) + new Date() > new Date(events.slice(-1)[0].date) ) { calendar.setDate(new Date(events[0].date)); } }; const set_calendar_range = (calendar, events) => { - let week_start = moment(calendar.getDateRangeStart().d.d); - let week_end = moment(calendar.getDateRangeEnd().d.d); + let day_view = $(window).width() < 768 || show_day_view ? true : false; + if (day_view) { + let calendar_date = moment(calendar.getDate().d.d).format( + "DD MMMM YYYY" + ); + $(".calendar-range").text(`${calendar_date}`); - $(".calendar-range").text( - `${moment(week_start).format("DD MMMM YYYY")} - ${moment( - week_end - ).format("DD MMMM YYYY")}` - ); + if (moment(events[0].date).isSameOrBefore(moment(calendar))) + $("#prev-week").hide(); + else $("#prev-week").show(); - if (week_start.diff(moment(events[0].date), "days") <= 0) - $("#prev-week").hide(); - else $("#prev-week").show(); + if ( + moment(calendar_date).isSameOrAfter( + moment(events.slice(-1)[0].date) + ) + ) + $("#next-week").hide(); + else $("#next-week").show(); + } else { + let week_start = moment(calendar.getDateRangeStart().d.d); + let week_end = moment(calendar.getDateRangeEnd().d.d); - if (week_end.diff(moment(events.slice(-1)[0].date), "days") > 0) - $("#next-week").hide(); - else $("#next-week").show(); + $(".calendar-range").text( + `${moment(week_start).format("DD MMMM YYYY")} - ${moment( + week_end + ).format("DD MMMM YYYY")}` + ); + + if (week_start.diff(moment(events[0].date), "days") <= 0) + $("#prev-week").hide(); + else $("#prev-week").show(); + + if (week_end.diff(moment(events.slice(-1)[0].date), "days") > 0) + $("#next-week").hide(); + else $("#next-week").show(); + } }; const get_background_color = (doctype) => {