{% extends 'basev2.html.twig' %}

{% form_theme formSite  'bootstrap_4_layout.html.twig' %}

{% block stylesheets %}
	<style type="text/css">
            
        span.select2 {
		    display         : table;
		    table-layout    : fixed;
		    width           : 100% !important;
		}
    </style>
{% endblock %}

{% block header %}

			<div class="row wrapper border-bottom white-bg page-heading">
                <div class="col-sm-8">
                    {% if editMode %}
					<h2>Fiche site</h2>
					{% else %}
					<h2>Créer une nouveau site</h2>
					{% endif %} 
                    <ol class="breadcrumb">
                        <li class="breadcrumb-item">
                            <a href="{{path('asset_list')}}">Organisation
                            </a>
                        </li>
                        {% if editMode %}
                        <li class="breadcrumb-item active">
                            <strong> <a href="{{path('asset_list')}}">Assets</a></strong>
                        </li>
                        {% else %}
                        <li class="breadcrumb-item active">
                            <strong><a>Nouveau site</a></strong>
                        </li>
						{% endif %}
                    </ol>
                </div>
                <div class="col-sm-4">
                    <div class="title-action">
                       
                    </div>
                </div>
            </div>

{% endblock %}


{% block body %}
		{{ form_start(formSite) }}
 	<div class="row">
        <div class="col-lg-12">
	        <div class="ibox" id="printed">
	            <div class="ibox-content">
					<div class="row">
						<div class="col-lg-12">
                            <div class="m-b-md">
                                <span class="float-right">
				                    <button type='button'  class="btn btn-white" data-target="{{path('asset_list')}}"  data-action="leave">Quitter</button>
									<button type='submit' class="btn btn-primary">
									{% if editMode %}
									Enregistrer
									{% else %}
									Ajouter
									{% endif %}
									</button>
			                    </span>
								<h2>
									{% if not editMode %}
									Nouvelle fiche
									{% else %}
									SIT-{{ site.id }} {{ site.designation | capitalize }}
									{% endif %}
								</h2>
                            </div>
                        </div>
					</div>
                    {% if editMode %}
                    <div class="row">
                        <div class="col-lg-6">
                            <dl class="row mb-0">
                                <div class="col-sm-4 text-sm-right">
                                    <dt>Type :</dt>
                                </div>
                                <div class="col-sm-8 text-sm-left">
                                    <dd class="mb-1">
											{{ site.typedesite.designation | default("N/C") }}
									</dd>
                                </div>
                            </dl>
                            <dl class="row mb-0">
                                <div class="col-sm-4 text-sm-right">
                                    <dt>Responsable :</dt>
                                </div>
                                <div class="col-sm-8 text-sm-left">
                                    <dd class="mb-1">{{ site.responsable.firstname | default("N/C") }} {{ site.responsable.lastname | default("") }}</dd>
                                </div>
                            </dl>
							<dl class="row mb-0">
                                <div class="col-sm-4 text-sm-right">
                                    <dt>Collaborateurs :</dt>
                                </div>
                                <div class="col-sm-8 text-sm-left">
                                    <dd class="mb-1">
										{{ site.peoples|length|default("N/C") }}
									</dd>
                                </div>
                            </dl>
                        </div>
                        <div class="col-lg-6">
                            <dl class="row mb-0">
                                <div class="col-sm-4 text-sm-right">
                                    <dt>Mise à jour :</dt>
                                </div>
                                <div class="col-sm-8 text-sm-left">
                                    <dd class="mb-1">le {{ site.publishedat | date("d M Y")  }} par {{ site.Publisher.firstname | default("n/c") }} </dd>
                                </div>
                            </dl>
                        </div>
                    </div>
                        
                    {% endif %}
                    
					<br><br>
					
		            <div class="row">
						<div class="col-lg-12">
		            		<div class="tabs-container">
		                        <ul class="nav nav-tabs">
		                            <li><a class="nav-link active show" data-toggle="tab" href="#tab-info"> 
				                            <span style="font-size: 18px;">
												<i class="fa fa-info-circle"></i>
											</span>
										</a>
									</li>
									<li>
		                            	<a class="nav-link" data-toggle="tab" href="#tab-link"> 
				                            <span style="font-size: 18px;">
												<i class="fa fa-link"></i>
											</span>
										</a>
									</li>
		                            <li>
		                            	<a class="nav-link" data-toggle="tab" href="#tab-files"> 
				                            <span style="font-size: 18px;">
												<i class="fa fa-files-o"></i>
											</span>
										</a>
									</li>
		                            <li><a class="nav-link" data-toggle="tab" href="#tab-note"> 
				                            <span style="font-size: 18px;">
												<i class="fa fa-pencil-square-o"></i>
											</span>
										</a>
									</li>
		                        </ul>
								<div class="tab-content">
		                            <div id="tab-info" class="tab-pane active show">
		                                <div class="panel-body">
			                                <div class="row">
												<div class="col-md-12"><h3>Informations générales</h3></div>
											</div>
											<br>
											<div class="form-group  row">
												<label class="col-sm-2 col-form-label">{{ form_label(formSite.designation, 'Désignation') }}</label>
												<div class="col-sm-10">{{ form_widget(formSite.designation)}}</div>
										    </div>
										    
										    <div class="hr-line-dashed"></div>
										    
										    <div class="form-group  row">
												<label class="col-sm-2 col-form-label">{{ form_label(formSite.description, 'Description') }}</label>
												<div class="col-sm-10">{{ form_widget(formSite.description)}}</div>
										    </div>
										    
										    <div class="hr-line-dashed"></div>
										    
										    <div class="form-group  row">
												<label class="col-sm-2 col-form-label">{{ form_label(formSite.typedesite, 'Type de site') }}</label>
												<div class="col-sm-10">{{ form_widget(formSite.typedesite)}}</div>
										    </div>
										    
										    <div class="hr-line-dashed"></div>
										    
										    <div class="form-group row"><label class="col-sm-2 col-form-label">Managers</label>
										        <div class="col-sm-10">
										            <div class="row">
										                <div class="col-md-5"><span class="form-text m-b-none text-navy">Responsable</span>{{ form_widget(formSite.responsable)}}</div>
										                <div class="col-md-5"><span class="form-text m-b-none text-navy">Suppléant</span>{{ form_widget(formSite.suppleant)}}</div>
										            </div>
										        </div>
										    </div>
											
											<div class="hr-line-dashed"></div>
										
											 <div class="form-group  row">
												<label class="col-sm-2 col-form-label">{{ form_label(formSite.telstandard, 'Standard téléphonique') }}</label>
												<div class="col-sm-10">{{ form_widget(formSite.telstandard)}}</div>
										    </div>
										    
										    <div class="hr-line-dashed"></div>
										    
										      <div class="form-group row"><label class="col-sm-2 col-form-label">Localisation</label>
										        <div class="col-sm-10">
										            <div class="row">
										                <div class="col-md-4"><span class="form-text m-b-none text-navy">Adresse</span>{{ form_widget(formSite.adresse)}}</div>
										                <div class="col-md-3"><span class="form-text m-b-none text-navy">Ville</span>{{ form_widget(formSite.ville)}}</div>
										                <div class="col-md-3"><span class="form-text m-b-none text-navy">Code Postal</span>{{ form_widget(formSite.codepostal)}}</div>
										                <div class="col-md-3"><span class="form-text m-b-none text-navy">Coordonnées</span>{{ form_widget(formSite.latlng)}}</div>
										            </div>
										        </div>
										    </div>
										    
		                                </div>
		                            </div>
		                            <div id="tab-link" class="tab-pane">
		                                <div class="panel-body">
			                                <div class="row">
												<div class="col-md-12"><h3>Associations</h3></div>
											</div>
											<br>
											<div class="form-group  row">
												<label class="col-sm-2 col-form-label">{{ form_label(formSite.actions, 'Actions associées') }}</label>
												<div class="col-sm-10">{{ form_widget(formSite.actions)}}</div>
										    </div>
											
											<div class="hr-line-dashed"></div>
											
											<div class="form-group  row">
												<label class="col-sm-2 col-form-label">{{ form_label(formSite.peoples, 'Collaborateurs positionnés sur ce site') }}</label>
												<div class="col-sm-10">{{ form_widget(formSite.peoples)}}</div>
										    </div>
										    
										    <div class="hr-line-dashed"></div>
										    
											<div class="form-group  row">
												<label class="col-sm-2 col-form-label">{{ form_label(formSite.sitesecours, 'Site(s) de secours') }}</label>
												<div class="col-sm-10">{{ form_widget(formSite.sitesecours)}}</div>
										    </div>			                                
		                                </div>
		                            </div>
		                           <div id="tab-files" class="tab-pane">
			                            <div class="panel-body">
			                                <div class="row">
												<div class="col-md-12"><h3>Gestionnaire de fichiers</h3></div>
											</div>
											<br>			                                
			                                <div class="form-group row">				
										        <div class="col-sm-12">
										            <iframe id="myframe" src="{{ path('file_manager', {module:1, conf:'entry', tree:0, extra: {'customer':app.user.customer.id, 'bigentity': 'Sites', 'entryprefix': 'SIT', 'entryid': site.id}}) }}" width="100%" height="500" frameborder="0"></iframe>
										        </div>
										    </div>
			                            </div>
			                        </div>
		                            <div id="tab-note" class="tab-pane">
		                                <div class="panel-body">
			                                <div class="row">
												<div class="col-md-12"><h3>Notes</h3></div>
											</div>
											<br>			                                
			                                <div class="form-group row">				
										        <div class="col-sm-12">
											        {{ form_widget(formSite.commentaire)}}
										        </div>
										    </div>
		                                </div>
		                            </div>
								</div>
		            		</div>
			            </div>
					</div>
					<br><br>
		            <div class="row">
						<div class="col-12">
		                    <span class="float-right">
			                    <button type='button'  class="btn btn-white" data-target="{{path('asset_list')}}"  data-action="leave">Quitter</button>
			                    {% if is_granted('ROLE_ADMIN') %}
								<button type='submit' class="btn btn-primary">
								{% if editMode %}
								Enregistrer
								{% else %}
								Ajouter
								{% endif %}
								</button>
								{% endif %}
		                    </span>
		                </div>
					</div>
				</div>
	        </div>
    	</div>
    </div>
    {{ form_end(formSite) }}	

