c-cms/c-cms-legacy
1
0
Fork 0
mirror of https://gitlab.com/TheGamecraft/c-cms.git synced 2026-04-21 02:39:10 -04:00
Code Issues Packages Projects Releases Wiki Activity

begin of schedule editor

Browse Source
This commit is contained in:
Mathieu Lagace
2019-12-21 18:40:01 -05:00
parent 90b551ad31
commit 997abf460e
19 changed files with 1954 additions and 225 deletions
Download Patch File Download Diff File Expand all files Collapse all files

58
resources/custom.css vendored
View File

@@ -3,6 +3,64 @@
word-break: break-word;
}
.lds-ellipsis {
display: inline-block;
position: relative;
width: 80px;
height: 80px;
}
.lds-ellipsis div {
position: absolute;
top: 33px;
width: 13px;
height: 13px;
border-radius: 50%;
background: #dee2e6;
animation-timing-function: cubic-bezier(0, 1, 1, 0);
}
.lds-ellipsis div:nth-child(1) {
left: 8px;
animation: lds-ellipsis1 0.6s infinite;
}
.lds-ellipsis div:nth-child(2) {
left: 8px;
animation: lds-ellipsis2 0.6s infinite;
}
.lds-ellipsis div:nth-child(3) {
left: 32px;
animation: lds-ellipsis2 0.6s infinite;
}
.lds-ellipsis div:nth-child(4) {
left: 56px;
animation: lds-ellipsis3 0.6s infinite;
}
@keyframes lds-ellipsis1 {
0% {
transform: scale(0);
}
100% {
transform: scale(1);
}
}
@keyframes lds-ellipsis3 {
0% {
transform: scale(1);
}
100% {
transform: scale(0);
}
}
@keyframes lds-ellipsis2 {
0% {
transform: translate(0, 0);
}
100% {
transform: translate(24px, 0);
}
}
.container-fluid {
padding: 0px;
}

614
resources/theme/material-dashboard/assets/js/plugins/bootstrap-switch.js vendored Normal file
View File

