@extends('layouts.app', ['title' => 'Projekte'])
@section('content')

    {{-- delete modal --}}
    <div class="modal fade modal-dialog-scrollable modal-lg" id="delete-item" data-bs-backdrop="static" data-bs-keyboard="false"
        tabindex="-1" aria-labelledby="staticBackdropLabel" aria-hidden="true">

        <div class="modal-dialog">
            <div class="modal-content">
                <form action="{{ route('Project.delete') }}" method="POST" class="needs-validation" novalidate>
                    @csrf

                    <input id="id" name="id" value="" hidden>
                    <div class="modal-header">
                        <h5 class="modal-title " id="staticBackdropLabel"> Projekt löschen </h5>
                        <button type="button" class="btn-close" data-bs-dismiss="modal" aria-label="Close"></button>
                    </div>

                    <div class="modal-body">

                        <div class="row mt-2">
                            <div class="col">
                                <h4 class="text-center">Möchten Sie den Projekt löschen ? </h4>
                            </div>

                        </div>

                    </div>
                    <div class="modal-footer">
                        <button type="button" class="btn btn-secondary" data-bs-dismiss="modal">Abbrechen</button>
                        <button type="submit" class="btn btn-danger">Löschen</button>
                    </div>
                </form>
            </div>
        </div>
    </div>
    <!-- main content -->

    <div class="row">
        <div class="col">
            @include('layouts.breadcrumb', ['crumbs' => [ucfirst(Request::segment(1)), ucfirst(Request::segment(2))]])
        </div>


    </div>
    <br>
    <div class="px-5 bg-white mb-5">
        @if (session('msg'))
            <div class="alert alert-success alert-dismissible" id="success-alert">
                <button type="button" class="btn-close" data-bs-dismiss="alert"></button>

                <p class="text-center"> {{ session('msg') }}</p>

            </div>
            <script>
                $("#success-alert").fadeTo(2000, 500).slideUp(500, function() {
                    $("#success-alert").slideUp(1000);
                });
            </script>
        @endif

        <br>
        @if (!empty($projects))
            <div class="row">

                <div class="col">
                    <a href="{{ route('Projects.enquiry') }}" class="text-decoration-none text-black">
                        <div class=" p-2 border rounded ">
                            <div class="card-body">
                                <div class="col-12">
                                    <h4>{{ $count_all }}</h4>
                                    <h6 class="text-secondary ">Alle</h6>
                                </div>
                                <div class="col-12 bg-info border-2  rounded " style="height: 4px;">
                                </div>
                            </div>
                        </div>
                    </a>
                </div>
                <div class="col">
                    <a href="/projekte/anfrage/status/1" class="text-decoration-none text-black">
                        <div class="p-2 border rounded">
                            <div class="card-body">
                                <div class="col-12">
                                    <h4>{{ $count_new }}</h4>
                                    <h6 class="text-secondary ">Unbearbeitet</h6>
                                </div>
                                <div class="col-12 bg-secondary border-2  rounded " style="height: 4px;">
                                </div>
                            </div>
                        </div>
                    </a>
                </div>
                <div class="col">
                    <a href="/projekte/anfrage/status/2" class="text-decoration-none text-black">
                        <div class="p-2 border rounded">
                            <div class="card-body">
                                <div class="col-12">
                                    <h4>{{ $count_inpro }}</h4>
                                    <h6 class="text-secondary ">In bearabeitung</h6>
                                </div>
                                <div class="col-12 bg-primary border-2  rounded " style="height: 4px;">
                                </div>
                            </div>
                        </div>
                    </a>
                </div>
                <div class="col"> <a href="/projekte/anfrage/status/3" class="text-decoration-none text-black">
                        <div class="p-2 border rounded">
                            <div class="card-body">
                                <div class="col-12">
                                    <h4>{{ $count_closed }}</h4>
                                    <h6 class="text-secondary ">wartet auf Versand</h6>
                                </div>
                                <div class="col-12 bg-info border-2  rounded " style="height: 4px;">
                                </div>
                            </div>
                        </div>
                    </a>
                </div>
                <div class="col">
                    <a href="/projekte/anfrage/status/4" class="text-decoration-none text-black">
                        <div class="p-2 border rounded">
                            <div class="card-body">
                                <div class="col-12">
                                    <h4>{{ $count_com }}</h4>
                                    <h6 class="text-secondary ">Versendet</h6>
                                </div>
                                <div class="col-12 bg-success border-2  rounded " style="height: 4px;">
                                </div>
                            </div>
                        </div>
                    </a>
                </div>

                <div class="col-1 border-start  border-dark"> <a href=" /projekte/anfrage/status/5"
                        class="text-decoration-none text-black">
                        <div class="p-2 border rounded">
                            <div class="card-body">
                                <div class="col-12">
                                    <h4>{{ $count_can }}</h4>
                                    <h6 class="text-secondary ">Abgesagt</h6>
                                </div>
                                <div class="col-12 bg-danger border-2  rounded " style="height: 4px;">
                                </div>
                            </div>
                        </div>
                    </a>
                </div>



            </div>
            <hr>
            <form action="{{ route('Projects') }}" method="get">

                <div class="row mt-1 mb-2">

                    <div class="col-3 text-center">
                    </div>
                    <div class="col-6 text-center">
                        <div class="input-group   ">
                            <input type="text" class="form-control  rounded-0" placeholder="suche nach Bauvorhaben"
                                id="name" name="name">
                            <div class="input-group-append   ">
                                <button class="btn  text-white bg-primary rounded-0 " type="submit"> <i
                                        class="bi bi-search"></i>
                                </button>
                            </div>
                        </div>
                    </div>
                    <div class="col-3 text-center">
                    </div>

                </div>
            </form>
            <div class="container-fluid">
                <div class=" ">
                    <table class="table table-hover no-wrap contact-list" data-page-size="5">
                        <thead>
                            <tr>
                                <th class="col">
                                    <a class="text-decoration-none text-info">ID
                                        <span class="sorting-icons"><i class="bi bi-arrow-down-up"></i></span></a>
                                </th>
                                <th class="col">
                                    <a class="text-decoration-none text-info">Service
                                        <span class="sorting-icons"><i class="bi bi-sort-down"></i></span></a>
                                </th>
                                <th class="col">
                                    <a class="text-decoration-none text-info">Bauvorhaben
                                        <span class="sorting-icons"><i class="bi bi-sort-down"></i></span></a>
                                </th>


                                <th class="col">
                                    <a class="text-decoration-none text-info">Kunde
                                        <span class="sorting-icons"><i class="ti-arrows-vertical"></i></span></a>
                                </th>
                                <th class="col">
                                    <a class="text-decoration-none text-info">Deadline
                                        <span class="sorting-icons"><i class="ti-arrows-vertical"></i></span></a>
                                </th>
                                <th class="col">
                                    <a class="text-decoration-none text-info">Status
                                        <span class="sorting-icons"><i class="ti-arrows-vertical"></i></span></a>
                                </th>
                                <th class="col">
                                    <a class="text-decoration-none text-info">Abteilung
                                        <span class="sorting-icons"><i class="ti-arrows-vertical"></i></span></a>
                                </th>
                                @if (Auth::user()->get_employee->is_mgt)
                                    <th class="col">Action

                                    </th>
                                @endif
                            </tr>
                        </thead>
                        <tbody id="clients-td-container" class="">
                            <!--ajax content here-->
                            <!--each row-->

                            @foreach ($projects as $item)
                                <tr id="">
                                    <th scope="row">
                                        {{ $item->project_id }}
                                    </th>
                                    <td>
                                        {{ $item->get_service->name }}
                                    </td>

                                    <td>
                                        <a href="/projekt/{{ $item->project_id }}"
                                            target="_blank">{{ $item->construction_project_name }}</a>
                                    </td>

                                    <td>
                                        {{ $item->get_customer->name }}
                                    </td>
                                    <td>
                                        {{ date('d.m.Y', strtotime($item->project_deadline)) }}
                                    </td>
                                    <td>
                                        <div class="btn btn-sm btn-{{ $item->get_status_in_company->color }}">
                                            {{ $item->get_status_in_company->name }}
                                        </div>
                                    </td>
                                    <td>
                                        <a>
                                            {{ $item->get_current_department->name }}
                                            {{-- {{ count($item->project_areas) }} --}}
                                        </a>
                                    </td>
                                    @if (Auth::user()->get_employee->is_mgt)
                                        <td class="" id="">
                                            <!--action button-->
                                            <span class="list-table-action dropdown font-size-inherit">
                                                <!--delete-->
                                                <button type="button" title="Löschen"
                                                    class="btn btn-sm btn-outline-danger delete_btn"
                                                    data-bs-toggle="modal" data-bs-target="#delete-item"
                                                    data-id="{{ $item->project_id }}">
                                                    <i class="bi bi-trash"></i>
                                                </button>
                                                <!--edit-->
                                                <a href="/projekt/bearbeiten/{{ $item->project_id }}" type="button"
                                                    target="_blank" title="Bearbeiten"
                                                    class="btn btn-sm btn-outline-success">
                                                    <i class="bi bi-pencil-square"></i>
                                                </a>

                                                <a href="/projekt/{{ $item->project_id }}" title="Anzeigen"
                                                    target="_blank" class="btn btn-sm btn-outline-primary">
                                                    <i class="bi bi-box-arrow-up-right"></i>
                                                </a>


                                            </span>
                                            <!--action button-->

                                        </td>
                                    @endif

                                </tr>
                                <!--each row-->
                            @endforeach
                        </tbody>
                        <tfoot>
                            <tr>

                            </tr>
                        </tfoot>
                    </table>
                    <br>
                    <div class="d-flex justify-content-center pagination pagination-lg text-dark">
                        {!! $projects->links() !!}
                    </div>
                </div>
            </div>
        @else
            <div class="row">
                <h6>Keine Daten</h6>
            </div>
        @endif

    </div>
    <script>
        $(document).on('click', '.delete_btn', function() {
                let id = $(this).attr('data-id');
                $('#id').val(id);
                // document.getElementById('ptitle').innerHTML = "You pressed ";
            }

        );
    </script>
    <script>
        function editItem(id) {
            $.get('/crm/kunden/' + id, function(item) {
                $("#id-edit").val(item.customer_id);
                $("#customer_category_id-edit").val(item.fk_customer_category_id);
                $("#name-edit").val(item.name);
                $("#address-edit").val(item.address);
                $("#tel-edit").val(item.tel);
                $("#mobile-edit").val(item.mobile);
                $("#fax-edit").val(item.fax);
                $("#email-edit").val(item.email);
                $("#website-edit").val(item.website);
                $("#edit-modal").modal('toggle');
            })
        }
    </script>
@endsection