Gecko [ www.foryou-vip.com ]

Name	Size	Permission	Date
actives.blade.php	946 B	-rwxrwxrwx	2022-04-21 13:44
index.blade.php	25.71 KB	-rwxrwxrwx	2022-04-21 13:44
team.blade.php	20.4 KB	-rwxrwxrwx	2022-04-21 13:44

Rename

@extends('layouts.app', ['activePage' => 'teams', 'titlePage' => __('Détails sur l\'équipe')])

{{-- Add member history modal form --}}
<div class="modal fade member-history-modal" id="exampleModalCenter" tabindex="-1" role="dialog" aria-labelledby="exampleModalCenterTitle" aria-hidden="true">
  <div class="modal-dialog modal-dialog-centered"  style="min-width:60%!important" role="document">
  <div class="modal-content">
      <div class="modal-header">
      <h5 class="modal-title" id="exampleModalLongTitle">Ajouter dans l'historique</h5>
      <button type="button" class="close" data-dismiss="modal" aria-label="Close">
          <span aria-hidden="true">&times;</span>
      </button>
      </div>
      <div class="modal-body member-history-modal-body">
      <form  method="POST" action="/teams/{{$team->id}}/history/member/add">
          <div class="form-row col-md-12">
            <div class="form-row col-md-6">
                <div class="col-md-12">
                  <label class="visually-hidden" for="autoSizingInputGroup">Membres</label>
                  <div>
                    @foreach ( $members as $member )
                      <label class="checkbox-label" for="member{{ $member->id }}">{{ $member->name }}
                        <input type="checkbox" name="members[]" value="{{ $member->id }}" id="member{{ $member->id }}">
                        <span class="checkmark"></span>
                      </label>
                    @endforeach
                  </div>
                </div>
            </div>
            <div class="form-row col-md-6">
              <div class="form-row col-12">
                <div class="col-md-6">
                  <label class="visually-hidden" for="autoSizingInputGroup">Date de début</label>
                  <input type="date" name="start_date" class="form-control" required />
                </div>
                <div class="col-md-6">
                    <label class="visually-hidden" for="autoSizingInputGroup">Date de fin</label>
                    <input type="date" name="end_date" class="form-control" required />
                </div>
              </div>
            </div>
          </div>
            {{ @csrf_field() }}
          <div class="modal-footer">
            <button type="button" class="btn btn-secondary" data-dismiss="modal">Fermer</button>
            <button type="submit" class="btn btn-primary" id="addMemberHistory">Ajouter</button>
          </div>
      </form>
      </div>
  </div>
  </div>
</div>

{{-- Add car history modal form --}}
<div class="modal fade car-history-modal" id="carModalCenter" tabindex="-1" role="dialog" aria-labelledby="exampleModalCenterTitle" aria-hidden="true">
  <div class="modal-dialog modal-dialog-centered"  style="min-width:60%!important" role="document">
  <div class="modal-content">
      <div class="modal-header">
      <h5 class="modal-title" id="exampleModalLongTitle">Ajouter dans l'historique</h5>
      <button type="button" class="close" data-dismiss="modal" aria-label="Close">
          <span aria-hidden="true">&times;</span>
      </button>
      </div>
      <div class="modal-body car-history-modal-body">
      <form  method="POST" action="/teams/{{$team->id}}/history/car/add">
          <div class="form-row col-md-12">
            <div class="form-row col-md-6">
                <div class="col-md-12">
                  <label class="visually-hidden" for="autoSizingInputGroup">Véhicules</label>
                  <div>
                    @foreach ( $cars as $car )
                      <label class="checkbox-label" for="car{{ $car->id }}">{{ $car->car_matricule }} ({{ $car->car_name }})
                        <input type="checkbox" name="cars[]" value="{{ $car->id }}" id="car{{ $car->id }}">
                        <span class="checkmark"></span>
                      </label>
                    @endforeach
                  </div>
                </div>
            </div>
            <div class="form-row col-md-6">
              <div class="form-row col-12">
                <div class="col-md-6">
                  <label class="visually-hidden" for="autoSizingInputGroup">Date de début</label>
                  <input type="date" name="start_date" class="form-control" required />
                </div>
                <div class="col-md-6">
                    <label class="visually-hidden" for="autoSizingInputGroup">Date de fin</label>
                    <input type="date" name="end_date" class="form-control" required />
                </div>
              </div>
            </div>
          </div>
            {{ @csrf_field() }}
          <div class="modal-footer">
            <button type="button" class="btn btn-secondary" data-dismiss="modal">Fermer</button>
            <button type="submit" class="btn btn-primary" id="addCarHistory">Ajouter</button>
          </div>
      </form>
      </div>
  </div>
  </div>