@@ -0,0 +1,614 @@
import jquery from 'jquery'
const $ = jquery || window.jQuery || window.$
class BootstrapSwitch {
constructor (element, options = {}) {
this.$element = $(element)
this.options = $.extend(
{},
$.fn.bootstrapSwitch.defaults,
this._getElementOptions(),
options
)
this.prevOptions = {}
this.$wrapper = $('<div>', {
class: () => {
const classes = []
classes.push(this.options.state ? 'on' : 'off')
if (this.options.size) {
classes.push(this.options.size)
}
if (this.options.disabled) {
classes.push('disabled')
}
if (this.options.readonly) {
classes.push('readonly')
}
if (this.options.indeterminate) {
classes.push('indeterminate')
}
if (this.options.inverse) {
classes.push('inverse')
}
if (this.$element.attr('id')) {
classes.push(`id-${this.$element.attr('id')}`)
}
return classes
.map(this._getClass.bind(this))
.concat([this.options.baseClass], this._getClasses(this.options.wrapperClass))
.join(' ')
}
})
this.$container = $('<div>', { class: this._getClass('container') })
this.$on = $('<span>', {
html: this.options.onText,
class: `${this._getClass('handle-on')} ${this._getClass(this.options.onColor)}`
})
this.$off = $('<span>', {
html: this.options.offText,
class: `${this._getClass('handle-off')} ${this._getClass(this.options.offColor)}`
})
this.$label = $('<span>', {
html: this.options.labelText,
class: this._getClass('label')
})
this.$element.on('init.bootstrapSwitch', this.options.onInit.bind(this, element))
this.$element.on('switchChange.bootstrapSwitch', (...args) => {
if (this.options.onSwitchChange.apply(element, args) === false) {
if (this.$element.is(':radio')) {
$(`[name="${this.$element.attr('name')}"]`).trigger('previousState.bootstrapSwitch', true)
} else {
this.$element.trigger('previousState.bootstrapSwitch', true)
}
}
})
this.$container = this.$element.wrap(this.$container).parent()
this.$wrapper = this.$container.wrap(this.$wrapper).parent()
this.$element
.before(this.options.inverse ? this.$off : this.$on)
.before(this.$label)
.before(this.options.inverse ? this.$on : this.$off)
if (this.options.indeterminate) {
this.$element.prop('indeterminate', true)
}
this._init()
this._elementHandlers()
this._handleHandlers()
this._labelHandlers()
this._formHandler()
this._externalLabelHandler()
this.$element.trigger('init.bootstrapSwitch', this.options.state)
}
setPrevOptions () {
this.prevOptions = { ...this.options }
}
state (value, skip) {
if (typeof value === 'undefined') { return this.options.state }
if (
(this.options.disabled || this.options.readonly) ||
(this.options.state && !this.options.radioAllOff && this.$element.is(':radio'))
) { return this.$element }
if (this.$element.is(':radio')) {
$(`[name="${this.$element.attr('name')}"]`).trigger('setPreviousOptions.bootstrapSwitch')
} else {
this.$element.trigger('setPreviousOptions.bootstrapSwitch')
}
if (this.options.indeterminate) {
this.indeterminate(false)
}
this.$element
.prop('checked', Boolean(value))
.trigger('change.bootstrapSwitch', skip)
return this.$element
}
toggleState (skip) {
if (this.options.disabled || this.options.readonly) { return this.$element }
if (this.options.indeterminate) {
this.indeterminate(false)
return this.state(true)
} else {
return this.$element.prop('checked', !this.options.state).trigger('change.bootstrapSwitch', skip)
}
}
size (value) {
if (typeof value === 'undefined') { return this.options.size }
if (this.options.size != null) {
this.$wrapper.removeClass(this._getClass(this.options.size))
}
if (value) {
this.$wrapper.addClass(this._getClass(value))
}
this._width()
this._containerPosition()
this.options.size = value
return this.$element
}
animate (value) {
if (typeof value === 'undefined') { return this.options.animate }
if (this.options.animate === Boolean(value)) { return this.$element }
return this.toggleAnimate()
}
toggleAnimate () {
this.options.animate = !this.options.animate
this.$wrapper.toggleClass(this._getClass('animate'))
return this.$element
}
disabled (value) {
if (typeof value === 'undefined') { return this.options.disabled }
if (this.options.disabled === Boolean(value)) { return this.$element }
return this.toggleDisabled()
}
toggleDisabled () {
this.options.disabled = !this.options.disabled
this.$element.prop('disabled', this.options.disabled)
this.$wrapper.toggleClass(this._getClass('disabled'))
return this.$element
}
readonly (value) {
if (typeof value === 'undefined') { return this.options.readonly }
if (this.options.readonly === Boolean(value)) { return this.$element }
return this.toggleReadonly()
}
toggleReadonly () {
this.options.readonly = !this.options.readonly
this.$element.prop('readonly', this.options.readonly)
this.$wrapper.toggleClass(this._getClass('readonly'))
return this.$element
}
indeterminate (value) {
if (typeof value === 'undefined') { return this.options.indeterminate }
if (this.options.indeterminate === Boolean(value)) { return this.$element }
return this.toggleIndeterminate()
}
toggleIndeterminate () {
this.options.indeterminate = !this.options.indeterminate
this.$element.prop('indeterminate', this.options.indeterminate)
this.$wrapper.toggleClass(this._getClass('indeterminate'))
this._containerPosition()
return this.$element
}
inverse (value) {
if (typeof value === 'undefined') { return this.options.inverse }
if (this.options.inverse === Boolean(value)) { return this.$element }
return this.toggleInverse()
}
toggleInverse () {
this.$wrapper.toggleClass(this._getClass('inverse'))
const $on = this.$on.clone(true)
const $off = this.$off.clone(true)
this.$on.replaceWith($off)
this.$off.replaceWith($on)
this.$on = $off
this.$off = $on
this.options.inverse = !this.options.inverse
return this.$element
}
onColor (value) {
if (typeof value === 'undefined') { return this.options.onColor }
if (this.options.onColor) {
this.$on.removeClass(this._getClass(this.options.onColor))
}
this.$on.addClass(this._getClass(value))
this.options.onColor = value
return this.$element
}
offColor (value) {
if (typeof value === 'undefined') { return this.options.offColor }
if (this.options.offColor) {
this.$off.removeClass(this._getClass(this.options.offColor))
}
this.$off.addClass(this._getClass(value))
this.options.offColor = value
return this.$element
}
onText (value) {
if (typeof value === 'undefined') { return this.options.onText }
this.$on.html(value)
this._width()
this._containerPosition()
this.options.onText = value
return this.$element
}
offText (value) {
if (typeof value === 'undefined') { return this.options.offText }
this.$off.html(value)
this._width()
this._containerPosition()
this.options.offText = value
return this.$element
}
labelText (value) {
if (typeof value === 'undefined') { return this.options.labelText }
this.$label.html(value)
this._width()
this.options.labelText = value
return this.$element
}
handleWidth (value) {
if (typeof value === 'undefined') { return this.options.handleWidth }
this.options.handleWidth = value
this._width()
this._containerPosition()
return this.$element
}
labelWidth (value) {
if (typeof value === 'undefined') { return this.options.labelWidth }
this.options.labelWidth = value
this._width()
this._containerPosition()
return this.$element
}
baseClass (value) {
return this.options.baseClass
}
wrapperClass (value) {
if (typeof value === 'undefined') { return this.options.wrapperClass }
if (!value) {
value = $.fn.bootstrapSwitch.defaults.wrapperClass
}
this.$wrapper.removeClass(this._getClasses(this.options.wrapperClass).join(' '))
this.$wrapper.addClass(this._getClasses(value).join(' '))
this.options.wrapperClass = value
return this.$element
}
radioAllOff (value) {
if (typeof value === 'undefined') { return this.options.radioAllOff }
const val = Boolean(value)
if (this.options.radioAllOff === val) { return this.$element }
this.options.radioAllOff = val
return this.$element
}
onInit (value) {
if (typeof value === 'undefined') { return this.options.onInit }
if (!value) {
value = $.fn.bootstrapSwitch.defaults.onInit
}
this.options.onInit = value
return this.$element
}
onSwitchChange (value) {
if (typeof value === 'undefined') {
return this.options.onSwitchChange
}
if (!value) {
value = $.fn.bootstrapSwitch.defaults.onSwitchChange
}
this.options.onSwitchChange = value
return this.$element
}
destroy () {
const $form = this.$element.closest('form')
if ($form.length) {
$form.off('reset.bootstrapSwitch').removeData('bootstrap-switch')
}
this.$container
.children()
.not(this.$element)
.remove()
this.$element
.unwrap()
.unwrap()
.off('.bootstrapSwitch')
.removeData('bootstrap-switch')
return this.$element
}
_getElementOptions () {
return {
state: this.$element.is(':checked'),
size: this.$element.data('size'),
animate: this.$element.data('animate'),
disabled: this.$element.is(':disabled'),
readonly: this.$element.is('[readonly]'),
indeterminate: this.$element.data('indeterminate'),
inverse: this.$element.data('inverse'),
radioAllOff: this.$element.data('radio-all-off'),
onColor: this.$element.data('on-color'),
offColor: this.$element.data('off-color'),
onText: this.$element.data('on-text'),
offText: this.$element.data('off-text'),
labelText: this.$element.data('label-text'),
handleWidth: this.$element.data('handle-width'),
labelWidth: this.$element.data('label-width'),
baseClass: this.$element.data('base-class'),
wrapperClass: this.$element.data('wrapper-class')
}
}
_width () {
const $handles = this.$on
.add(this.$off)
.add(this.$label)
.css('width', '')
const handleWidth = this.options.handleWidth === 'auto'
? Math.round(Math.max(this.$on.width(), this.$off.width()))
: this.options.handleWidth
$handles.width(handleWidth)
this.$label.width((index, width) => {
if (this.options.labelWidth !== 'auto') { return this.options.labelWidth }
if (width < handleWidth) { return handleWidth }
return width
})
this._handleWidth = this.$on.outerWidth()
this._labelWidth = this.$label.outerWidth()
this.$container.width((this._handleWidth * 2) + this._labelWidth)
return this.$wrapper.width(this._handleWidth + this._labelWidth)
}
_containerPosition (state = this.options.state, callback) {
this.$container.css('margin-left', () => {
const values = [0, `-${this._handleWidth}px`]
if (this.options.indeterminate) {
return `-${this._handleWidth / 2}px`
}
if (state) {
if (this.options.inverse) {
return values[1]
} else {
return values[0]
}
} else {
if (this.options.inverse) {
return values[0]
} else {
return values[1]
}
}
})
}
_init () {
const init = () => {
this.setPrevOptions()
this._width()
this._containerPosition()
setTimeout(() => {
if (this.options.animate) {
return this.$wrapper.addClass(this._getClass('animate'))
}
}, 50)
}
if (this.$wrapper.is(':visible')) {
init()
return
}
const initInterval = window.setInterval(() => {
if (this.$wrapper.is(':visible')) {
init()
return window.clearInterval(initInterval)
}
}, 50)
}
_elementHandlers () {
return this.$element.on({
'setPreviousOptions.bootstrapSwitch': this.setPrevOptions.bind(this),
'previousState.bootstrapSwitch': () => {
this.options = this.prevOptions
if (this.options.indeterminate) {
this.$wrapper.addClass(this._getClass('indeterminate'))
}
this.$element
.prop('checked', this.options.state)
.trigger('change.bootstrapSwitch', true)
},
'change.bootstrapSwitch': (event, skip) => {
event.preventDefault()
event.stopImmediatePropagation()
const state = this.$element.is(':checked')
this._containerPosition(state)
if (state === this.options.state) {
return
}
this.options.state = state
this.$wrapper
.toggleClass(this._getClass('off'))
.toggleClass(this._getClass('on'))
if (!skip) {
if (this.$element.is(':radio')) {
$(`[name="${this.$element.attr('name')}"]`)
.not(this.$element)
.prop('checked', false)
.trigger('change.bootstrapSwitch', true)
}
this.$element.trigger('switchChange.bootstrapSwitch', [state])
}
},
'focus.bootstrapSwitch': event => {
event.preventDefault()
this.$wrapper.addClass(this._getClass('focused'))
},
'blur.bootstrapSwitch': event => {
event.preventDefault()
this.$wrapper.removeClass(this._getClass('focused'))
},
'keydown.bootstrapSwitch': event => {
if (!event.which || this.options.disabled || this.options.readonly) {
return
}
if (event.which === 37 || event.which === 39) {
event.preventDefault()
event.stopImmediatePropagation()
this.state(event.which === 39)
}
}
})
}
_handleHandlers () {
this.$on.on('click.bootstrapSwitch', event => {
event.preventDefault()
event.stopPropagation()
this.state(false)
return this.$element.trigger('focus.bootstrapSwitch')
})
return this.$off.on('click.bootstrapSwitch', event => {
event.preventDefault()
event.stopPropagation()
this.state(true)
return this.$element.trigger('focus.bootstrapSwitch')
})
}
_labelHandlers () {
const handlers = {
click (event) { event.stopPropagation() },
'mousedown.bootstrapSwitch touchstart.bootstrapSwitch': event => {
if (this._dragStart || this.options.disabled || this.options.readonly) {
return
}
event.preventDefault()
event.stopPropagation()
this._dragStart = (event.pageX || event.originalEvent.touches[0].pageX) - parseInt(this.$container.css('margin-left'), 10)
if (this.options.animate) {
this.$wrapper.removeClass(this._getClass('animate'))
}
this.$element.trigger('focus.bootstrapSwitch')
},
'mousemove.bootstrapSwitch touchmove.bootstrapSwitch': event => {
if (this._dragStart == null) { return }
const difference = (event.pageX || event.originalEvent.touches[0].pageX) - this._dragStart
event.preventDefault()
if (difference < -this._handleWidth || difference > 0) { return }
this._dragEnd = difference
this.$container.css('margin-left', `${this._dragEnd}px`)
},
'mouseup.bootstrapSwitch touchend.bootstrapSwitch': event => {
if (!this._dragStart) { return }
event.preventDefault()
if (this.options.animate) {
this.$wrapper.addClass(this._getClass('animate'))
}
if (this._dragEnd) {
const state = this._dragEnd > -(this._handleWidth / 2)
this._dragEnd = false
this.state(this.options.inverse ? !state : state)
} else {
this.state(!this.options.state)
}
this._dragStart = false
},
'mouseleave.bootstrapSwitch': () => {
this.$label.trigger('mouseup.bootstrapSwitch')
}
}
this.$label.on(handlers)
}
_externalLabelHandler () {
const $externalLabel = this.$element.closest('label')
$externalLabel.on('click', event => {
event.preventDefault()
event.stopImmediatePropagation()
if (event.target === $externalLabel[0]) {
this.toggleState()
}
})
}
_formHandler () {
const $form = this.$element.closest('form')
if ($form.data('bootstrap-switch')) {
return
}
$form
.on('reset.bootstrapSwitch', () => {
window.setTimeout(() => {
$form.find('input')
.filter(function () { return $(this).data('bootstrap-switch') })
.each(function () { return $(this).bootstrapSwitch('state', this.checked) })
}, 1)
})
.data('bootstrap-switch', true)
}
_getClass (name) {
return `${this.options.baseClass}-${name}`
}
_getClasses (classes) {
if (!$.isArray(classes)) {
return [this._getClass(classes)]
}
return classes.map(this._getClass.bind(this))
}
}
$.fn.bootstrapSwitch = function (option, ...args) {
function reducer (ret, next) {
const $this = $(next)
const existingData = $this.data('bootstrap-switch')
const data = existingData || new BootstrapSwitch(next, option)
if (!existingData) {
$this.data('bootstrap-switch', data)
}
if (typeof option === 'string') {
return data[option].apply(data, args)
}
return ret
}
return Array.prototype.reduce.call(this, reducer, this)
}
$.fn.bootstrapSwitch.Constructor = BootstrapSwitch
$.fn.bootstrapSwitch.defaults = {
state: true,
size: null,
animate: true,
disabled: false,
readonly: false,
indeterminate: false,
inverse: false,
radioAllOff: false,
onColor: 'primary',
offColor: 'default',
onText: 'ON',
offText: 'OFF',
labelText: '&nbsp',
handleWidth: 'auto',
labelWidth: 'auto',
baseClass: 'bootstrap-switch',
wrapperClass: 'wrapper',
onInit: () => {},
onSwitchChange: () => {}
}

