Rev 4976 | Rev 5013 | Ir a la última revisión | Autoría | Comparar con el anterior | Ultima modificación | Ver Log |
<?php
$routeEvents = $this->url('calendar/events');
$this->headLink()->appendStylesheet($this->basePath('vendors/nprogress/nprogress.css'));
$this->inlineScript()->appendFile($this->basePath('vendors/nprogress/nprogress.js'));
$this->headLink()->appendStylesheet($this->basePath('vendors/fullcalendar/fullcalendar.css'));
$this->inlineScript()->appendFile($this->basePath('vendors/fullcalendar/lib/moment.min.js'));
$this->inlineScript()->appendFile($this->basePath('vendors/fullcalendar/fullcalendar.js'));
$this->inlineScript()->appendFile($this->basePath('vendors/fullcalendar/locale/es-us.js'));
$this->inlineScript()->appendFile($this->basePath('vendors/popper/umd/popper.js'));
$defaultDate = date('Y-m-d');
$this->inlineScript()->captureStart();
echo <<<JS
jQuery( document ).ready(function( $ ) {
var data_resources = new Array();
var data_events = new Array();
$('#calendar').fullCalendar({
header: {
left: 'title',
right: 'month,agendaWeek,agendaDay,listWeek,prev,next'
},
defaultDate: '$defaultDate',
editable: true,
navLinks: true, // can click day/week names to navigate views
eventLimit: true, // allow "more" link when too many events
events: {
url: '$routeEvents',
error: function() {
$('#script-warning').show();
}
},
eventClick: function(event) {
if (event.url) {
window.open(event.url, "_blank");
return false;
}
},
eventRender: function(eventObj, \$el) {
$('.popover').remove();
\$el.popover({
title: eventObj.title,
content: eventObj.agenda,
trigger: 'hover', // 'hover',
placement: 'top',
container: 'body',
popperOptions : {
removeOnDestroy: true
},
options : {
removeOnDestroy: true
},
html: true
});
},
});
$('body').on('click', 'a.goto-backend', function(e) {
e.preventDefault();
var action = $(this).attr('href');
NProgress.start();
$.ajax({
'dataType' : 'json',
'method' : 'get',
'url' : action,
'data' : $('#form').serialize(),
}).done(function(response) {
if(response['success']) {
window.open(response['data'], '_backend')
} else {
$.fn.showError(response['data']);
}
}).fail(function( jqXHR, textStatus, errorThrown) {
$.fn.showError(textStatus);
}).always(function() {
NProgress.done();
});
});
});
JS;
$this->inlineScript()->captureEnd();
$this->headLink()->appendStylesheet('/css/calendar.css');
$this->headLink()->appendStylesheet('/look-and-field/calendar.css');
$this->inlineScript()->appendFile('/react-bundles/calendar/calendarBundle.js');
?>
<section class="info-page">
<div class="container">
<div class="row">
<div id="calendar" class="col-12 col-md-8"></div>
<div id="calendar-events" class="col-12 col-md-4"></div>
</div>
</div>
</section>
<script>
const isMobile = Boolean(window.innerWidth < 768)
const row = document.querySelector('.container .row')
if (isMobile) row.setAttribute('style', 'gap: 1rem;')
</script>