</div>

@section('content')
<div class="content">
  <div class="container-fluid">
    <div class="row col-12">
      <div class="col-12">
        <div class="card">
          <div class="card-header card-header-info">
            <h4 class="card-title">Historique des membres de l'équipe</h4>
          </div>
          <div class="card-body">
            <div class="col-12 text-right mb-3">
              <button type="button" class="btn btn-primary" data-toggle="modal" data-target="#exampleModalCenter">
                Ajouter
              </button>
            </div>
            <ul class="membersHistoryList flex">
              @foreach($distinct_team_history_list as $distinct_team_history)
                <li class="membersHistoryListElement">
                  <div class="header flex">
                    <span class="date">Du {{date_create($distinct_team_history->start_date)->format("d/m/Y")}}</span>
                    <span class="date">Au {{date_create($distinct_team_history->end_date)->format("d/m/Y")}}</span>
                  </div>
                  <div class="main">
                    <ul class="members flex">
                      @foreach($team_history_list as $team_history)
                        @if($distinct_team_history->history_number == $team_history->history_number)
                          <li class="member flex">
                            <i class="material-icons">person</i> 
                            <span>{{$team_history->member_name}}</span>  
                            <a href="" class="trash" id="trash" data-member-name="{{$team_history->member_name}}" data-member-id="{{$team_history->team_member_id}}" data-history-number="{{$distinct_team_history->history_number}}">
                              <i class="material-icons" id="trash" data-member-name="{{$team_history->member_name}}" data-member-id="{{$team_history->team_member_id}}" data-history-number="{{$distinct_team_history->history_number}}">delete</i>
                            </a>
                          </li>
                        @endif
                      @endforeach
                    </ul>
                  </div>
                  <div class="footer flex">
                    <button class="btn btn-danger" data-history-number="{{$distinct_team_history->history_number}}" id="deleteMembersHistory">Supprimer de l'historique</button>
                  </div>
                </li>
              @endforeach
            </ul>
          </div>
        </div>
      </div>
      <div class="col-6">
        <div class="card">
          <div class="card-header card-header-info">
            <h4 class="card-title">Membres de l'équipe</h4>
          </div>
          <div class="card-body">
            <div class="card-body table-responsive membersList">
              <table class="table table-hover">
                <thead class="text-info">
                <th>Nom</th>
                <th>Email</th>
                </thead>
                <tbody>
                  @foreach($active_members as $active_member)
                    <tr>
                      <td>{{ $active_member['member_name'] }}</td>
                      <td>{{ $active_member['member_email'] }}</td>
                    </tr>
                  @endforeach
                </tbody>
              </table>
            </div>
          </div>
        </div>
      </div>
      <div class="col-6">
        <div class="card">
          <div class="card-header card-header-info">
            <h4 class="card-title">Historique des véhicules</h4>
          </div>
          <div class="card-body">
            <div class="col-12 text-right mb-3">
              <button type="button" class="btn btn-primary" data-toggle="modal" data-target="#carModalCenter">
                Ajouter
              </button>
            </div>
            <ul class="carsHistoryList">
              @foreach($distinct_cars_history_list as $distinct_cars_history)
                <li class="carsHistoryListElement">
                  <div class="header flex">
                    <span class="date">Du {{date_create($distinct_cars_history->start_date)->format("d/m/Y")}}</span>
                    <span class="date">Au {{date_create($distinct_cars_history->end_date)->format("d/m/Y")}}</span>
                  </div>
                  <div class="main">
                    <ul class="cars flex">
                      @foreach($cars_history_list as $cars_history)
                        @if($distinct_cars_history->history_number == $cars_history->history_number)
                          <li class="car flex">
                            <i class="material-icons">directions_car</i> 
                            <span>{{ $cars_history->car_matricule }} ({{ $cars_history->car_name }})</span>  
                            <a href="" class="trash"  id="trash" data-car-name="{{ $cars_history->car_matricule }} ({{ $cars_history->car_name }})" data-car-id="{{$cars_history->car_id}}" data-history-number="{{$distinct_cars_history->history_number}}">
                              <i class="material-icons" id="trash" data-car-name="{{ $cars_history->car_matricule }} ({{ $cars_history->car_name }})" data-car-id="{{$cars_history->car_id}}" data-history-number="{{$distinct_cars_history->history_number}}">delete</i>
                            </a>
                          </li>
                        @endif
                      @endforeach
                    </ul>
                  </div>
                  <div class="footer flex">
                    <button class="btn btn-danger"  data-history-number="{{$distinct_cars_history->history_number}}" id="deleteCarsHistory">Supprimer de l'historique</button>
                  </div>
                </li>
              @endforeach
            </ul>
          </div>
        </div>
      </div>
      <div class="col-12 checkIn">
        <div class="card">
          <div class="card-header card-header-info">
            <h4 class="card-title">Historique de pointage</h4>
          </div>
          <div class="card-body table-responsive">
            <table class="table table-hover">
              <thead class="text-info">
              <th>Début</th>
              <th>Fin</th>
              <th>Temps écoulé</th>
              <th>Statut</th>
              </thead>
              <tbody>
                @foreach ( $check_in_list as $check_in )
                  <tr>
                    <td><div>{{ $check_in->start_date ? date_create($check_in->start_date)->format("d/m/Y H:i") : "" }}</div></td>
                    <td><div class="{{ $check_in->end_date ? "" : "dot-collision"}}">{{ $check_in->end_date ? date_create($check_in->end_date)->format("d/m/Y H:i") : ""}}</div></td>
                    <td><div>{{ $check_in->duration->h . "h" . $check_in->duration->i . "m" }}</div></td>
                    <td><div class="{{ $check_in->end_date ? "done" : "inProgress"}}">{{ $check_in->end_date ? "Terminé" : "En cours"}}</div></td>
                  </tr>
                @endforeach
              </tbody>
            </table>
          </div>
        </div>
      </div>
    </div>
  </div>