36
resources/views/admin/schedule/editor/course.blade.php Normal file
View File

@@ -0,0 +1,36 @@
<div class="row pt-2 pb-2 border-bottom border-right">
<div class="col-6 mb-1">
<div class="form-group label-floating">
<input type="text" placeholder="OCOM du cours" class="form-control" />
<span class="form-control-feedback">
<i class="material-icons">done</i>
</span>
</div>
</div>
<div class="col-6">
<div class="form-group label-floating">
<input type="text" placeholder="Nom du cours" class="form-control" />
<span class="form-control-feedback">
<i class="material-icons">clear</i>
</span>
</div>
</div>
<div class="col-6 mb-1">
<div class="form-group label-floating">
<input type="text" placeholder="Lieu du cours" class="form-control" />
<span class="form-control-feedback">
<i class="material-icons">done</i>
</span>
</div>
</div>
<div class="col-6">
<div class="form-group label-floating">
<div class="autocomplete">
<input type="text" placeholder="Nom de l'instructeur" id="instruc_n{{$niveau}}_p{{$periode}}" class="form-control AutoComplete" aria-describedby="nameHelp" autocomplete="off" required>
</div>
<span class="form-control-feedback">
<i class="material-icons">done</i>
</span>
</div>
</div>
</div>

63
resources/views/admin/schedule/editor/template.blade.php Normal file
View File