{% endblock %}

{% block javascripts %}

	<script>
	$(document).ready(function() {
			$('#site_sitesecours').select2();
			$('#site_typedesite').select2();
			$('#site_responsable').select2();
			$('#site_suppleant').select2();	
			$('#site_actions').select2();
			$('#site_peoples').select2();
			
			$('#site_description').trumbowyg();
			$('#site_commentaire').trumbowyg();
			
		});
		
		function saveLeave (){
				$('button[data-action="leave"]').click(function(){
					const target = this.dataset.target;
					$.confirm({
					     title: 'Attention',
						    content: 'Voulez vous vraiment quitter cette fiche sans enregistrer les modifications ?',
						    buttons: {
						        quitter: function () {
						           $(location).attr('href', target);
						        },
						        annuler: function () {
						        }    
						    }
					});
				});
			}
		saveLeave();
		
		
			
			
				/// Save tab state
		if (location.hash) {
		  $('a[href=\'' + location.hash + '\']').tab('show');
		}
		var activeTab = localStorage.getItem('activeTab');
		if (activeTab) {
		  $('a[href="' + activeTab + '"]').tab('show');
		}
		
		$('body').on('click', 'a[data-toggle=\'tab\']', function (e) {
		  e.preventDefault()
		  var tab_name = this.getAttribute('href')
		  if (history.pushState) {
		    history.pushState(null, null, tab_name)
		  }
		  else {
		    location.hash = tab_name
		  }
		  localStorage.setItem('activeTab', tab_name)
		
		  $(this).tab('show');
		  return false;
		});
		$(window).on('popstate', function () {
		  var anchor = location.hash ||
		    $('a[data-toggle=\'tab\']').first().attr('href');
		  $('a[href=\'' + anchor + '\']').tab('show');
		});

	</script>
	
{% endblock %}