215 lines
		
	
	
		
			14 KiB
		
	
	
	
		
			HTML
		
	
	
	
			
		
		
	
	
			215 lines
		
	
	
		
			14 KiB
		
	
	
	
		
			HTML
		
	
	
	
{{ define "content" }}
 | 
						|
<main class="py-10">
 | 
						|
    <div class="max-w-3xl mx-auto px-4 sm:px-6 md:flex md:items-center md:justify-between md:space-x-5 lg:max-w-7xl lg:px-8">
 | 
						|
        <div class="flex items-center space-x-5">
 | 
						|
            <div>
 | 
						|
                <h1 class="text-2xl font-bold text-gray-900">{{.ViewState.event.Name}}</h1>
 | 
						|
                <p class="text-m font-medium text-gray-500">
 | 
						|
                    {{if eq .ViewState.event.Startdate .ViewState.event.Enddate}}
 | 
						|
                    Le {{(timeFrom .ViewState.event.Startdate).Format "02/01/2006"}}
 | 
						|
                    {{else}}
 | 
						|
                    Du {{(timeFrom .ViewState.event.Startdate).Format "02/01/2006"}} au {{(timeFrom .ViewState.event.Enddate).Format "02/01/2006"}}
 | 
						|
                    {{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">
 | 
						|
        <div class="space-y-6 lg:col-start-1 lg:col-span-2">
 | 
						|
            <section aria-labelledby="event-information-title">
 | 
						|
                <div class="bg-white shadow sm:rounded-lg">
 | 
						|
                    <div class="px-4 py-5 sm:px-6">
 | 
						|
                        <h2 id="event-information-title" class="text-lg leading-6 font-medium text-gray-900">Informations</h2>
 | 
						|
                        <p class="mt-1 max-w-2xl text-sm text-gray-500">Informations sur le dispositif.</p>
 | 
						|
                    </div>
 | 
						|
                    <div class="border-t border-gray-200 px-4 py-5 sm:px-6">
 | 
						|
                        <dl class="grid grid-cols-1 gap-x-4 gap-y-8 sm:grid-cols-2">
 | 
						|
                            {{if .ViewState.event.Type}}
 | 
						|
                            <div class="sm:col-span-1">
 | 
						|
                                <dt class="text-sm font-medium text-gray-500">Type</dt>
 | 
						|
                                <dd class="mt-1 text-sm text-gray-900">{{.ViewState.event.Type}}</dd>
 | 
						|
                            </div>
 | 
						|
                            {{end}}
 | 
						|
                            {{if .ViewState.group}}
 | 
						|
                            <div class="sm:col-span-1">
 | 
						|
                                <dt class="text-sm font-medium text-gray-500">Structure gestionnaire</dt>
 | 
						|
                                <dd class="mt-1 text-sm text-gray-900">{{.ViewState.group.Data.name}}</dd>
 | 
						|
                            </div>
 | 
						|
                            {{end}}
 | 
						|
                            {{if .ViewState.event.MaxSubscribers}}
 | 
						|
                            <div class="sm:col-span-1">
 | 
						|
                                <dt class="text-sm font-medium text-gray-500">Total places</dt>
 | 
						|
                                <dd class="mt-1 text-sm text-gray-900">{{.ViewState.event.MaxSubscribers}}</dd>
 | 
						|
                            </div>
 | 
						|
                            {{end}}
 | 
						|
                            {{if ne .ViewState.event.MaxSubscribers 0}}
 | 
						|
                            <div class="sm:col-span-1">
 | 
						|
                                <dt class="text-sm font-medium text-gray-500">Places restantes</dt>
 | 
						|
                                <dd class="mt-1 text-sm text-gray-900">{{.ViewState.event.RemainingSubscriptions}}</dd>
 | 
						|
                            </div>
 | 
						|
                            {{end}}
 | 
						|
                            {{if .ViewState.event.Data.address}}
 | 
						|
                            <div class="sm:col-span-1">
 | 
						|
                                <dt class="text-sm font-medium text-gray-500">Adresse</dt>
 | 
						|
                                <dd class="mt-1 text-sm text-gray-900">{{.ViewState.event.Data.address.properties.label}}</dd>
 | 
						|
                            </div>
 | 
						|
                            {{end}}
 | 
						|
                            {{if .ViewState.event.Description}}
 | 
						|
                            <div class="sm:col-span-2">
 | 
						|
                                <dt class="text-sm font-medium text-gray-500">Description</dt>
 | 
						|
                                <dd class="mt-1 text-sm text-gray-900">{{.ViewState.event.Description}}</dd>
 | 
						|
                            </div>
 | 
						|
                            {{end}}
 | 
						|
                        </dl>
 | 
						|
                    </div>
 | 
						|
                </div>
 | 
						|
            </section>
 | 
						|
            {{ if eq (index .ViewState.event.Owners 0) .Group.ID }}
 | 
						|
            <section aria-labelledby="subscribers-table"></section>
 | 
						|
                <div class="bg-white shadow sm:rounded-lg">
 | 
						|
                    <div class="flex justify-between px-4 py-5 sm:px-6">
 | 
						|
                        <h2 id="event-information-title" class="text-lg leading-6 font-medium text-gray-900">Tous les inscrits</h2>
 | 
						|
                        <a href="/exports/agenda/{{$event}}">
 | 
						|
                            <button type="button"
 | 
						|
                                    class="inline-flex items-center justify-center bg-white hover:bg-gray-50 border-gray-300 border px-4 py-2 text-gray-700 flex items-center text-sm rounded-2xl focus:outline-none focus:ring-2 focus:ring-offset-2 focus:ring-co-blue">
 | 
						|
                                {{$.IconSet.Icon "hero:outline/document-arrow-down" "h-5 w-5 mr-3"}}
 | 
						|
                                Exporter
 | 
						|
                            </button>
 | 
						|
                        </a>
 | 
						|
                        <a href="/app/agenda/{{.ViewState.event.ID}}/history">
 | 
						|
 | 
						|
                            <button type="submit"class="rounded-2xl border border-transparent bg-co-blue px-4 py-2 w-full text-sm font-medium text-white shadow-sm focus:outline-none focus:ring-2 focus:ring-co-blue focus:ring-offset-2 sm:w-auto">
 | 
						|
                                Bénéficiaires désinscrits
 | 
						|
                            </button>
 | 
						|
                        </a>
 | 
						|
                    </div>
 | 
						|
 | 
						|
 | 
						|
                        {{template "subscribers_table" .}}
 | 
						|
                </div>
 | 
						|
            </section>
 | 
						|
            {{end}}
 | 
						|
        </div>
 | 
						|
        <section aria-labelledby="subscribers-title" class="lg:col-start-3 lg:col-span-1">
 | 
						|
            <div class="bg-white px-4 py-5 shadow sm:rounded-lg sm:px-6"  x-data="{
 | 
						|
                text: '',
 | 
						|
                error: false,
 | 
						|
                beneficiariesListOpen: false,
 | 
						|
                beneficiaries: {{json .ViewState.beneficiaries}},
 | 
						|
                filteredBeneficiaries: (text) => {
 | 
						|
                    if(text=='') return beneficiaries
 | 
						|
                    return this.beneficiaries.filter(b => b['data']['first_name'].includes(text) || b['data']['last_name'].includes(text))
 | 
						|
                },
 | 
						|
                fields: {
 | 
						|
                    beneficiaryid: {{if .ViewState.search}}'{{.ViewState.search.beneficiary.ID}}'{{else}}null{{end}},
 | 
						|
                },
 | 
						|
                selectbeneficiary(beneficiary) {
 | 
						|
                    console.log(beneficiary)
 | 
						|
                    this.fields.beneficiaryid = beneficiary.id 
 | 
						|
                    this.text = beneficiary.data.first_name + ' ' + beneficiary.data.last_name
 | 
						|
                    this.beneficiariesListOpen = false
 | 
						|
                },
 | 
						|
                submit(event) {
 | 
						|
                    if(!this.fields.beneficiaryid) {
 | 
						|
                        this.error = true
 | 
						|
                        event.preventDefault()
 | 
						|
                    }
 | 
						|
                    return this.formValidation.valid
 | 
						|
                }
 | 
						|
            }">
 | 
						|
                <h2 id="subscribers-title" class="text-lg font-medium text-gray-900">Inscrire un bénéficiaire</h2>
 | 
						|
                {{if gt .ViewState.event.RemainingSubscriptions 0}}
 | 
						|
                <form class="mt-4" action="/app/agenda/{{.ViewState.event.ID}}/subscribe" method="POST"  @submit="submit">
 | 
						|
                    <div class="relative mt-1 mb-4">
 | 
						|
                        <input @focus="beneficiariesListOpen = true" x-model="text" id="combobox" type="text" class="w-full rounded-2xl border border-gray-300 bg-white py-2 pl-3 pr-12 shadow-sm focus:border-co-blue focus:outline-none focus:ring-1 focus:ring-co-blue sm:text-sm" role="combobox" aria-controls="options" aria-expanded="false">
 | 
						|
                        
 | 
						|
                        <button @click="beneficiariesListOpen = ! beneficiariesListOpen" type="button" class="absolute inset-y-0 right-0 flex items-center rounded-r-2xl px-2 focus:outline-none">
 | 
						|
                          <!-- Heroicon name: solid/selector -->
 | 
						|
                          <svg class="h-5 w-5 text-gray-400" xmlns="http://www.w3.org/2000/svg" viewBox="0 0 20 20" fill="currentColor" aria-hidden="true">
 | 
						|
                            <path fill-rule="evenodd" d="M10 3a1 1 0 01.707.293l3 3a1 1 0 01-1.414 1.414L10 5.414 7.707 7.707a1 1 0 01-1.414-1.414l3-3A1 1 0 0110 3zm-3.707 9.293a1 1 0 011.414 0L10 14.586l2.293-2.293a1 1 0 011.414 1.414l-3 3a1 1 0 01-1.414 0l-3-3a1 1 0 010-1.414z" clip-rule="evenodd" />
 | 
						|
                          </svg>
 | 
						|
                        </button>
 | 
						|
                    
 | 
						|
                        <ul x-show="beneficiariesListOpen" class="absolute z-10 mt-1 max-h-60 w-full overflow-auto rounded-xl bg-white py-1 text-base shadow-lg ring-1 ring-black ring-opacity-5 focus:outline-none sm:text-sm" id="options" role="listbox">
 | 
						|
 | 
						|
                          <template x-for="beneficiary in beneficiaries">
 | 
						|
                              <li @click="selectbeneficiary(beneficiary)" class="relative cursor-default hover:bg-gray-100 select-none py-2 pl-3 pr-9 text-gray-900" id="option-0" role="option" tabindex="-1">
 | 
						|
 | 
						|
                              <span class="truncate" x-text="beneficiary.data.first_name"></span> <span class="truncate" x-text="beneficiary.data.last_name"></span>
 | 
						|
 | 
						|
                              <span class="absolute inset-y-0 right-0 flex items-center pr-4 text-co-blue">
 | 
						|
 | 
						|
                              </span>
 | 
						|
                              </li>
 | 
						|
                          </template>
 | 
						|
                        </ul>
 | 
						|
                        <input type="hidden" name="subscriber" x-model="fields.beneficiaryid">
 | 
						|
                      </div>
 | 
						|
                      <p class="text-co-red text-xs mb-4" x-show="error">Vous devez sélectionner un bénéficiaire</p>
 | 
						|
                      <button type="submit"
 | 
						|
                            class="rounded-2xl border border-transparent bg-co-blue px-4 py-2 w-full text-sm font-medium text-white shadow-sm focus:outline-none focus:ring-2 focus:ring-co-blue focus:ring-offset-2 sm:w-auto">
 | 
						|
                            Inscrire le bénéficiaire
 | 
						|
                        </button>
 | 
						|
                </form>
 | 
						|
                {{else}}
 | 
						|
                <p class="p-12 text-gray-500 text-center text-md">Il n'y a plus de place disponible</p>
 | 
						|
                {{end}}
 | 
						|
                {{if .ViewState.subscribers}}
 | 
						|
                {{if ne (index .ViewState.event.Owners 0) .Group.ID}}
 | 
						|
                <h2 id="subscribers-title" class="text-lg font-medium text-gray-900 mt-10">Bénéficiaires {{.Group.Data.name}} inscrits</h2>
 | 
						|
                <div class="mt-2">
 | 
						|
                    <ul class="p-1">
 | 
						|
                        {{$evid := .ViewState.event.ID}}
 | 
						|
                        {{range .ViewState.event.Subscriptions}}
 | 
						|
                        {{if eq $.Group.ID .Data.subscribed_by.group.id}}
 | 
						|
                        <div class="flex justify-between border">
 | 
						|
                            <div>
 | 
						|
                                <a href="/app/beneficiaries/{{.Subscriber}}">
 | 
						|
                                <li class="inline-flex text-sm p-2"><img class="h-6 w-6 rounded-co mr-2" src="/app/beneficiaries/{{.Subscriber}}/picture"> {{ (index $.ViewState.subscribers .Subscriber).Data.first_name }} {{ (index $.ViewState.subscribers .Subscriber).Data.last_name }}
 | 
						|
                                </a>
 | 
						|
                            </div>
 | 
						|
                            <div class="flex items-center">
 | 
						|
                                <a href="/app/agenda/{{$evid}}/{{.Subscriber}}/delete" class="inline-flex">
 | 
						|
                                    <button type="button" class="w-full mr-2 py-1 px-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-red">Retirer</button></a>
 | 
						|
                                    <!-- <a href="/app/agenda/{{$evid}}/{{.Subscriber}}/delete" class="inline-flex font-bold text-co-red">x</a> -->
 | 
						|
                                </li>
 | 
						|
                            </div>
 | 
						|
                        </div>
 | 
						|
                        {{end}}
 | 
						|
                        {{end}}
 | 
						|
                    </ul>
 | 
						|
                </div>
 | 
						|
                {{end}}
 | 
						|
                {{end}}
 | 
						|
            </div>
 | 
						|
            <div class="bg-white mt-4 px-4 py-5 shadow sm:rounded-lg sm:px-6">
 | 
						|
                <h2 id="documents-title" class="text-lg font-medium text-gray-900">Documents</h2>
 | 
						|
                <div class="flex justify-between items-center">
 | 
						|
                    <div>{{template "event_files" .}}</div>
 | 
						|
                </div>
 | 
						|
 | 
						|
        </section>
 | 
						|
    </div>
 | 
						|
</main>
 | 
						|
{{ end }} |