</div>

@endsection

@push('js')
  <script src="//cdn.jsdelivr.net/npm/sweetalert2@11"></script>

window.onload = function() 
    {

let params = (new URL(document.location)).searchParams;
      let message = params.get('message');
      if(message === "emptyField"){
        Swal.fire({
          icon: 'warning',
          title: 'Attention',
          text: 'Vous n\'avez pas rempli correctement le formulaire.'
        })
      }

//add member history
      let addMemberHistoryModal = document.querySelector('.member-history-modal-body')
      let addMemberHistoryBtn = document.querySelector("#addMemberHistory");
      addMemberHistoryBtn.addEventListener('click', (event) => {
        let members = addMemberHistoryModal.querySelectorAll("[name='members[]']");
        let startDate = addMemberHistoryModal.querySelector("[name='start_date']");
        let endDate = addMemberHistoryModal.querySelector("[name='end_date']");
        let checkedMembers = [];
        members.forEach((member) => {
          if (member.checked) {
            checkedMembers.push(member.value);
          }
        });

if (checkedMembers.length == 0 || startDate.value == "" || endDate.value == "") {
          event.preventDefault();
          Swal.fire({
          icon: 'warning',
          title: 'Attention',
          text: 'Vous n\'avez pas rempli correctement le formulaire.'
        })
        }
      })

//delete single member history 
      let membersHistoryList = document.querySelector('.membersHistoryList');
      membersHistoryList.addEventListener('click', (event) => {
        if (event.target.id == 'trash'){
          event.preventDefault();
          let deleteMemberBtn = event.target;
          let memberName = deleteMemberBtn.dataset.memberName;
          let member_id = deleteMemberBtn.dataset.memberId;
          let history_number = deleteMemberBtn.dataset.historyNumber;
          let member = deleteMemberBtn.closest('.member');

Swal.fire({
            title: 'Attention',
            text: `Voulez-vous vraiment supprimer ${memberName} de l'historique ?`,
            icon: 'warning',
            showCancelButton: true,
            confirmButtonColor: '#3085d6',
            cancelButtonColor: '#d33',
            confirmButtonText: 'Confirmer', 
            cancelButtonText: 'Annuler'
          }).then((result) => {
            if (result.isConfirmed) {
              fetch(`/teams/{{$team->id}}/history/member/delete/${history_number}/${member_id}`)
              .then(res => {
                if (res.status !== 200){
                  Swal.fire({
                    icon: 'error',
                    title: 'Erreur lors de la suppression',
                    text: res.status
                  })
                }else{
                  member.style.display = "none";
                }
              })
              .catch(error => {
                  Swal.fire({
                    icon: 'error',
                    title: 'Erreur lors de la suppression',
                    text: error.message
                  })
              })
              
            }
          })
        }

if (event.target.id == 'deleteMembersHistory') {
          event.preventDefault();
          let deleteMemberBtn = event.target;
          let history_number = deleteMemberBtn.dataset.historyNumber;
          let membersHistoryListElement = deleteMemberBtn.closest('.membersHistoryListElement');

Swal.fire({
            title: 'Attention',
            text: `Voulez-vous vraiment supprimer cet historique ?`,
            icon: 'warning',
            showCancelButton: true,
            confirmButtonColor: '#3085d6',
            cancelButtonColor: '#d33',
            confirmButtonText: 'Confirmer', 
            cancelButtonText: 'Annuler'
          }).then((result) => {
            if (result.isConfirmed) {
              fetch(`/teams/{{$team->id}}/history/member/delete/${history_number}`)
              .then(res => {
                if (res.status !== 200){
                  Swal.fire({
                    icon: 'error',
                    title: 'Erreur lors de la suppression',
                    text: res.status
                  })
                }else{
                  membersHistoryListElement.style.display = "none";
                }
              })
              .catch(error => {
                  Swal.fire({
                    icon: 'error',
                    title: 'Erreur lors de la suppression',
                    text: error.message
                  })
              })
              
            }
          })
        }
      })

//add car history
      let addCarHistoryModal = document.querySelector('.car-history-modal-body')
      let addCarHistoryBtn = document.querySelector("#addCarHistory");
      addCarHistoryBtn.addEventListener('click', (event) => {
        let cars = addCarHistoryModal.querySelectorAll("[name='cars[]']");
        let startDate = addCarHistoryModal.querySelector("[name='start_date']");
        let endDate = addCarHistoryModal.querySelector("[name='end_date']");
        let checkedCars = [];
        cars.forEach((car) => {
          if (car.checked) {
            checkedCars.push(car.value);
          }
        });

if (checkedCars.length == 0 || startDate.value == "" || endDate.value == "") {
          event.preventDefault();
          Swal.fire({
          icon: 'warning',
          title: 'Attention',
          text: 'Vous n\'avez pas rempli correctement le formulaire.'
        })
        }
      })

//delete single car history 
      let carsHistoryList = document.querySelector('.carsHistoryList');
      carsHistoryList.addEventListener('click', (event) => {
        if (event.target.id == 'trash'){
          event.preventDefault();
          let deleteCarBtn = event.target;
          let carName = deleteCarBtn.dataset.carName;
          let car_id = deleteCarBtn.dataset.carId;
          let history_number = deleteCarBtn.dataset.historyNumber;
          let car = deleteCarBtn.closest('.car');

Swal.fire({
            title: 'Attention',
            text: `Voulez-vous vraiment supprimer ${carName} de l'historique ?`,
            icon: 'warning',
            showCancelButton: true,
            confirmButtonColor: '#3085d6',
            cancelButtonColor: '#d33',
            confirmButtonText: 'Confirmer', 
            cancelButtonText: 'Annuler'
          }).then((result) => {
            if (result.isConfirmed) {
              fetch(`/teams/{{$team->id}}/history/car/delete/${history_number}/${car_id}`)
              .then(res => {
                if (res.status !== 200){
                  Swal.fire({
                    icon: 'error',
                    title: 'Erreur lors de la suppression',
                    text: res.status
                  })
                }else{
                  car.style.display = "none";
                }
              })
              .catch(error => {
                  Swal.fire({
                    icon: 'error',
                    title: 'Erreur lors de la suppression',
                    text: error.message
                  })
              })
              
            }
          })
        }

if (event.target.id == 'deleteCarsHistory') {
          event.preventDefault();
          let deleteCarBtn = event.target;
          let history_number = deleteCarBtn.dataset.historyNumber;
          let carsHistoryListElement = deleteCarBtn.closest('.carsHistoryListElement');

Swal.fire({
            title: 'Attention',
            text: `Voulez-vous vraiment supprimer cet historique ?`,
            icon: 'warning',
            showCancelButton: true,
            confirmButtonColor: '#3085d6',
            cancelButtonColor: '#d33',
            confirmButtonText: 'Confirmer', 
            cancelButtonText: 'Annuler'
          }).then((result) => {
            if (result.isConfirmed) {
              fetch(`/teams/{{$team->id}}/history/car/delete/${history_number}`)
              .then(res => {
                if (res.status !== 200){
                  Swal.fire({
                    icon: 'error',
                    title: 'Erreur lors de la suppression',
                    text: res.status
                  })
                }else{
                  carsHistoryListElement.style.display = "none";
                }
              })
              .catch(error => {
                  Swal.fire({
                    icon: 'error',
                    title: 'Erreur lors de la suppression',
                    text: error.message
                  })
              })
              
            }
          })
        }
      })
    }

</script>

@endpush