@@ -0,0 +1,63 @@
<div class="row">
<div class="col-2 p-3 border-right border-bottom bg-dark text-white">
<b>
Niveau/Periode
</b>
</div>
@for($i = 1; $i <= 3; $i++)
<div class="col border-right border-bottom bg-dark text-white">
<div class="form-group label-floating">
<input type="text" placeholder="Niveau" class="form-control text-white" value="Niveau {{$i}}" />
<span class="form-control-feedback">
<i class="material-icons">clear</i>
</span>
</div>
</div>
@endfor
<div class="col-1">
<button class="btn btn-primary btn-fab btn-fab-mini btn-round">
<i class="material-icons">add</i>
</button>
</div>
</div>
@for($j = 1; $j <= 3; $j++)
<div class="row">
<div class="col-2 d-inline border-right border-bottom bg-light">
<div class="form-group label-floating">
<input type="text" placeholder="Période" class="form-control" value="Période {{$j}}" />
<span class="form-control-feedback">
<i class="material-icons">clear</i>
</span>
</div>
<div class="row">
<div class="col-6">
<div class="form-group label-floating">
<input type="time" class="form-control" value="00:00" />
<span class="form-control-feedback"><i class="material-icons">clear</i></span>
</div>
</div>
<div class="col-6">
<div class="form-group label-floating">
<input type="time" class="form-control" value="00:00" />
<span class="form-control-feedback"><i class="material-icons">clear</i></span>
</div>
</div>
</div>
</div>
@for($i = 1; $i <= 3; $i++)
<div id="container-{{$i}}-{{$j}}" niveau="{{$i}}" periode="{{$j}}" class="col scheduleEditor-course">
@loaderDot
</div>
@endfor
<div class="col-1">
</div>
</div>
@endfor
<div class="row">
<div class="col-2 p-2">
<button class="btn btn-primary btn-fab btn-fab-mini btn-round">
<i class="material-icons">add</i>
</button>
</div>
</div>

