@extends('layouts.app')

@section('content')


    <div class="pagetitle">
      <h1>Lista de servicii</h1>
      <nav>
        <ol class="breadcrumb">
          <li class="breadcrumb-item"><a href="{{route('home')}}">Acasa</a></li>
          <li class="breadcrumb-item">Servicii pentru utilitati</li>
          <li class="breadcrumb-item active">Management</li>
        </ol>
      </nav>
    </div><!-- End Page Title -->

    <section class="section">
      <div class="row">
        <div class="col-lg-6">

          <div class="card">
            <div class="card-body">
              <h5 class="card-title">Lista servicii</h5>
                <div class="table-responsive">
                    <table class="table table-stripped table-hover datatable">
                        <thead>
                            <tr>Denumire</tr>
                            <tr>Status</tr>
                            <tr>Optiuni</tr>
                        </thead>
                        <tbody>
                            @foreach($services as $service)
                            @php $service->status ? $status='Activ' : $status = 'Suspendat'; @endphp
                              <tr>
                                    <td>{{$service->name}}</td>
                                    <td>{{$status}}</td>
                                    <td>
                                          <button class="btn btn-sm btn-warning" data-bs-toggle="modal" data-bs-target="#edit-modal{{$service->id}}"><i class="bi bi-pencil"></i></button>
                                          <a href="{{route('destroy-service',$service->id)}}"class="btn btn-sm btn-danger"><i class="bi bi-trash"></i></a>
                                          
                                    </td>
                              </tr>

                              <!--Modal update -->
                              <div class="modal fade" id="edit-modal{{$service->id}}" tabindex="-1">
                                <div class="modal-dialog">
                                  <div class="modal-content">
                                    <div class="modal-header">
                                      <h5 class="modal-title"><i class="bi bi-pencil"></i> {{$service->name}}</h5>
                                      <button type="button" class="btn-close" data-bs-dismiss="modal" aria-label="Close"></button>
                                    </div>
                                    <div class="modal-body">
                                     <form action="{{route('update-service',$service->id)}}" method="POST" id="update-form{{$service->id}}">
                                        @csrf 
                                        @method('PUT')
                                        <label for="">Denumire <span class="text-danger">*</span></label>
                                        <input type="text" name="name" value="{{$service->name}}" id="" class="form-control">
                                        <label for="">Status <span class="text-danger">*</span></label>
                                        <select name="status" id="" class="form-control">
                                          <option value="">Alegeti Status </option>
                                          <option value="1" @if($service->status) selected @endif >Activ</option>
                                          <option value="0" @if(!$service->status) selected @endif  >Suspendat</option>
                                        </select>
                                    </form>
                                    </div>
                                    <div class="modal-footer">
                                      <button type="button" class="btn btn-danger" data-bs-dismiss="modal">Inchide</button>
                                      <button type="submit" form="update-form{{$service->id}}" class="btn btn-warning"><i class="bi bi-check"></i> Salveaza</button>
                                    </div>
                                  </div>
                                </div>
                              </div>
                              <!--End of update modal -->
                            @endforeach
                        </tbody>
                    </table>
                </div>
            </div>
          </div>

        </div>

        <div class="col-lg-6">

          <div class="card">
            <div class="card-body">
              <h5 class="card-title">Formular Adaugare</h5>
             <form action="{{route('store-service')}}" method="post">
              @csrf 
              <label for="">
                Denumire <span class="text-danger">*</span>
              </label>
              <input type="text" name="name" id="" class="form-control">
              <label for="">Status <span class="text-danger">*</span></label>
              <select name="status" id="" class="form-control">
                <option value="">Alegeti Status </option>
                <option value="1" selected>Activ</option>
                <option value="0">Suspendat</option>
              </select>
              <button class="btn btn-success form-control mt-5"><i class="bi bi-check"></i> Salveaza</button>
            </form>
            </div>
          </div>

        </div>
      </div>
    </section>



@endsection