@extends ('../welcome')
@section ('content')

<!-- units -->
<!-- /.row -->
<div class="col-12">
    <div class="card">
        <div class="card-header">
            <h3 class="card-title">Units</h3>
        </div>
        <!-- /.card-header -->
        <div class="card-body">
            <table id="phases" class="table table-bordered table-striped">
                <thead>
                    <tr>
                        <th>Name</th>
                        <th>phase</th>
                        <th>Building</th>
                        <th>Building Type</th>
                        <th>Project</th>
                        <th>Total Price</th>
                        <th>Total Space</th>
                        <th>Floor</th>
                        <th>Bedroom</th>
                        <th>Garden Space</th>
                        <th>Bathrooms</th>
                        <th>Roof Space</th>
                        <th>Created At</th>
                        <th>Active</th>
                    </tr>
                </thead>
                <tbody>

                    @foreach ($units as $unit)
                    @if(empty($unit->building->phase->project->id))
                    @else
                    <tr>
                        <td>
                            <a href="{{route('units.show', $unit->id)}}">
                                {{$unit->name}}
                            </a>
                        </td>
                        <td>
                            <a href="{{route('phases.show', $unit->building->phase->id)}}">
                                {{$unit->building->phase->name}}
                            </a>
                        </td>
                        <td>
                            <a href="{{route('buildings.show', $unit->building->id)}}">
                                {{$unit->building->name}}
                            </a>
                        </td>
                        <td>{{$unit->building->type}}</td>
                        <td>
                            <a href="{{route('projects.show', $unit->building->phase->project->id)}}">
                                {{$unit->building->phase->project->name}}
                            </a>
                        </td>
                        <td>{{$unit->unit_total_price}}</td>
                        <td>{{$unit->unit_space}}</td>
                        <td>{{$unit->floor}}</td>
                        <td>{{$unit->bedrooms}}</td>
                        <td style="color: {{$unit->garden_space ? '' : 'red'}}">
                            {{$unit->garden_space ? $unit->garden_space : 'No Garden For this Unit'}}</td>
                        <td>{{$unit->bathrooms}}</td>
                        <td>{{$unit->building->roof_space}}</td>
                        <td>{{$unit->created_at}}</td>
                        <td>
                        @if(auth()->user()->type == 'admin')
                            <form action="{{ route('hideUnit', $unit->id) }}" method="POST">
                                @csrf
                                <button type="submit"
                                    class="btn btn-{{$unit->is_active == 0 ? '' : 'danger'}}">{{$unit->is_active == 0 ? '' : 'hide'}}</button>
                            </form>
                            @endif
                        </td>
                    </tr>
                    @endif
                    @endforeach
                </tbody>
            </table>
        </div>
        <!-- /.card-body -->
    </div>
</div>
<!-- /.row -->
<script>
$(function() {
    $("#phases").DataTable({
        "responsive": true,
        "lengthChange": false,
        "autoWidth": false,
        "buttons": ["copy", "csv", "excel", "pdf", "print", "colvis"]
    }).buttons().container().appendTo('#phases_wrapper .col-md-6:eq(0)');
    $('#example2').DataTable({
        "paging": true,
        "lengthChange": false,
        "searching": false,
        "ordering": true,
        "info": true,
        "autoWidth": false,
        "responsive": true,
    });
});
</script>
@endsection