Untitled
unknown
javascript
2 years ago
13 kB
5
Indexable
import {Controller} from '@hotwired/stimulus'; import EntityList from "../../../js/components/datatable/entityList/entityList"; import RoutingService from "../../../js/services/RoutingService"; import mustache from "mustache/mustache.mjs"; import TranslatorService from "../../../js/services/TranslatorService"; import DateTimeService from "../../../js/services/DateTimeService"; import DeleteEntityConfirmation from "../../../js/components/modal/DeleteEntityConfirmation/DeleteEntityConfirmation"; import $ from "jquery"; import EntityListFilters from "../../../js/components/datatable/entityList/entityListFilters"; import apiService from "../../../js/services/ApiService"; import EntityListSelectable, { EntityListSelectableOptionModel } from "../../../js/components/datatable/entityList/entityListSelectable"; export default class extends Controller { fetchMustache() { return fetch('/js/mustache/online_lesson_buttons.mustache') .then((response) => response.text()) .then((template) => { return template; }) } connect() { this.fetchMustache().then((template) => { TranslatorService.afterTranslationLoaded = () => { this.renderTable(template); }; }) $('.form-control').on('keypress', function (e) { if (e.which === 13) { e.preventDefault(); } }); this.isAdmin = $('.app-meeting').hasClass('role-admin'); } renderTable(template) { this.template = template; const tableHandle = $('#index-table'); const filters = new EntityListFilters($('#index-table-filters')); const selectable = new EntityListSelectable(tableHandle, this.selectableOptions()); console.log(selectable); selectable.toggleButton = $(".selectable-checkbox--toggle"); this.datatable = new EntityList( tableHandle, RoutingService.generate('admin_api_meeting_list', {type: tableHandle.data('type')}), this.getTableConfiguration(tableHandle.data('type'), selectable), filters, null, true, [[this.getTableSort(tableHandle.data('type')), 'asc']] ); if (tableHandle.data('type') === "Webinar") { this.datatable.setCreatedRowHandler = ((row, data, index) => { if (data.diaryFilled) { $(row).addClass('has-diary') } else { $(row).addClass('no-diary') } }) } $('body').on('click', '.delete-button', function () { const buttonHandle = $(this); const modal = new DeleteEntityConfirmation( this.datatable, TranslatorService.trans('ui.meeting.delete_confirm', 'js'), TranslatorService.trans('ui.meeting.delete_success', 'js'), TranslatorService.trans('ui.meeting.delete_error', 'js'), ); modal.generateUrlFunction = () => { const entityId = buttonHandle.data('id'); return RoutingService.generate('admin_api_meeting_delete', {id: entityId}); } modal.init(); }) $('#diary-mass-download').on('click', () => { window.open(RoutingService.generate('admin_api_diary_mass_export', this.datatable.datatableHandle.ajax.params()), '_blank').focus(); }) } getTableSort(type) { switch (type) { case 'PrivateLesson': return 6; case 'VideoMeeting': return 9; } return 9; } getTableConfiguration(type, selectable) { switch (type) { case 'PrivateLesson': return [ { data: 'id', orderable: false, render: function (data, type, row, meta) { return selectable.renderCheckbox(data); } }, {data: 'name'}, { data: 'type', render: (data) => TranslatorService.trans('ui.meeting.type.' + data.toLowerCase(), 'js'), }, {data: 'subject'}, {data: 'users'}, {data: 'channel'}, { data: 'duration', render: (data) => data + ' min', }, { data: 'startsAt', render: (data) => DateTimeService.toLocaleString(data), }, { data: 'createdAt', render: (data) => DateTimeService.toLocaleString(data), }, { data: 'updatedAt', render: (data) => DateTimeService.toLocaleString(data), }, { orderable: false, data: (data, type, row) => { return mustache.render(this.template, { 'clone_url': RoutingService.generate('admin_web_meeting_clone', {id: data.id}), 'clone_tooltip': TranslatorService.trans('ui.buttons.clone'), 'edit_url': RoutingService.generate('admin_web_meeting_update', {id: data.id}), 'edit_tooltip': TranslatorService.trans('ui.buttons.edit'), 'object_id': data.id, 'delete_tooltip': TranslatorService.trans('ui.buttons.delete'), 'has_diary': false, 'diary_filled': false, }); } } ]; case 'VideoMeeting': return [ { data: 'id', orderable: false, render: function (data, type, row, meta) { return selectable.renderCheckbox(data); } }, {data: 'name'}, { data: 'type', render: (data) => TranslatorService.trans('ui.meeting.type.' + data.toLowerCase(), 'js'), }, {data: 'subject'}, {data: 'users'}, {data: 'educationLevels'}, { visible: false, data: 'weeks' }, { orderable: false, data: 'limit', render: (data, i, row) => { return data ? `${row.participantsCount} / ${data} os` : 'brak' }, }, {data: 'channel'}, { data: 'duration', render: (data) => data + ' min', }, { data: 'startsAt', render: (data) => DateTimeService.toLocaleString(data), }, { data: 'visibleAt', render: (data) => DateTimeService.toLocaleString(data), }, { data: 'createdAt', render: (data) => DateTimeService.toLocaleString(data), }, { data: 'updatedAt', render: (data) => DateTimeService.toLocaleString(data), }, { orderable: false, data: (data, type, row) => { return mustache.render(this.template, { 'clone_url': RoutingService.generate('admin_web_meeting_clone', {id: data.id}), 'clone_tooltip': TranslatorService.trans('ui.buttons.clone'), 'edit_url': RoutingService.generate('admin_web_meeting_update', {id: data.id}), 'edit_tooltip': TranslatorService.trans('ui.buttons.edit'), 'object_id': data.id, 'delete_tooltip': TranslatorService.trans('ui.buttons.delete'), 'has_diary': false, 'diary_filled': false, }); } } ]; } return [ { data: 'id', orderable: false, render: function (data, type, row, meta) { return selectable.renderCheckbox(data); } }, {data: 'name'}, { data: 'type', render: (data) => TranslatorService.trans('ui.meeting.type.' + data.toLowerCase(), 'js'), }, {data: 'subject'}, {data: 'users'}, {data: 'educationLevels'}, {data: 'weeks'}, {data: 'channel'}, { data: 'duration', render: (data) => data + ' min', }, { orderable: false, data: 'limit', render: (data, i, row) => { return data ? `${row.participantsCount} / ${data} os` : `${row.participantsCount} os` }, }, { data: 'startsAt', render: (data) => DateTimeService.toLocaleString(data), }, { data: 'visibleAt', render: (data) => DateTimeService.toLocaleString(data), }, { data: 'createdAt', render: (data) => DateTimeService.toLocaleString(data), }, { data: 'updatedAt', render: (data) => DateTimeService.toLocaleString(data), }, { orderable: false, data: (data, type, row) => { return mustache.render(this.template, { 'clone_url': RoutingService.generate('admin_web_meeting_clone', {id: data.id}), 'clone_tooltip': TranslatorService.trans('ui.buttons.clone'), 'edit_url': RoutingService.generate('admin_web_meeting_update', {id: data.id}), 'edit_tooltip': TranslatorService.trans('ui.buttons.edit'), 'object_id': data.id, 'delete_tooltip': TranslatorService.trans('ui.buttons.delete'), 'has_diary': true, 'diary_tooltip': TranslatorService.trans('ui.meeting.go_to_diary'), 'diary_pdf_tooltip': TranslatorService.trans('ui.meeting.generate_pdf'), 'diary_url': RoutingService.generate('admin_web_diary_update', {id: data.id}), 'diary_pdf_url': RoutingService.generate('admin_web_diary_pdf', {id: data.id}), /*** FEATURE FLAGS ***/ 'is_enabled_flag_r3': data.isEnabledFlag, }); } } ]; } selectableOptions() { const sortableDeleteOption = new EntityListSelectableOptionModel(`<i class="fa-regular fa-trash-can"></i> ${TranslatorService.trans('ui.buttons.delete')}`) sortableDeleteOption.fn = (selectable) => { const modal = new DeleteEntityConfirmation( this.datatable, TranslatorService.trans('ui.meeting.mass_delete_confirm', 'js'), TranslatorService.trans('ui.meeting.mass_delete_success', 'flash'), ); modal.generateUrlFunction = () => { return RoutingService.generate('admin_api_meeting_mass_delete', {mass_delete: {meetings: selectable.selectedEntity}}); } modal.init(); } return [sortableDeleteOption]; } }
Editor is loading...