154
resources/views/admin/schedule/event/add.blade.php
View File

@@ -2,54 +2,128 @@
@section('content')
<div class="row">
<div class="card ">
<div class="card-header card-header-primary">
<h4 class="card-title">Ajouter un événement à l'horaire</h4>
</div>
<div class="card-body ">
<form action="/admin/schedule/event/add" method="POST">
@csrf
<div class="col-9">
<div class="card ">
<div class="card-header card-header-primary">
<h4 class="card-title">Ajouter un événement à l'horaire</h4>
</div>
<div class="card-body ">
<form action="/admin/schedule/event/add" method="POST">
@csrf
<div class="row">
<div class="col-md-12">
<div class="form-group">
<label for="type">Type d'événement</label>
<select class="form-control selectpicker" data-style="btn btn-link" name="type" id="type" onchange="switchType('{{$date}}')" required>
@foreach (\App\ComplementaryActivity::all() as $item)
<option value="{{$item->id}}">{{$item->name}}</option>
@endforeach
</select>
</div>
<div class="row">
<div class="col-md-12">
<div class="form-group">
<label for="type">Type d'événement</label>
<select class="form-control selectpicker" data-style="btn btn-link" name="type" id="type" onchange="switchType('{{$date}}')" required>
@foreach (\App\ComplementaryActivity::all() as $item)
<option value="{{$item->id}}">{{$item->name}}</option>
@endforeach
</select>
</div>
</div>
</div>
<div class="row" id="container">
</div>
<button type="submit" class="btn btn-primary mt-5">Sauvegarder</button>
</form>
</div>
</div>
</div>
<div class="col-3">
<div class="card ">
<div class="card-header card-header-primary">
<h4 class="card-title">Options</h4>
</div>
<div class="card-body ">
<div class="form-group">
<label class="m-0" for="type">Activité obligatoire</label>
<small class="text-muted d-block">L'activité est-elle obligatoire pour tout les cadets ?</small>
<div class="togglebutton">
<label>
<input type="checkbox" checked="">
<span class="toggle"></span>
L'activité est obligatoire
</label>
</div>
</div>
<div class="row" id="container">
<div class="form-group">
<label class="m-0" for="type">Message de la semaine</label>
<small class="text-muted d-block">Inclure des messages de la semaine avec l'activité ?</small>
<div class="togglebutton">
<label>
<input id="msg_toggle" type="checkbox" checked="">
<span class="toggle"></span>
Avec message de la semaine
</label>
</div>
</div>
<button type="submit" class="btn btn-primary mt-5">Sauvegarder</button>
</form>
<div class="form-group">
<label class="m-0" for="type">Horaire</label>
<small class="text-muted d-block">Inclure un horaire avec l'activité ?</small>
<div class="togglebutton">
<label>
<input type="checkbox" checked="" id="schedule_toggle">
<span class="toggle"></span>
Avec horaire
</label>
</div>
</div>
</div>
</div>
</div>
</div>
@endsection
@section('custom_scripts')
<script src="/js/calendar.js"></script>
<script>
switchType('{{$date}}')
$('.datetimepicker').datetimepicker({
icons: {
time: "fa fa-clock-o",
date: "fa fa-calendar",
up: "fa fa-chevron-up",
down: "fa fa-chevron-down",
previous: 'fa fa-chevron-left',
next: 'fa fa-chevron-right',
today: 'fa fa-screenshot',
clear: 'fa fa-trash',
close: 'fa fa-remove'
}
});
$('select').selectpicker();
</script>
<script src="/js/calendar.js"></script>
<script src="/js/plugins/schedule/editor.js"></script>
<script src="/js/plugins/autocomplete.js"></script>
<script>
switchType('{{$date}}')
$('.datetimepicker').datetimepicker({
icons: {
time: "fa fa-clock-o",
date: "fa fa-calendar",
up: "fa fa-chevron-up",
down: "fa fa-chevron-down",
previous: 'fa fa-chevron-left',
next: 'fa fa-chevron-right',
today: 'fa fa-screenshot',
clear: 'fa fa-trash',
close: 'fa fa-remove'
}
});
$('select').selectpicker();
</script>
<script>
$('#msg_toggle').change(
function () {
if($(this).is(":checked"))
{
$('#collmessagedelasemaine').removeClass('d-none');
}
else
{
$('#collmessagedelasemaine').addClass('d-none');
}
}
)
$('#schedule_toggle').change(
function () {
if($(this).is(":checked"))
{
$('#collschedule').removeClass('d-none');
}
else
{
$('#collschedule').addClass('d-none');
}
}
)
</script>
<script>
$( document ).ready(initScheduleEditor("scheduleEditor",3,4));
</script>
@endsection

362
resources/views/admin/schedule/modal/add.blade.php
View File

