Merge branch 'modifyAnEvent' into dev

This commit is contained in:
soukainna 2023-02-22 12:33:44 +01:00
commit 0867a13df7
8 changed files with 435 additions and 1 deletions

View File

@ -98,6 +98,14 @@ views:
history_event:
files:
- web/layouts/agenda/history-event.html
update:
files:
- web/layouts/agenda/_partials/address.html
- web/layouts/_partials/address_autocomplete.html
- web/layouts/agenda/updateEvent.html
delete:
files:
- web/layouts/agenda/delete-event.html
directory:
home:
files:

View File

@ -0,0 +1,67 @@
{{ define "address" }}
<div class="col-span-6 relative" x-data="{
input: {{if .Adress}}'{{.Address.Properties.label}}'{{else}}`{{ .Default.properties.label}}`{{end}},
def: `{{ .Default}}`,
address: {{if .Address}}JSON.stringify({{printf "%s" .Address.MarshalJSON}}){{else}}null{{end}},
addressObject: {{if .Address}}{{printf "%s" .Address.MarshalJSON}}{{else}}null{{end}},
responselength: 0,
async autocomplete() {
if(this.input == null || this.input == '') {
this.responselength = 0
return []
}
if(this.addressObject != null && this.input == this.addressObject.properties.label) {
this.responselength = 0
return []
}
if(this.input == `{{ .Default.properties.label}}`) {
this.responselength = 0
this.address = this.def
this.input = `{{ .Default.properties.label}}`
result = await fetch('https://geocode.ridygo.fr/v1/autocomplete/\?text=' + this.input)
json = await result.json()
bb = json['features'][0]
console.log(bb)
this.address = JSON.stringify(bb)
this.addressObject = bb
this.input = bb.properties.label
return [bb]
}
result = await fetch('https://geocode.ridygo.fr/v1/autocomplete/\?text=' + this.input)
json = await result.json()
this.responselength = json['features'].length
return json['features']
},
select(a) {
this.address = JSON.stringify(a)
this.addressObject = a
this.input = a.properties.label
}
}">
<input type="hidden" name="{{ .FieldName }}" x-model="address" >
<label for="address" class="block text-sm font-medium text-gray-700">{{ if .FieldLabel }}{{.FieldLabel}}{{else}}Adresse{{end}}</label>
<input type="text"
class="mt-1 focus:ring-co-blue focus:border-co-blue block w-full shadow-sm sm:text-sm border-gray-300 rounded-2xl"
x-model="input">
<ul x-show="responselength > 0"
class="absolute z-10 mt-1 w-full bg-white shadow-lg max-h-60 rounded-xl py-1 text-base ring-1 ring-black ring-opacity-5 overflow-auto focus:outline-none sm:text-sm" tabindex="-1" role="listbox" aria-labelledby="listbox-label" aria-activedescendant="listbox-option-3">
<template x-for="item in autocomplete">
<a href="#">
<li class="text-gray-900 hover:bg-gray-200 cursor-default select-none relative py-2 pl-3 pr-9"
@click="select(item)">
<span class="font-normal block truncate" x-text="item.properties.label" ></span>
</li>
</a>
</template>
</ul>
</div>
{{ end }}

View File

@ -20,6 +20,7 @@
{{$evid := .ViewState.event.ID}}
<tbody class="divide-y divide-gray-200 bg-white">
{{range .ViewState.event.Subscriptions}}
<tr>
<td class="whitespace-nowrap py-4 pl-4 pr-3 text-sm sm:pl-6 text-center">
<a href="/app/beneficiaries/{{.Subscriber}}" class="flex">
@ -27,7 +28,8 @@
</a>
</td>
<td class="whitespace-nowrap py-4 pl-4 pr-3 text-sm sm:pl-6">
<div class="flex"><img class="h-6 w-6 rounded-co mr-2" src="/app/beneficiaries/{{.Data.subscribed_by.user.id}}/picture" alt=" "> {{.Data.subscribed_by.user.display_name}}</div>
<!-- add the member page and not the beneficiare page -->
<a href="/app/members/{{.Data.subscribed_by.user.id}}" class="flex"><img class="h-6 w-6 rounded-co mr-2" src="/app/beneficiaries/{{.Data.subscribed_by.user.id}}/picture" alt=" "> {{.Data.subscribed_by.user.display_name}}</a>
{{.Data.subscribed_by.group.name}}
</td>
<td class="whitespace-nowrap py-4 pl-4 pr-3 text-sm sm:pl-6">

