edms2023/resources/views/calendar.blade.php

193 lines
8.2 KiB
PHP
Raw Normal View History

2023-09-14 20:59:46 +00:00
@extends('layouts.master')
@section('content')
<link rel="stylesheet" href="{{ asset('global/vendor/fullcalendar/fullcalendar.css') }}">
<link rel="stylesheet" href="{{ asset('global/vendor/bootstrap-datepicker/bootstrap-datepicker.css') }}">
<link rel="stylesheet" href="{{ asset('global/vendor/bootstrap-touchspin/bootstrap-touchspin.css') }}">
<link rel="stylesheet" href="{{ asset('global/vendor/jquery-selective/jquery-selective.css') }}">
<link rel="stylesheet" href="{{ asset('global/vendor/timepicker/jquery-timepicker.min.css') }}">
<link rel="stylesheet" href="{{ asset('global/vendor/jquery-ui/jquery-ui.min.css') }}">
<link rel="stylesheet" href="{{ asset('assets/examples/css/apps/calendar.css') }}">
<link rel="stylesheet" href="{{ asset('datetimepicker/jquery.datetimepicker.min.css') }}" />
<script src="{{ asset('datetimepicker/jquery.datetimepicker.full.min.js') }}"></script>
<script src="{{ asset('datetimepicker/rainbow-custom.min.js') }}"></script>
<style type="text/css">
.fc button{
height: auto;
padding: 8px 14px;
}
.fc-button.fc-basicWeek-button:hover, .fc-button.fc-basicDay-button:hover{
background-color: #ffffff;
}
.fc-button.fc-basicWeek-button, .fc-button.fc-basicDay-button{
height: auto;
padding: 8px 14px;
font-size: 14px;
text-transform: capitalize;
background-color: #f6f8f8;
background-image: none;
border-color: #e4eaec;
outline: none;
box-shadow: none;
}
</style>
<div class="page-header">
<h1 class="page-title">{{ __("Event Calendar") }}</h1>
<ol class="breadcrumb">
<li class="breadcrumb-item"><a href="{{ route('dashboard') }}">{{ __("Dashboard") }}</a></li>
<li class="breadcrumb-item active">{{ __("Calendar") }}</li>
</ol>
</div>
<div class="page-main">
<div class="calendar-container">
<script>
$(document).ready(function() {
$("#add-form").validationEngine('attach',{scroll:false});
$.datetimepicker.setLocale('{{ app()->getLocale() }}');
$('.datetimepicker').datetimepicker({
format:'d/m/Y H:i',
formatTime:'H:i',
formatDate:'d/m/Y',
step: 15
});
$('.Calendar').fullCalendar({
header: {
left: 'today',
center: 'prev,title,next',
right: 'month,basicWeek,basicDay'
},
defaultDate: "{{ date('Y-m-d')}}",
navLinks: true, // can click day/week names to navigate views
editable: true,
eventLimit: true, // allow "more" link when too many events
events: [
@php
if(!empty($workflow_documents->toArray())){
foreach($workflow_documents->toArray() as $document){
@endphp
{
title: "{{ $document->registration_number != '' ? $document->registration_number : $document->temporary_registration_number }}",
start: "{{ $document->registration_date != '' ? date('Y-m-d H:i', strtotime($document->registration_date)) : '' }}",
end: "{{ $document->due_date != '' ? $document->due_date : null }}",
description: "{{ $document->topic }}",
url: "{{ route('details', base64_encode($document->id)) }}#view_document",
type: 'd'
},
@php
}
}
if(!empty($custom_event)){
foreach($custom_event as $event){
@endphp
{
title: "{{ $event->title }}",
start: "{{ $event->start_date_time != '' ? date('Y-m-d H:i', strtotime($event->start_date_time)) : '' }}",
end: "{{ $event->end_date_time != '' ? date('Y-m-d H:i', strtotime($event->end_date_time)) : null }}",
description: "<?php echo preg_replace( "/\r|\n/", "", $event->text );?>",
deleteUrl: "{{ route('delete-event', base64_encode($event->id)) }}",
editUrl: "{{ route('edit-event', base64_encode($event->id)) }}",
type: 'e'
},
@php
}
}
@endphp
],
eventRender: function (event, element) {
element.attr('href', 'javascript:void(0);');
element.click(function() {
$("#startTime").html(moment(event.start).format('DD-MM-YYYY H:mm'));
if(event.end != null){
$("#endTime").html(moment(event.end).format('DD-MM-YYYY H:mm'));
}
$("#eventInfo").html(event.description);
if( event.type=='e'){
$("#eventEdit").show();
$("#eventDelete").show();
$("#eventLink").hide();
$("#eventDelete").attr('href', event.deleteUrl);
$("#eventEdit").attr('href', event.editUrl);
}
if(event.type=='d'){
$("#eventEdit").hide();
$("#eventDelete").hide();
$("#eventLink").show();
$("#eventLink").attr('href', event.url);
}
$("#eventContent").dialog({ modal: true, title: event.title, width:350});
});
}
});
});
</script>
<div id='calendar' class="Calendar"></div>
<div id="eventContent" title="Event Details" style="display:none;">
{{ __('Start') }}: <span id="startTime"></span><br>
{{ __('End') }}: <span id="endTime"></span><br><br>
<p id="eventInfo"></p>
<div id="basicICal"></div>
<p><strong><a id="eventLink" target="_blank">{{ __('Read More') }}</a>
<a id="eventEdit" style="color:green; font-size:26px;"><i class="fa fa-pencil-square" aria-hidden="true"></i></a>
<a id="eventDelete" style="color:red; font-size:26px;" onclick="confirm('Are you sure you want to delete this record? All the related data will be deleted also.') ? '' : event.preventDefault();"><i class="fa fa-trash" aria-hidden="true"></i></a>
</strong></p>
</div>
</div>
</div>
<!-- SITE ACTION -->
<div class="site-action" data-plugin="actionBtn">
<button type="button" class="site-action-toggle btn-raised btn btn-success btn-floating" data-toggle="modal" data-target="#addNewCalendarForm">
<i class="front-icon wb-plus animation-scale-up" aria-hidden="true"></i>
<i class="back-icon wb-trash animation-scale-up" aria-hidden="true"></i>
</button>
</div>
<!-- SITE ACTION -->
<!-- ADD CALENDAR FORM -->
<div class="modal fade" id="addNewCalendarForm" aria-hidden="true" aria-labelledby="addNewCalendarForm" role="dialog" tabindex="-1">
<div class="modal-dialog modal-simple">
<form method="post" action="{{ route('store-event') }}" id="add-form" autocomplete="off" enctype="multipart/form-data" class="add-form modal-content">
@csrf
<div class="modal-header">
<button type="button" class="close" aria-hidden="true" data-dismiss="modal">×</button>
<h4 class="modal-title">{{ __('Create New Event') }}</h4>
</div>
<div class="modal-body">
<div class="form-group">
<label class="form-control-label mb-15" for="title">{{ __('Event name') }}:</label>
<input type="text" class="form-control validate[required]" id="title" name="title" placeholder="{{ __('Event name') }}:" tabindex = "1">
</div>
<div class="form-group">
<label class="form-control-label mb-15" for="text">{{ __('Event Description') }}:</label>
<textarea class="form-control" id="text" name="text" placeholder="{{ __('Event Description') }}:" rows="" cols="" tabindex = "2"></textarea>
</div>
<div class="row">
<div class="form-group col-md-6">
<label class="form-control-label" for="start_date_time">{{ __('Start Date and Time') }}:</label>
<input type="text" class="form-control validate[required] datetimepicker" id="start_date_time" name="start_date_time" placeholder="{{ __('Start Date and Time') }}:" autocomplete="off" tabindex = "3"/>
</div>
<div class="form-group col-md-6">
<label class="form-control-label" for="end_date_time">{{ __('End Date and Time') }}:</label>
<input type="text" class="form-control datetimepicker" id="end_date_time" name="end_date_time" placeholder="{{ __('End Date and Time') }}:" autocomplete="off" tabindex = "4"/>
</div>
</div>
</div>
<div class="modal-footer">
<div class="form-actions">
<button class="btn btn-primary" type="submit" tabindex = "5">{{ __('Create') }}</button>
<a class="btn btn-sm btn-white" data-dismiss="modal" href="javascript:void(0)">{{ __('Cancel') }}</a>
</div>
</div>
</form>
</div>
</div>
<!-- ADD CALENDAR FORM -->
@endsection