@@ -1,198 +1,208 @@
<div class="col-md-12 mt-4 text-center">
<h4>Information Générale</h4>
</div>
<div class="col-md-12">
<div class="form-group">
<label for="name">Nom de l'événement</label>
<input type="text" name="name" id="name" class="form-control" placeholder="" aria-describedby="nameHelp" value="{{$activity->name}}" required>
<small id="nameHelp" class="text-muted">Veuillez entrer le nom de l'événement</small>
</div>
</div>
<div class="col-lg-3 col-md-4">
<div class="form-group">
<label class="label-control">Date et Heure de début</label>
<input name="begin" type="text" id="datetimepickerbegin" class="form-control datetimepicker" required/>
</div>
</div>
<div class="col-lg-3 col-md-4">
<div class="form-group">
<label class="label-control">Date et Heure de fin</label>
<input name="end" type="text" id="datetimepickerend" class="form-control datetimepicker" required/>
</div>
</div>
<div class="col-lg-6 col-md-4">
<div class="form-group">
<label for="name">Lieux</label>
<input type="text" name="location" id="location" class="form-control" placeholder="" aria-describedby="nameHelp" value="{{$activity->location}}" required>
<small id="nameHelp" class="text-muted">Veuillez entrer le lieu de l'événement</small>
</div>
</div>
<div class="col-md-12 my-auto text-center">
<div class="form-group">
<div class="form-check">
<label class="form-check-label">
<input class="form-check-input" name="is_mandatory" type="checkbox" value="1"
@if ($activity->is_mandatory == 1)
checked
@endif>
L'événement est t-il obligatoire pour tous les cadets ?
<span class="form-check-sign">
<span class="check"></span>
</span>
</label>
<div id="accordion" class="col-12" role="tablist">
<div class="card card-collapse">
<div class="card-header" role="tab" id="headingOne">
<h5 class="mb-0">
<a data-toggle="collapse" href="#collapseOne" aria-expanded="true" aria-controls="collapseOne">
<b>Information générale</b>
<i class="material-icons">keyboard_arrow_down</i>
</a>
</h5>
</div>
</div>
</div>
<div class="col-md-12 mt-4 text-center">
<h4>Options Supplémentaires</h4>
</div>
<div class="col-md-12 mt-4">
<ul class="nav nav-pills mb-3 justify-content-center" id="pills-tab" role="tablist">
<li class="nav-item w-25">
<a class="nav-link active w-100" id="pills-home-tab" data-toggle="pill" href="#comment" role="tab" aria-controls="pills-home" aria-selected="true">Description</a>
</li>
<li class="nav-item w-25">
<a class="nav-link" id="pills-profile-tab" data-toggle="pill" href="#msg" role="tab" aria-controls="pills-profile" aria-selected="false">Message de la semaine</a>
</li>
</ul>
<div class="tab-content" id="pills-tabContent">
<div class="tab-pane fade show active" id="comment" role="tabpanel" aria-labelledby="pills-home-tab">
<div class="form-group">
<label for="desc">Description</label>
<textarea class="form-control richeditor" name="desc" id="desc" rows="6" required>{{$activity->admin_desc}}</textarea>
</div>
</div>
<div class="tab-pane fade" id="msg" role="tabpanel" aria-labelledby="pills-profile-tab">
<div id="collapseOne" class="collapse show" role="tabpanel" aria-labelledby="headingOne" data-parent="#accordion">
<div class="row">
<div class="col-md-6">
<div class="form-group">
<label class="label-control">Date et heure de publication des messages de la semaine</label>
<input name="date_msg" type="text" id="datetimepickermsg" class="form-control datetimepicker"/>
</div>
</div>
<div class="col-md-12">
<div class="form-group">
<label for="desc">Message de le semaine</label>
<textarea class="form-control richeditor" name="msg" id="msg" rows="6">{{\App\Config::getData('default_weekly_msg')}}</textarea>
<label for="name">Nom de l'événement</label>
<input type="text" name="name" id="name" class="form-control" placeholder="" aria-describedby="nameHelp" value="{{$activity->name}}" required>
<small id="nameHelp" class="text-muted">Veuillez entrer le nom de l'événement</small>
</div>
</div>
<div class="col-lg-3 col-md-4">
<div class="form-group">
<label class="label-control">Date et Heure de début</label>
<input name="begin" type="text" id="datetimepickerbegin" class="form-control datetimepicker" required/>
</div>
</div>
<div class="col-lg-3 col-md-4">
<div class="form-group">
<label class="label-control">Date et Heure de fin</label>
<input name="end" type="text" id="datetimepickerend" class="form-control datetimepicker" required/>
</div>
</div>
<div class="col-lg-6 col-md-4">
<div class="form-group">
<label for="name">Lieux</label>
<input type="text" name="location" id="location" class="form-control" placeholder="" aria-describedby="nameHelp" value="{{$activity->location}}" required>
<small id="nameHelp" class="text-muted">Veuillez entrer le lieu de l'événement</small>
</div>
</div>
<div class="col-md-12 mt-4">
<div class="form-group">
<label for="desc">Description</label>
<textarea class="form-control richeditor" name="desc" id="desc" rows="6" required>{{$activity->admin_desc}}</textarea>
</div>
</div>
</div>
</div>
</div>
<div class="card card-collapse" id="collmessagedelasemaine">
<div class="card-header" role="tab" id="headingTwo">
<h5 class="mb-0">
<a class="collapsed" data-toggle="collapse" href="#collapseTwo" aria-expanded="false" aria-controls="collapseTwo">
<b>Message de la semaine</b>
<i class="material-icons">keyboard_arrow_down</i>
</a>
</h5>
</div>
<div id="collapseTwo" class="collapse" role="tabpanel" aria-labelledby="headingTwo" data-parent="#accordion">
<div class="card-body">
<div class="row">
<div class="col-md-6">
<div class="form-group">
<label class="label-control">Date et heure de publication des messages de la semaine</label>
<input name="date_msg" type="text" id="datetimepickermsg" class="form-control datetimepicker"/>
</div>
</div>
<div class="col-md-12">
<div class="form-group">
<label for="desc">Message de le semaine</label>
<textarea class="form-control richeditor" name="msg" id="msg" rows="6">{{\App\Config::getData('default_weekly_msg')}}</textarea>
</div>
</div>
</div>
</div>
</div>
</div>
<div class="card card-collapse" id="collschedule">
<div class="card-header" role="tab" id="headingThree">
<h5 class="mb-0">
<a class="collapsed" data-toggle="collapse" href="#collapseThree" aria-expanded="false" aria-controls="collapseThree">
<b>Horaire</b>
<i class="material-icons">keyboard_arrow_down</i>
</a>
</h5>
</div>
<div id="collapseThree" class="collapse" role="tabpanel" aria-labelledby="headingThree" data-parent="#accordion">
<div class="card-body" style="overflow: scroll">
<div id="scheduleEditor" class="m-3" style="width: 90vw">
@loaderDot
</div>
</div>
</div>
</div>
</div>
@if ($activity->id == 1)
@if ($activity->id == 99)
<div class="col-md-12 mt-4 text-center">
<h4>Horaire d'instruction</h4>
</div>
<div class="col-md-12">
<div id="accordion" role="tablist">
@for ($i = 1; $i <= \App\Config::getData('admin_level_in_schedule_nb'); $i++)
<div class="card card-collapse">
<div class="card-header" role="tab" id="heading{{$i}}">
<h5 class="mb-0">
<a data-toggle="collapse" href="#collapse{{$i}}" aria-expanded="true" aria-controls="collapse{{$i}}">
Horaire Niveau {{$i}}
<i class="material-icons">keyboard_arrow_down</i>
</a>
</h5>
</div>
<div id="collapse{{$i}}" class="collapse" role="tabpanel" aria-labelledby="heading{{$i}}" data-parent="#accordion">
<div class="card-body">
@for ($p = 1; $p <= \App\Config::getData('admin_periode_nb'); $p++)
<h4 class="mt-3" >Période {{$p}}</h4>
<div class="row">
<div class="col-sm-6 my-2">
<div class="form-group">
<label for="name">Nom du cours</label>
<input type="text" name="name_n{{$i}}_p{{$p}}" id="name_n{{$i}}_p{{$p}}" class="form-control" aria-describedby="nameHelp" required @if(env('APP_DEBUG') == true)value="Nom du cours"@endif>
<small id="nameHelp" class="text-muted">Veuillez entrer le nom du cours</small>
</div>
</div>
<div class="col-sm-6">
<div class="form-group">
<label for="name">Instructeur</label>
<div class="autocomplete">
<input type="text" name="instruc_n{{$i}}_p{{$p}}" id="instruc_n{{$i}}_p{{$p}}" class="form-control AutoComplete" aria-describedby="nameHelp" autocomplete="off" required>
<div class="col-md-12">
<div id="accordion" role="tablist">
@for ($i = 1; $i <= \App\Config::getData('admin_level_in_schedule_nb'); $i++)
<div class="card card-collapse">
<div class="card-header" role="tab" id="heading{{$i}}">
<h5 class="mb-0">
<a data-toggle="collapse" href="#collapse{{$i}}" aria-expanded="true" aria-controls="collapse{{$i}}">
Horaire Niveau {{$i}}
<i class="material-icons">keyboard_arrow_down</i>
</a>
</h5>
</div>
<div id="collapse{{$i}}" class="collapse" role="tabpanel" aria-labelledby="heading{{$i}}" data-parent="#accordion">
<div class="card-body">
@for ($p = 1; $p <= \App\Config::getData('admin_periode_nb'); $p++)
<h4 class="mt-3" >Période {{$p}}</h4>
<div class="row">
<div class="col-sm-6 my-2">
<div class="form-group">
<label for="name">Nom du cours</label>
<input type="text" name="name_n{{$i}}_p{{$p}}" id="name_n{{$i}}_p{{$p}}" class="form-control" aria-describedby="nameHelp" required @if(env('APP_DEBUG') == true)value="Nom du cours"@endif>
<small id="nameHelp" class="text-muted">Veuillez entrer le nom du cours</small>
</div>
</div>
<div class="col-sm-6">
<div class="form-group">
<label for="name">Instructeur</label>
<div class="autocomplete">
<input type="text" name="instruc_n{{$i}}_p{{$p}}" id="instruc_n{{$i}}_p{{$p}}" class="form-control AutoComplete" aria-describedby="nameHelp" autocomplete="off" required>
</div>
<small id="nameHelp" class="text-muted">Veuillez entrer le nom de l'instructeur</small>
</div>
</div>
<div class="col-sm-6 my-2">
<div class="form-group">
<label for="name">OCOM</label>
<input type="text" name="ocom_n{{$i}}_p{{$p}}" id="ocom_n{{$i}}_p{{$p}}" class="form-control" aria-describedby="nameHelp" required @if(env('APP_DEBUG') == true)value="OCOM"@endif>
<small id="nameHelp" class="text-muted">Veuillez entrer l'OCOM</small>
</div>
</div>
<div class="col-sm-6 my-2">
<div class="form-group">
<label for="name">Lieux</label>
<input type="text" name="loc_n{{$i}}_p{{$p}}" id="loc_n{{$i}}_p{{$p}}" class="form-control" placeholder="" aria-describedby="nameHelp" required @if(env('APP_DEBUG') == true)value="Lieu"@endif>
<small id="nameHelp" class="text-muted">Veuillez entrer le lieux</small>
</div>
<small id="nameHelp" class="text-muted">Veuillez entrer le nom de l'instructeur</small>
</div>
</div>
<div class="col-sm-6 my-2">
<div class="form-group">
<label for="name">OCOM</label>
<input type="text" name="ocom_n{{$i}}_p{{$p}}" id="ocom_n{{$i}}_p{{$p}}" class="form-control" aria-describedby="nameHelp" required @if(env('APP_DEBUG') == true)value="OCOM"@endif>
<small id="nameHelp" class="text-muted">Veuillez entrer l'OCOM</small>
</div>
</div>
<div class="col-sm-6 my-2">
<div class="form-group">
<label for="name">Lieux</label>
<input type="text" name="loc_n{{$i}}_p{{$p}}" id="loc_n{{$i}}_p{{$p}}" class="form-control" placeholder="" aria-describedby="nameHelp" required @if(env('APP_DEBUG') == true)value="Lieu"@endif>
<small id="nameHelp" class="text-muted">Veuillez entrer le lieux</small>
</div>
</div>
</div>
<hr>
@endfor
<hr>
@endfor
</div>
</div>
</div>
</div>
@endfor
@endfor
</div>
</div>
</div>
@endif
<script src="/js/plugins/autocomplete.js"></script>
<script>
var begin = "<?php echo $begin_time ?>";
var end = "<?php echo $end_time ?>";
var msg = "<?php echo $msg_time ?>";
$('#datetimepickerbegin').datetimepicker({
icons: {
time: "fa fa-clock-o",
date: "fa fa-calendar",
up: "fa fa-chevron-up",
down: "fa fa-chevron-down",
previous: 'fa fa-chevron-left',
next: 'fa fa-chevron-right',
today: 'fa fa-screenshot',
clear: 'fa fa-trash',
close: 'fa fa-remove'
},
date: new Date(begin)
});
$('#datetimepickerend').datetimepicker({
icons: {
time: "fa fa-clock-o",
date: "fa fa-calendar",
up: "fa fa-chevron-up",
down: "fa fa-chevron-down",
previous: 'fa fa-chevron-left',
next: 'fa fa-chevron-right',
today: 'fa fa-screenshot',
clear: 'fa fa-trash',
close: 'fa fa-remove'
},
date: new Date(end)
});
$('#datetimepickermsg').datetimepicker({
icons: {
time: "fa fa-clock-o",
date: "fa fa-calendar",
up: "fa fa-chevron-up",
down: "fa fa-chevron-down",
previous: 'fa fa-chevron-left',
next: 'fa fa-chevron-right',
today: 'fa fa-screenshot',
clear: 'fa fa-trash',
close: 'fa fa-remove'
},
date: new Date(msg)
});
$('.richeditor').trumbowyg({
lang: 'fr'
});
initAutoComplete("AutoComplete");
var begin = "<?php echo $begin_time ?>";
var end = "<?php echo $end_time ?>";
var msg = "<?php echo $msg_time ?>";
$('#datetimepickerbegin').datetimepicker({
icons: {
time: "fa fa-clock-o",
date: "fa fa-calendar",
up: "fa fa-chevron-up",
down: "fa fa-chevron-down",
previous: 'fa fa-chevron-left',
next: 'fa fa-chevron-right',
today: 'fa fa-screenshot',
clear: 'fa fa-trash',
close: 'fa fa-remove'
},
date: new Date(begin)
});
$('#datetimepickerend').datetimepicker({
icons: {
time: "fa fa-clock-o",
date: "fa fa-calendar",
up: "fa fa-chevron-up",
down: "fa fa-chevron-down",
previous: 'fa fa-chevron-left',
next: 'fa fa-chevron-right',
today: 'fa fa-screenshot',
clear: 'fa fa-trash',
close: 'fa fa-remove'
},
date: new Date(end)
});
$('#datetimepickermsg').datetimepicker({
icons: {
time: "fa fa-clock-o",
date: "fa fa-calendar",
up: "fa fa-chevron-up",
down: "fa fa-chevron-down",
previous: 'fa fa-chevron-left',
next: 'fa fa-chevron-right',
today: 'fa fa-screenshot',
clear: 'fa fa-trash',
close: 'fa fa-remove'
},
date: new Date(msg)
});
$('.richeditor').trumbowyg({
lang: 'fr'
});
</script>

2
resources/views/layouts/admin/head.blade.php
View File

@@ -26,7 +26,7 @@
<link href='/assets/fullcalendar/daygrid/main.css' rel='stylesheet' />
<link rel="stylesheet" href="https://cdnjs.cloudflare.com/ajax/libs/Trumbowyg/2.18.0/ui/trumbowyg.css">
<link rel="stylesheet" href="/assets/jquery-ui-1.12.1/jquery-ui.theme.css">
<link rel="stylesheet" href="/css/contextLoader.min.css">
<!-- Custom CSS -->
<link rel="stylesheet" href="/css/custom.css">

1
resources/views/layouts/admin/scripts.blade.php
View File

@@ -30,6 +30,7 @@
<script src="https://cdnjs.cloudflare.com/ajax/libs/Trumbowyg/2.18.0/langs/fr.js"></script>
<script src="/js/notify.js"></script>
<script src="/js/plugins/contextLoader.min.js"></script>
<script>
var api_token = "<?php echo Auth::User()->api_token ?>";
$('.sidebar .sidebar-wrapper, .main-panel').perfectScrollbar();