View File

@ -0,0 +1,58 @@
{{define "content"}}
{{ if eq (index .ViewState.event.Owners 0) .Group.ID }}
<div>
<form method="POST">
<div class="fixed inset-0 bg-gray-500 bg-opacity-75 transition-opacity"></div>
<div class="fixed inset-0 z-10 overflow-y-auto">
<div class="flex min-h-full items-end justify-center p-4 text-center sm:items-center sm:p-0">
<div class="relative transform overflow-hidden rounded-lg bg-white px-4 pt-5 pb-4 text-left shadow-xl transition-all sm:my-8 sm:w-full max-w-lg sm:p-6">
<div>
<div class="mx-auto flex h-12 w-12 items-center justify-center rounded-co bg-co-blue text-white">
{{.IconSet.Icon "hero:outline/information-circle" "h-6 w-6"}}
</div>
<div class="mt-3 text-center sm:mt-5">
<h3 class="text-lg font-medium leading-6 text-gray-900" id="modal-title">Confirmation de retrait</h3>
<div class="mt-2">
<p class="text-sm text-gray-500">Vous etes sur de retirer cet événement</p>
</div>
</div>
</div>
<div class="mt-5 sm:mt-6 sm:grid sm:grid-flow-row-dense sm:grid-cols-2">
<a href="/app/agenda/{{.ViewState.event.ID}}" class="mt-3 inline-flex w-full justify-center rounded-l-2xl border border-gray-300 bg-white px-4 py-2 text-base font-medium text-gray-700 shadow-sm hover:bg-gray-50 focus:outline-none focus:ring-2 focus:ring-co-blue focus:ring-offset-2 sm:col-start-1 sm:mt-0 sm:text-sm">Annuler</a>
<button type="submit" class="inline-flex w-full justify-center rounded-r-2xl border border-transparent bg-co-blue px-4 py-2 text-base font-medium text-white shadow-sm hover:bg-co-blue focus:outline-none focus:ring-2 focus:ring-co-blue focus:ring-offset-2 sm:col-start-2 sm:text-sm">Confirmation</button>
</div>
</div>
</div>
</div>
</form>
</div>
{{else}}
<div class="fixed inset-0 bg-gray-500 bg-opacity-75 transition-opacity"></div>
<div class="fixed inset-0 z-10 overflow-y-auto">
<div class="flex min-h-full items-end justify-center p-4 text-center sm:items-center sm:p-0">
<div class="relative transform overflow-hidden rounded-lg bg-white px-4 pt-5 pb-4 text-left shadow-xl transition-all sm:my-8 sm:w-full max-w-lg sm:p-6">
<div>
<div class="mx-auto flex h-12 w-12 items-center justify-center rounded-co bg-co-blue text-white">
{{.IconSet.Icon "hero:outline/information-circle" "h-6 w-6"}}
</div>
<div class="mt-3 text-center sm:mt-5">
<h3 class="text-lg font-medium leading-6 text-gray-900" id="modal-title">Vous n'avez pas le droit de supprimer cet événement</h3>
</div>
</div>
<div class="flex justify-center items-center mt-5 sm:mt-6 sm:grid sm:grid-flow-row-dense ">
<!-- class="flex justify-center items-center py-2 px-3 border-t dark:border-gray-600 -->
<a href="/app/agenda/{{.ViewState.event.ID}}" class="rounded-2xl mt-3 inline-flex w-full justify-center rounded-l-2xl border border-gray-300 bg-white px-4 py-2 text-base font-medium text-gray-700 shadow-sm hover:bg-gray-50 focus:outline-none focus:ring-2 focus:ring-co-blue focus:ring-offset-2 sm:col-start-1 sm:mt-0 sm:text-sm">Annuler</a>
<!-- <button type="submit" class="inline-flex w-full justify-center rounded-r-2xl border border-transparent bg-co-blue px-4 py-2 text-base font-medium text-white shadow-sm hover:bg-co-blue focus:outline-none focus:ring-2 focus:ring-co-blue focus:ring-offset-2 sm:col-start-2 sm:text-sm">Confirmation</button> -->
</div>
</div>
</div>
</div>
{{end}}
{{end}}

