mirror of
https://gitlab.com/TheGamecraft/c-cms.git
synced 2026-04-21 02:39:10 -04:00
Add Calendar in Admin
This commit is contained in:
Mathieu Lagace
184
resources/custom.css
vendored
184
resources/custom.css
vendored
@@ -1,87 +1,107 @@
|
||||
.calendar{
|
||||
margin-top: 50px;
|
||||
.calendar {
|
||||
margin-top: 50px;
|
||||
}
|
||||
|
||||
.calendar-body-column {
|
||||
display: flex;
|
||||
}
|
||||
|
||||
.calendar-container {
|
||||
width: 14%;
|
||||
height: 7.5rem;
|
||||
text-align: center;
|
||||
vertical-align: middle !important;
|
||||
border: solid 1px #d9d9d9 !important;
|
||||
padding: 0px !important;
|
||||
background-color: white;
|
||||
}
|
||||
|
||||
.calendar-date {
|
||||
float: left;
|
||||
margin-left: 1rem;
|
||||
}
|
||||
|
||||
.calendar-text {
|
||||
float: right;
|
||||
}
|
||||
|
||||
.calendar-text>div {
|
||||
text-align: start;
|
||||
}
|
||||
|
||||
.calendar_event_name {
|
||||
height: 3rem;
|
||||
overflow: hidden;
|
||||
}
|
||||
|
||||
@media only screen and (max-width: 800px) {
|
||||
.calendar-container {
|
||||
width: 100%;
|
||||
}
|
||||
|
||||
.calendar-body-column {
|
||||
display: flex;
|
||||
.calendar-head {
|
||||
display: none;
|
||||
}
|
||||
.calendar-container{
|
||||
width: 14%;
|
||||
height: 7.5rem;
|
||||
text-align: center;
|
||||
vertical-align: middle !important;
|
||||
border: solid 1px #d9d9d9 !important;
|
||||
padding: 0px !important;
|
||||
background-color: white;
|
||||
.calendar-empty {
|
||||
display: none;
|
||||
}
|
||||
.calendar-date{
|
||||
float: left;
|
||||
margin-left: 1rem;
|
||||
}
|
||||
|
||||
.btn-calendar {
|
||||
padding: 36px 0;
|
||||
height: 7.5rem;
|
||||
margin: 0px;
|
||||
}
|
||||
|
||||
.btn-calendar:hover {
|
||||
background-color: #f2f2f26e;
|
||||
}
|
||||
|
||||
.thead-dark {
|
||||
color: #fff;
|
||||
background-color: #212529;
|
||||
border-color: #32383e;
|
||||
text-align: center;
|
||||
}
|
||||
|
||||
.loader {
|
||||
text-align: center;
|
||||
}
|
||||
|
||||
.loader-bg {
|
||||
width: 70px;
|
||||
margin-top: 50px;
|
||||
margin-bottom: 50px;
|
||||
}
|
||||
|
||||
.loader-spinner {
|
||||
position: absolute;
|
||||
border: 16px solid #f3f3f3;
|
||||
border-top: 16px solid #272c33;
|
||||
border-radius: 50%;
|
||||
width: 120px;
|
||||
height: 120px;
|
||||
animation: spin 2s linear infinite;
|
||||
left: 0px;
|
||||
right: 0px;
|
||||
margin-left: auto;
|
||||
margin-right: auto;
|
||||
top: 44px;
|
||||
}
|
||||
|
||||
@keyframes spin {
|
||||
0% {
|
||||
transform: rotate(0deg);
|
||||
}
|
||||
.calendar-text{
|
||||
float: right;
|
||||
100% {
|
||||
transform: rotate(360deg);
|
||||
}
|
||||
.calendar-text > div {
|
||||
text-align:start;
|
||||
}
|
||||
.calendar_event_name {
|
||||
height: 3rem;
|
||||
overflow: hidden;
|
||||
}
|
||||
@media only screen and (max-width: 800px) {
|
||||
.calendar-container{
|
||||
width: 100%;
|
||||
}
|
||||
.calendar-head{
|
||||
display: none;
|
||||
}
|
||||
.calendar-empty{
|
||||
display: none;
|
||||
}
|
||||
}
|
||||
|
||||
.btn-calendar{
|
||||
padding: 36px 0;
|
||||
height: 7.5rem;
|
||||
margin: 0px;
|
||||
}
|
||||
.btn-calendar:hover{
|
||||
background-color: #f2f2f26e;
|
||||
}
|
||||
.thead-dark {
|
||||
color: #fff;
|
||||
background-color: #212529;
|
||||
border-color: #32383e;
|
||||
text-align: center;
|
||||
}
|
||||
.loader{
|
||||
text-align: center;
|
||||
}
|
||||
.loader-bg{
|
||||
width: 70px;
|
||||
margin-top: 50px;
|
||||
margin-bottom: 50px;
|
||||
}
|
||||
.loader-spinner {
|
||||
position: absolute;
|
||||
border: 16px solid #f3f3f3;
|
||||
border-top: 16px solid #272c33;
|
||||
border-radius: 50%;
|
||||
width: 120px;
|
||||
height: 120px;
|
||||
animation: spin 2s linear infinite;
|
||||
left: 0px;
|
||||
right: 0px;
|
||||
margin-left: auto;
|
||||
margin-right: auto;
|
||||
top: 44px;
|
||||
}
|
||||
|
||||
@keyframes spin {
|
||||
0% { transform: rotate(0deg); }
|
||||
100% { transform: rotate(360deg); }
|
||||
}
|
||||
.cs-notification:hover {
|
||||
background-color: #F2F2F2 !important;
|
||||
color:white;
|
||||
}
|
||||
}
|
||||
|
||||
.cs-notification:hover {
|
||||
background-color: #F2F2F2 !important;
|
||||
color: white;
|
||||
}
|
||||
|
||||
.modal-lg {
|
||||
width: 80%;
|
||||
}
|
||||
@@ -97,7 +97,7 @@
|
||||
}
|
||||
</script>
|
||||
<div class="modal fade" id="schedulemodal" tabindex="-1" role="dialog" aria-labelledby="schedulemodal" aria-hidden="true">
|
||||
<div class="modal-dialog" role="document">
|
||||
<div class="modal-dialog w-100 modal-lg mx-2 mx-lg-auto" role="document">
|
||||
<div class="modal-content" id="modal-content">
|
||||
</div>
|
||||
</div>
|
||||
|
||||
@@ -12,14 +12,14 @@
|
||||
<div class="col col-md-8"><label for="text-input" class=" form-control-label">Horaire publique</label><small class="form-text text-muted">L'horaire est t-il disponible publique sur la page d'accueil du site</small></div>
|
||||
<div class="col col-md-4" style="margin: auto;">
|
||||
<label for="disabled-input" class=" form-control-label"></label>
|
||||
<label class="switch switch-3d switch-primary mr-3" style="margin-left: 3rem;"><input id="is_schedule_public" name="is_schedule_public" class="switch-input" @if($configs->where('name','is_schedule_public')->first()->state == 1) checked="true" @endif type="checkbox" onchange="saveChange('is_schedule_public')"><span class="switch-label"></span><span class="switch-handle"></span></label>
|
||||
<label class="switch switch-3d switch-primary mr-3" style="margin-left: 3rem;"><input id="is_schedule_public" name="is_schedule_public" class="switch-input" @if(\App\Config::getData('is_schedule_public') === "true") checked="true" @endif type="checkbox" onchange="saveChange('is_schedule_public')"><span class="switch-label"></span><span class="switch-handle"></span></label>
|
||||
</div>
|
||||
</div>
|
||||
<div class="col-md-6">
|
||||
<div class="col col-md-8"><label for="text-input" class=" form-control-label">Horaire complet</label><small class="form-text text-muted">L'horaire est t-il complet ? Si cette option est désactivé les utilisateurs ne reseverons pas de notification concernant l'horaire</small></div>
|
||||
<div class="col col-md-4" style="margin: auto;">
|
||||
<label for="disabled-input" class=" form-control-label"></label>
|
||||
<label class="switch switch-3d switch-primary mr-3" style="margin-left: 3rem;"><input id="is_schedule_build" name="is_schedule_build" class="switch-input" @if($configs->where('name','is_schedule_build')->first()->state == 1) checked="true" @endif type="checkbox" onchange="saveChange('is_schedule_build')"><span class="switch-label"></span><span class="switch-handle"></span></label>
|
||||
<label class="switch switch-3d switch-primary mr-3" style="margin-left: 3rem;"><input id="is_schedule_build" name="is_schedule_build" class="switch-input" @if(\App\Config::getData('is_schedule_build') === "true") checked="true" @endif type="checkbox" onchange="saveChange('is_schedule_build')"><span class="switch-label"></span><span class="switch-handle"></span></label>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
@@ -1,5 +1,105 @@
|
||||
@extends('layouts.modal.schedule.show')
|
||||
|
||||
@section('content')
|
||||
Test
|
||||
|
||||
<div class="row">
|
||||
<div class="col-md-6">
|
||||
Du <strong>{{$event->date_begin}}</strong> au <strong>{{$event->date_end}}</strong><br>
|
||||
<small>{{$event->location}} </small>
|
||||
</div>
|
||||
<div class="col-md-6 text-right">
|
||||
@if ($event->is_mandatory)
|
||||
<span class="badge badge-pill badge-warning">Obligatoire</span>
|
||||
@else
|
||||
<span class="badge badge-pill badge-info">Optionnel</span>
|
||||
@endif
|
||||
@if (is_int($event->type))
|
||||
<span class="badge badge-pill badge-default">{{$event->type}}</span>
|
||||
@else
|
||||
<span class="badge badge-pill" style="background-color: {{\App\ComplementaryActivity::find($event->type)->calendar_color}}">{{\App\ComplementaryActivity::find($event->type)->name}}</span>
|
||||
@endif
|
||||
</div>
|
||||
</div>
|
||||
<div class="row mt-4">
|
||||
<div class="col-md-12">
|
||||
{{$event->desc}}
|
||||
</div>
|
||||
</div>
|
||||
@if (!$event->courses->isEmpty())
|
||||
<div class="row mt-4">
|
||||
<div class="col-md-12">
|
||||
<h4 class="title text-center">Horaire</h4>
|
||||
<div class="row d-none d-md-flex">
|
||||
<div class="col-md-2 m-3"></div>
|
||||
@for ($p = 1; $p <= \App\Config::getData('admin_periode_nb'); $p++)
|
||||
<div class="col-md m-3">
|
||||
Période {{$p}} <small>{{\App\Config::all()->where('name','admin_periode_begin')->first()->data[$p]}} à {{\App\Config::all()->where('name','admin_periode_end')->first()->data[$p]}} </small>
|
||||
</div>
|
||||
@endfor
|
||||
</div>
|
||||
@for ($l = 1; $l <= \App\Config::getData('admin_level_in_schedule_nb'); $l++)
|
||||
<div class="row">
|
||||
<div class="col-md-2 m-3">
|
||||
Niveau {{$l}}
|
||||
</div>
|
||||
@for ($p = 1; $p <= \App\Config::getData('admin_periode_nb'); $p++)
|
||||
<div class="col-md m-3">
|
||||
@foreach ($event->courses as $course)
|
||||
@if ($course->periode == $p && $course->level == $l)
|
||||
<div class="row">
|
||||
<div class="col-sm-6 my-2">
|
||||
{{$course->name}}
|
||||
</div>
|
||||
<div class="col-sm-6 my-2 text-sm-right">
|
||||
{{\App\User::find($course->user_id)->fullname()}}
|
||||
</div>
|
||||
<div class="col-sm-6 my-2">
|
||||
{{$course->ocom}}
|
||||
</div>
|
||||
<div class="col-sm-6 my-2 text-sm-right">
|
||||
{{$course->location}}
|
||||
</div>
|
||||
<div class="col-sm-12">
|
||||
<a class="btn btn-primary btn-sm btn-block" data-toggle="collapse" href="#collapse{{$l.$p}}" aria-expanded="false" aria-controls="collapse{{$l.$p}}">Réservation de materiel</a>
|
||||
<div class="collapse" id="collapse{{$l.$p}}">
|
||||
<div class="m-3">
|
||||
@if (!$course->bookings->isEmpty())
|
||||
<div class="row">
|
||||
<div class="col-sm-8 p-2">
|
||||
<strong>Item</strong>
|
||||
</div>
|
||||
<div class="col-sm-4 text-right p-2">
|
||||
<strong>Quantité</strong>
|
||||
</div>
|
||||
<hr>
|
||||
@foreach ($course->bookings as $booking)
|
||||
<div class="col-sm-8 p-2">
|
||||
<a href="/admin/item/{{$booking->item->id}}">{{$booking->item->name}}</a>
|
||||
</div>
|
||||
<div class="col-sm-4 text-right p-2">
|
||||
{{$booking->amount}}
|
||||
</div>
|
||||
@endforeach
|
||||
</div>
|
||||
@else
|
||||
<p class="text-center">
|
||||
<strong>Aucune réservation</strong>
|
||||
</p>
|
||||
@endif
|
||||
<hr>
|
||||
<a class="btn btn-primary btn-sm btn-block mt-2" href="/admin/booking/course/{{$course->id}}" role="button">Modifier les réservation</a>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
@endif
|
||||
@endforeach
|
||||
</div>
|
||||
@endfor
|
||||
</div>
|
||||
@endfor
|
||||
</div>
|
||||
</div>
|
||||
@endif
|
||||
|
||||
@endsection
|
||||
@@ -1,5 +1,5 @@
|
||||
<div class="modal-header">
|
||||
<h5 class="modal-title" id="exampleModalLabel">{{$event->data['event_name']}}</h5>
|
||||
<h5 class="modal-title" id="exampleModalLabel">{{$event->name}}</h5>
|
||||
<button type="button" class="close" data-dismiss="modal" aria-label="Close">
|
||||
<span aria-hidden="true">×</span>
|
||||
</button>
|
||||
@@ -10,5 +10,5 @@
|
||||
|
||||
</div>
|
||||
<div class="modal-footer">
|
||||
<button type="button" class="btn btn-secondary" data-dismiss="modal">Close</button>
|
||||
<button type="button" class="btn btn-secondary" data-dismiss="modal">Fermer</button>
|
||||
</div>
|
||||
|
||||
@@ -22,16 +22,16 @@
|
||||
<i class="material-icons">airplanemode_active</i> L'escadron
|
||||
</a>
|
||||
<div class="dropdown-menu">
|
||||
<a class="dropdown-item" href="#">
|
||||
<a class="dropdown-item" href="#news">
|
||||
<i class="material-icons mr-2">new_releases</i>Nouvelles
|
||||
</a>
|
||||
<a class="dropdown-item" href="#">
|
||||
<a class="dropdown-item" href="#activity">
|
||||
<i class="material-icons mr-2">landscape</i>Nos Activitées
|
||||
</a>
|
||||
<a class="dropdown-item" href="#">
|
||||
<a class="dropdown-item" href="#picture">
|
||||
<i class="material-icons mr-2">photo_camera</i>Photos
|
||||
</a>
|
||||
<a class="dropdown-item" href="#">
|
||||
<a class="dropdown-item" href="#calendar">
|
||||
<i class="material-icons mr-2">calendar_today</i>Calendrier
|
||||
</a>
|
||||
<a class="dropdown-item" href="#cta">
|
||||
|
||||
@@ -65,8 +65,8 @@
|
||||
events: '/api/schedule/events',
|
||||
eventClick: function(info) {
|
||||
console.log(info.event.id)
|
||||
$.get( "/api/schedule/events/"+info.event.id+"/modal", function( data ) {
|
||||
$( "#schedulemodal" ).html( data );
|
||||
$.get( "/api/schedule/events/" + info.event.id + "/"+ info.event.extendedProps.extraParams.db_type + "/modal", function( data ) {
|
||||
$( "#modal-content" ).html( data );
|
||||
});
|
||||
$('#schedulemodal').modal('toggle')
|
||||
}
|
||||
@@ -77,24 +77,10 @@
|
||||
|
||||
</script>
|
||||
<div class="modal fade" id="schedulemodal" tabindex="-1" role="dialog" aria-labelledby="schedulemodal" aria-hidden="true">
|
||||
<div class="modal-dialog" role="document">
|
||||
<div class="modal-content">
|
||||
<div class="modal-header">
|
||||
<h5 class="modal-title" id="exampleModalLabel">Modal title</h5>
|
||||
<button type="button" class="close" data-dismiss="modal" aria-label="Close">
|
||||
<span aria-hidden="true">×</span>
|
||||
</button>
|
||||
</div>
|
||||
<div class="modal-body">
|
||||
...
|
||||
</div>
|
||||
<div class="modal-footer">
|
||||
<button type="button" class="btn btn-secondary" data-dismiss="modal">Close</button>
|
||||
<button type="button" class="btn btn-primary">Save changes</button>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
<div class="modal-dialog w-100 modal-lg mx-2 mx-lg-auto" role="document">
|
||||
<div class="modal-content" id="modal-content"></div>
|
||||
</div>
|
||||
</div>
|
||||
</body>
|
||||
|
||||
</html>
|
||||
@@ -1,17 +1,34 @@
|
||||
<div class="modal-dialog" role="document">
|
||||
<div class="modal-content">
|
||||
<div class="modal-header">
|
||||
<h5 class="modal-title" id="exampleModalLabel">{{$event->data['event_name']}}</h5>
|
||||
<button type="button" class="close" data-dismiss="modal" aria-label="Close">
|
||||
<span aria-hidden="true">×</span>
|
||||
</button>
|
||||
<div class="modal-header">
|
||||
<h5 class="modal-title" id="exampleModalLabel">{{$event->name}}</h5>
|
||||
<button type="button" class="close" data-dismiss="modal" aria-label="Close">
|
||||
<span aria-hidden="true">×</span>
|
||||
</button>
|
||||
</div>
|
||||
<div class="modal-body">
|
||||
<div class="row">
|
||||
<div class="col-md-6">
|
||||
Du <strong>{{$event->date_begin}}</strong> au <strong>{{$event->date_end}}</strong><br>
|
||||
<small>{{$event->location}} </small>
|
||||
</div>
|
||||
<div class="modal-body">
|
||||
{{$event->type}}
|
||||
</div>
|
||||
<div class="modal-footer">
|
||||
<button type="button" class="btn btn-secondary" data-dismiss="modal">Close</button>
|
||||
<button type="button" class="btn btn-primary">Save changes</button>
|
||||
<div class="col-md-6 text-right">
|
||||
@if ($event->is_mandatory)
|
||||
<span class="badge badge-pill badge-warning">Obligatoire</span>
|
||||
@else
|
||||
<span class="badge badge-pill badge-info">Optionnel</span>
|
||||
@endif
|
||||
@if (is_int($event->type))
|
||||
<span class="badge badge-pill badge-default">{{$event->type}}</span>
|
||||
@else
|
||||
<span class="badge badge-pill" style="background-color: {{\App\ComplementaryActivity::find($event->type)->calendar_color}}">{{\App\ComplementaryActivity::find($event->type)->name}}</span>
|
||||
@endif
|
||||
</div>
|
||||
</div>
|
||||
<div class="row mt-4">
|
||||
<div class="col-md-12">
|
||||
{{$event->desc}}
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
<div class="modal-footer">
|
||||
<button type="button" class="btn btn-secondary" data-dismiss="modal">Fermer</button>
|
||||
</div>
|
||||
Reference in New Issue
Block a user