View File

@ -12,7 +12,26 @@
{{end}}
</p>
</div>
{{$gr := .Group.ID}}
{{$event := .ViewState.event.ID}}
</div>
{{range .ViewState.event.Owners}}
{{$id := .}}
{{if eq $gr $id}}
<div
class="mt-6 flex flex-col-reverse justify-stretch space-y-4 space-y-reverse sm:flex-row-reverse sm:justify-end sm:space-x-reverse sm:space-y-0 sm:space-x-3 md:mt-0 md:flex-row md:space-x-3">
<a href="/app/agenda/{{$event}}/update" class="inline-flex"><button type="button"
class="w-full px-4 py-2 border border-transparent text-sm font-medium rounded-2xl shadow-sm text-white bg-co-blue hover:bg-co-blue focus:outline-none focus:ring-2 focus:ring-offset-2 focus:ring-offset-gray-100 focus:ring-co-blue">Modifier</button></a>
<a href="/app/agenda/{{$event}}/delete" class="inline-flex"><button type="button"
class="w-full px-4 py-2 border border-transparent text-sm font-medium rounded-2xl shadow-sm text-white bg-co-red hover:bg-co-red focus:outline-none focus:ring-2 focus:ring-offset-2 focus:ring-offset-gray-100 focus:ring-co-blue">Retirer</button></a>
</div>
{{end}}
{{end}}
</div>
<div class="mt-8 max-w-3xl mx-auto grid grid-cols-1 gap-6 sm:px-6 lg:max-w-7xl lg:grid-flow-col-dense lg:grid-cols-3">

View File

@ -50,6 +50,7 @@
</tr>
<tbody class="divide-y divide-gray-200 bg-white">
{{range .ViewState.events}}
{{if eq .Deleted false}}
<a href="/app/agenda/{{.ID}}">
<tr>
<td class="whitespace-nowrap py-4 pl-4 pr-3 text-sm sm:pl-6">
@ -99,6 +100,7 @@
</tr>
</a>
{{end}}
{{end}}
</tbody>
</thead>
</table>

View File

@ -0,0 +1,255 @@
{{ define "content" }}
{{ if eq (index .ViewState.event.Owners 0) .Group.ID }}
<div class="max-w-7xl mx-auto px-4 sm:px-6 md:px-8">
<h1 class="text-2xl font-semibold text-gray-900">Modifier votre agenda</h1>
</div>
{{$sdate := (timeFrom .ViewState.event.Startdate).Format ("2006-01-02")}}
{{$edate := (timeFrom .ViewState.event.Enddate).Format ("2006-01-02")}}
<div class="max-w-7xl mx-auto px-4 sm:px-6 md:px-8 mt-8"
x-data="{
fields: {
name: '{{.ViewState.event.Name}}',
type:'{{.ViewState.event.Type}}',
description: '{{.ViewState.event.Description}}',
allday: {{.ViewState.event.Allday}},
startdate:'{{$sdate}}',
enddate: '{{$edate}}',
starttime: '{{.ViewState.event.Starttime}}',
endtime: '{{.ViewState.event.Endtime}}',
max_subscribers: '{{.ViewState.event.MaxSubscribers}}',
},
rules: {
name: ['required'],
type: ['required'],
startdate: ['required'],
enddate: ['required'],
starttime: ['optional'],
endtime: ['optional'],
description: ['optional'],
max_subscribers: ['required', 'min:0']
},
formValidation: {
valid: false,
fields: {
name: {valid: null},
type: {valid: null},
description: {valid: null},
startdate: {valid: null},
enddate: {valid: null},
starttime: {valid: null},
endtime: {valid: null},
allday: {valid: null},
max_subscribers: {valid: null},
}
},
isFormValid: true,
validate() {
this.formValidation = Iodine.assert(this.fields, this.rules)
if(!Iodine.assertAfterOrEqual(new Date(this.fields.enddate), new Date(this.fields.startdate))) {
this.formValidation.fields.enddate.valid = false
this.formValidation.valid = false
}
},
validateField(field) {
this.formValidation.fields[field] = Iodine.assert(this.fields[field], this.rules[field])
},
submit(event) {
this.validate()
if(!this.formValidation.valid) {
this.isFormValid = false
event.preventDefault()
}
return this.formValidation.valid
}
}">
<form class="space-y-6" method="POST" @submit="submit">
<div class="bg-white shadow px-4 py-5 sm:rounded-lg sm:p-6">
<div class="md:grid md:grid-cols-3 md:gap-6">
<div class="md:col-span-1">
<h3 class="text-lg font-medium leading-6 text-gray-900">Informations sur le dispositif</h3>
<p class="mt-1 text-sm text-gray-500">Informations générales sur le dispositif d'accompagnement à ajouter à l'agenda</p>
</div>
<div class="mt-5 md:mt-0 md:col-span-2">
<div class="grid grid-cols-6 gap-6">
<div class="col-span-6 sm:col-span-3">
<label for="name" class="block text-sm font-medium text-gray-700">Nom</label>
<input type="text" name="name" id="name" value="{{.ViewState.event.Name}}"
class="mt-1 focus:ring-co-blue focus:border-co-blue block w-full shadow-sm sm:text-sm rounded-2xl"
x-model="fields.name" @blur="validateField('name')"
:class="formValidation.fields.name.valid == false ? 'border-co-red border-2' : 'border-gray-300'">
</div>
<div class="sm:col-span-3">
<label for="type" class="block text-sm font-medium text-gray-700">Type de dispositif</label>
<select id="type" name="type" value="{{.ViewState.event.Type}}"
x-model="fields.type" @blur="validateField('type')"
class="max-w-lg mt-1 block focus:ring-co-blue focus:border-co-blue w-full shadow-sm sm:max-w-xs sm:text-sm rounded-2xl"
:class="formValidation.fields.type.valid == false ? 'border-co-red border-2' : 'border-gray-300'">
<option></option>
<option value="Permis accéléré">Permis accéléré</option>
<option value="Auto-école sociale (classique)">Auto-école sociale (classique)</option>
<option value="Information collective">Information collective</option>
<option value="Autres">Autres</option>
</select>
</div>
<div class="col-span-6">
<label for="description" class="block text-sm font-medium text-gray-700">Description</label>
<div class="mt-1">
<textarea rows="4" name="description" id="descrpition" value="{{.ViewState.event.Description}}"
x-model="fields.description" @blur="validateField('description')"
:class="formValidation.fields.description.valid == false ? 'border-co-red border-2' : 'border-gray-300'"
class="shadow-sm focus:ring-co-blue focus:border-co-blue block w-full sm:text-sm border-gray-300 rounded-2xl"></textarea>
</div>
</div>
{{ $fieldName := "address" }}
{{if .ViewState.event.Data.address}}
{{$default := .ViewState.event.Data.address}}
{{ template "address" dict "FieldName" $fieldName "Default" $default}}
{{else}}
{{ template "address_autocomplete" dict "FieldName" $fieldName}}
{{end}}
</div>
</div>
</div>
</div>
<div class="bg-white shadow px-4 py-5 sm:rounded-lg sm:p-6">
<div class="md:grid md:grid-cols-3 md:gap-6">
<div class="md:col-span-1">
<h3 class="text-lg font-medium leading-6 text-
ray-900">Planification</h3>
<p class="mt-1 text-sm text-gray-500">Dates et horaires de l'événement</p>
</div>
<div class="mt-5 space-y-6 md:mt-0 md:col-span-2 align-middle">
<div class="grid grid-cols-6 gap-6">
<div class="col-span-6">
<button type="button" class="relative inline-flex h-6 w-11 flex-shrink-0 cursor-pointer rounded-full border-2 border-transparent transition-colors duration-200 ease-in-out focus:outline-none focus:ring-2 focus:ring-co-blue focus:ring-offset-2" role="switch" aria-checked="false"
:class="fields.allday ? 'bg-co-blue' : 'bg-gray-200'"
@click="fields.allday = ! fields.allday">
<span class="sr-only">Use setting</span>
<!-- Enabled: "translate-x-5", Not Enabled: "translate-x-0" -->
<span aria-hidden="true" class="pointer-events-none inline-block h-5 w-5 transform rounded-full bg-white shadow ring-0 transition duration-200 ease-in-out"
:class="fields.allday ? 'translate-x-5' : 'translate-x-0'"></span>
</button> <span class="text-md font-medium text-gray-700 ml-2">Toute la journée</span>
<input type="hidden" name="allday" x-model="fields.allday">
</div>
<div class="sm:col-span-6">
<div class="inline-flex w-full">
<div class="flex-1">
<label for="startdate" class="block text-sm font-medium text-gray-700">Date de début</label>
<input name="startdate" id="startdate" type="date" value="{{$sdate}}"
class="mt-1 focus:ring-co-blue focus:border-co-blue block w-full shadow-sm sm:text-sm rounded-l-2xl"
x-model="fields.startdate" @blur="validateField('startdate')"
:class="formValidation.fields.startdate.valid == false ? 'border-co-red border-2' : 'border-gray-300'">
</div>
<div class="flex-1">
<label for="enddate" class="block text-sm font-medium text-gray-700">Date de fin</label>
<input name="enddate" id="enddate" type="date" value="{{$edate}}"
class="mt-1 focus:ring-co-blue focus:border-co-blue block w-full shadow-sm sm:text-sm rounded-r-2xl"
x-model="fields.enddate" @blur="validateField('enddate')"
:class="formValidation.fields.enddate.valid == false ? 'border-co-red border-2' : 'border-gray-300'">
</div>
</div>
</div>
<div class="sm:col-span-6" x-show="!fields.allday">
<div class="inline-flex w-full">
<div class="flex-1">
<label for="startdate" class="block text-sm font-medium text-gray-700">Horaire de début</label>
<input type="time" name="starttime" id="starttime" placeholder="00:00"
class="mt-1 focus:ring-co-blue focus:border-co-blue block w-full shadow-sm sm:text-sm rounded-l-2xl"
x-model="fields.starttime" @blur="validateField('starttime')"
:class="formValidation.fields.starttime.valid == false ? 'border-co-red border-2' : 'border-gray-300'">
</div>
<div class="flex-1">
<label for="endtime" class="block text-sm font-medium text-gray-700">Horaire de fin</label>
<input type="time" name="endtime" id="endtime" placeholder="00:00"
class="mt-1 focus:ring-co-blue focus:border-co-blue block w-full shadow-sm sm:text-sm rounded-r-2xl"
x-model="fields.endtime" @blur="validateField('endtime')"
:class="formValidation.fields.endtime.valid == false ? 'border-co-red border-2' : 'border-gray-300'">
</div>
</div>
</div>
</div>
</div>
</div>
</div>
<div class="bg-white shadow px-4 py-5 sm:rounded-lg sm:p-6">
<div class="md:grid md:grid-cols-3 md:gap-6">
<div class="md:col-span-1">
<h3 class="text-lg font-medium leading-6 text-gray-900">Paramètres</h3>
<p class="mt-1 text-sm text-gray-500">Paramètres du dispositift (nombre de places disponibles, etc...)</p>
</div>
<div class="mt-5 space-y-6 md:mt-0 md:col-span-2 align-middle">
<div class="grid grid-cols-6 gap-6">
<div class="col-span-6 sm:col-span-3">
<label for="max_subscribers" class="block text-sm font-medium text-gray-700">Places disponibles (0 = illimité)</label>
<input type="number" value="{{.ViewState.event.MaxSubscribers}}" name="max_subscribers" id="max_subscribers"
class="mt-1 focus:ring-co-blue focus:border-co-blue block w-full shadow-sm sm:text-sm rounded-2xl"
x-model="fields.max_subscribers" @blur="validateField('max_subscribers')"
:class="formValidation.fields.max_subscribers.valid == false ? 'border-co-red border-2' : 'border-gray-300'">
</div>
</div>
</div>
</div>
</div>
<div class="flex justify-end">
<p x-show="! isFormValid" class="px-4 py-2 text-sm text-co-red">Certains champs de sont pas valides.</p>
<a href="/app/agenda/{{.ViewState.event.ID}}">
<button type="button"
class="bg-white py-2 px-4 border border-gray-300 rounded-2xl shadow-sm text-sm font-medium text-gray-700 hover:bg-gray-50 focus:outline-none focus:ring-2 focus:ring-offset-2 focus:ring-co-blue">Annuler</button>
</a>
<button type="submit"
class="ml-3 inline-flex justify-center py-2 px-4 border border-transparent shadow-sm text-sm font-medium rounded-2xl text-white bg-co-blue hover:bg-co-blue focus:outline-none focus:ring-2 focus:ring-offset-2 focus:ring-co-blue">Modifier</button>
</div>
</form>
</div>
{{else}}
<div class="fixed inset-0 bg-gray-500 bg-opacity-75 transition-opacity"></div>
<div class="fixed inset-0 z-10 overflow-y-auto">
<div class="flex min-h-full items-end justify-center p-4 text-center sm:items-center sm:p-0">
<div class="relative transform overflow-hidden rounded-lg bg-white px-4 pt-5 pb-4 text-left shadow-xl transition-all sm:my-8 sm:w-full max-w-lg sm:p-6">
<div>
<div class="mx-auto flex h-12 w-12 items-center justify-center rounded-co bg-co-blue text-white">
{{.IconSet.Icon "hero:outline/information-circle" "h-6 w-6"}}
</div>
<div class="mt-3 text-center sm:mt-5">
<h3 class="text-lg font-medium leading-6 text-gray-900" id="modal-title">Vous n'avez pas le droit de modifier cet événement</h3>
</div>
</div>
<div class="flex justify-center items-center mt-5 sm:mt-6 sm:grid sm:grid-flow-row-dense ">
<!-- class="flex justify-center items-center py-2 px-3 border-t dark:border-gray-600 -->
<a href="/app/agenda/{{.ViewState.event.ID}}" class="rounded-2xl mt-3 inline-flex w-full justify-center rounded-l-2xl border border-gray-300 bg-white px-4 py-2 text-base font-medium text-gray-700 shadow-sm hover:bg-gray-50 focus:outline-none focus:ring-2 focus:ring-co-blue focus:ring-offset-2 sm:col-start-1 sm:mt-0 sm:text-sm">Annuler</a>
<!-- <button type="submit" class="inline-flex w-full justify-center rounded-r-2xl border border-transparent bg-co-blue px-4 py-2 text-base font-medium text-white shadow-sm hover:bg-co-blue focus:outline-none focus:ring-2 focus:ring-co-blue focus:ring-offset-2 sm:col-start-2 sm:text-sm">Confirmation</button> -->
</div>
</div>
</div>
</div>
{{end}}
{{end}}

View File

@ -1,4 +1,5 @@
{{define "content"}}
{{if eq .UserID .ViewState.ID}}
<div class="max-w-7xl mx-auto px-4 sm:px-6 md:px-8">
<h1 class="text-2xl font-semibold text-gray-900">Modifier vos informations</h1>
@ -128,4 +129,26 @@
</div>
</form>
</div>
{{else}}
<div class="fixed inset-0 bg-gray-500 bg-opacity-75 transition-opacity"></div>
<div class="fixed inset-0 z-10 overflow-y-auto">
<div class="flex min-h-full items-end justify-center p-4 text-center sm:items-center sm:p-0">
<div class="relative transform overflow-hidden rounded-lg bg-white px-4 pt-5 pb-4 text-left shadow-xl transition-all sm:my-8 sm:w-full max-w-lg sm:p-6">
<div>
<div class="mx-auto flex h-12 w-12 items-center justify-center rounded-co bg-co-blue text-white">
{{.IconSet.Icon "hero:outline/information-circle" "h-6 w-6"}}
</div>
<div class="mt-3 text-center sm:mt-5">
<h3 class="text-lg font-medium leading-6 text-gray-900" id="modal-title">Vous n'avez pas le droit de modifier ce profil</h3>
</div>
</div>
<div class="flex justify-center items-center mt-5 sm:mt-6 sm:grid sm:grid-flow-row-dense ">
<a href="/app/members/{{.ViewState.ID}}"class="rounded-2xl mt-3 inline-flex w-full justify-center rounded-l-2xl border border-gray-300 bg-white px-4 py-2 text-base font-medium text-gray-700 shadow-sm hover:bg-gray-50 focus:outline-none focus:ring-2 focus:ring-co-blue focus:ring-offset-2 sm:col-start-1 sm:mt-0 sm:text-sm">Annuler</a>
</div>
</div>
</div>
</div>
{{end}}
{{end}}