@extends('layouts.metronic')

@section('title')
    <h1 class="d-flex align-items-center text-dark fw-bolder fs-3 my-1">DASHBOARD</h1>
@endsection


@section('content')

<div id="kt_content_container" class="container-xxl">
    @if(Session::has('success'))
        <div id="successAlert" class="alert alert-success" role="alert">
            <div class="row">
                <div class="col-md-11">{{Session::get('success')}}</div>
                <div class="col-md-1 d-flex justify-content-end">
                    <button type="button" class="btn-close" data-bs-dismiss="alert" aria-label="Close"></button>
                </div>
            </div>           
        </div>
    @endif
    @if ($errors->any())
    <div class="alert alert-danger">
        <ul>
            @foreach ($errors->all() as $error)
                <li>{{ $error }}</li>
            @endforeach
        </ul>
    </div>
    @endif


    <div class="col-md-12 pe-md-10 mb-10 mb-md-0">
        <div class="m-0">
            <div class="d-flex align-items-center collapsible py-3 toggle mb-0 active" data-bs-toggle="collapse" data-bs-target="#kt_job_6_1" aria-expanded="true">
                <div class="btn btn-sm btn-icon mw-20px btn-active-color-primary me-5">
                    <span class="svg-icon toggle-on svg-icon-primary svg-icon-1">
                        <svg xmlns="http://www.w3.org/2000/svg" width="24" height="24" viewBox="0 0 24 24" fill="none">
                            <rect opacity="0.3" x="2" y="2" width="20" height="20" rx="5" fill="black"></rect>
                            <rect x="6.0104" y="10.9247" width="12" height="2" rx="1" fill="black"></rect>
                        </svg>
                    </span>
                    <span class="svg-icon toggle-off svg-icon-1">
                        <svg xmlns="http://www.w3.org/2000/svg" width="24" height="24" viewBox="0 0 24 24" fill="none">
                            <rect opacity="0.3" x="2" y="2" width="20" height="20" rx="5" fill="black"></rect>
                            <rect x="10.8891" y="17.8033" width="12" height="2" rx="1" transform="rotate(-90 10.8891 17.8033)" fill="black"></rect>
                            <rect x="6.01041" y="10.9247" width="12" height="2" rx="1" fill="black"></rect>
                        </svg>
                    </span>
                </div>
                <h4 class="text-gray-700 fw-bolder cursor-pointer mb-0">Active</h4>
            </div>
            <div id="kt_job_6_1" class="row g-5 g-xl-10 mb-xl-10 collapse show">
                @foreach ($projects as $project)
                @if ($project->status == "Activ")
                <div class="col-md-6 col-lg-6 col-xl-6 col-xxl-6 mb-md-4 mb-xl-4">
                    <div class="card">
                        <div class="card-header pt-5">
                            <div class="card-title d-flex flex-column">
                                <table class="table table-row-dashed align-middle gs-0 gy-4 my-0">
                                    <tbody>
                                        <tr>
                                            <td>
                                            </td>
                                            <td class="ps-0">
                                                <div class="d-flex flex-stack">
                                                    <a href="{{ route('project.edit', $project->_id) }}" class="text-gray-800 fw-bolder text-hover-primary mb-1 fs-6 text-start pe-0">
                                                        {{$project->name}}
                                                    </a>
                                                    <span class="badge badge-light-success me-auto">Activ</span>
                                                </div>
                                                
                                                <span class="text-gray-400 fw-bold fs-7 d-block text-start ps-0">{{$project->client->name}}</span>


                                                <table id="kt_widget_table_3" class="table table-row-dashed align-middle fs-6 gy-4 my-0 pb-3 dataTable no-footer" data-kt-table-widget-3="all">
                                                    <thead class="d-none">
                                                        <tr><th class="sorting" tabindex="0" aria-controls="kt_widget_table_3" rowspan="1" colspan="1" aria-label="Campaign: activate to sort column ascending" style="width: 0px;">Campaign</th><th class="sorting" tabindex="0" aria-controls="kt_widget_table_3" rowspan="1" colspan="1" aria-label="Platforms: activate to sort column ascending" style="width: 0px;">Platforms</th><th class="sorting" tabindex="0" aria-controls="kt_widget_table_3" rowspan="1" colspan="1" aria-label="Status: activate to sort column ascending" style="width: 0px;">Status</th><th class="sorting" tabindex="0" aria-controls="kt_widget_table_3" rowspan="1" colspan="1" aria-label="Team: activate to sort column ascending" style="width: 0px;">Team</th><th class="sorting" tabindex="0" aria-controls="kt_widget_table_3" rowspan="1" colspan="1" aria-label="Date: activate to sort column ascending" style="width: 0px;">Date</th><th class="sorting" tabindex="0" aria-controls="kt_widget_table_3" rowspan="1" colspan="1" aria-label="Progress: activate to sort column ascending" style="width: 0px;">Progress</th><th class="sorting" tabindex="0" aria-controls="kt_widget_table_3" rowspan="1" colspan="1" aria-label="Action: activate to sort column ascending" style="width: 0px;">Action</th></tr>
                                                    </thead>
                                                    <tbody>                                              
                                                        
                                                        
                                                        @foreach($project->modules as $module)
                                                        @foreach($module->milestones as $milestone)
                                                        @foreach($milestone->tasks as $task)
                                                        @if ($task->isForUser)
                                                        <tr class="odd">
                                                            <td class="min-w-175px">
                                                                <div class="position-relative ps-6 pe-3 py-2">
                                                                    <div class="position-absolute start-0 top-0 w-4px h-100 rounded-2 bg-info"></div>



                                                                        <a href="{{ route('task.changeStatus', [$project->_id, $module->_id, $milestone->_id, $task->_id]) }}" id="statusButton{{$task->_id}}" class="mb-1 text-dark text-hover-primary fw-bolder">    
                                                                            {{$task->name}}
                                                                            <span class="badge badge-light-success me-auto">A</span>
                                                                        </a>      
                                                                        @section('script')
                                                                        @parent
                                                                        <script>
                                                                        document.getElementById("statusButton{{$task->_id}}").addEventListener('click', function (e) {
                                                                            e.preventDefault();
                                                                            Swal.fire({
                                                                                html: "Ești sigur că vrei să schimbi statusul taskului?",
                                                                                icon: "warning",
                                                                                showCancelButton: true,
                                                                                buttonsStyling: false,
                                                                                confirmButtonText: "Da, modifică!",
                                                                                cancelButtonText: "Nu, anulează",
                                                                                customClass: {
                                                                                    confirmButton: "btn fw-bold btn-danger",
                                                                                    cancelButton: "btn fw-bold btn-active-light-primary"
                                                                                }
                                                                            }).then(function (result) {
                                                                                if (result.value) {
                                                                                    document.location.href = document.getElementById("statusButton{{$task->_id}}").getAttribute('href');
                                                                                } 
                                                                            });
                                                                        })
                                                                        </script>
                                                                        @endsection
                                                                    
                                                                    



                                                                    <div class="fs-7 text-muted fw-bolder">Modul: <span style="color:#cc0099">{{$task->milestone->module->name}}</span></div>
                                                                    <div class="fs-7 text-muted fw-bolder">Milestone: <span style="color:#cc0099">{{$task->milestone->name}}</span></div>
                                                                    @if ($task->estimated_hours > 0)
                                                                    <div class="fs-7 text-muted fw-bolder">Ore estimate: <span style="color:#00cc00">{{$task->estimated_hours}}</span></span></div>
                                                                    @endif
                                                                    <div class="fs-7 text-muted fw-bolder">Ore lucrate: <span style="color:#3366ff">{{$task->worked_hours}}</span></div>
                                                                    @if ($task->ticket != null)
                                                                        <div class="fs-7 text-muted fw-bolder" id="ticketButton{{$task->_id}}">Ticket: <span style="color:#3366ff">{{$task->ticket->subject}}</span></div>

                                                                        @section('script')
                                                                        @parent
                                                                        <script>
                                                                        document.getElementById("ticketButton{{$task->_id}}").addEventListener('click', function (e) {
                                                                            e.preventDefault();
                                                                            Swal.fire({
                                                                                html: '{{$task->ticket->message}}',
                                                                                icon: "info",
                                                                                showCancelButton: true,
                                                                                showConfirmButton: false,
                                                                                buttonsStyling: false,

                                                                                cancelButtonText: "Închide",
                                                                                customClass: {
                                                                                    confirmButton: "btn fw-bold btn-danger",
                                                                                    cancelButton: "btn fw-bold btn-active-light-primary"
                                                                                }
                                                                            }).then(function (result) {
                                                                                
                                                                            });
                                                                        })
                                                                        </script>
                                                                        @endsection

                                                                    
                                                                    @endif
                                                                </div>
                                                            </td>                                                   
                                                            
                                                            <td class="text-end">
                                                                <div class="d-flex justify-content-end" data-kt-customer-table-toolbar="base">
                                                                    <a href="#" class="btn btn-primary er fs-8 px-4" data-bs-toggle="modal" data-bs-target="#add_time_modal{{$task->_id}}">
                                                                            Adauga ore
                                                                    </a>
                                                                </div>                                                        
                                                                
                                                            </td>
                                                            <div class="modal fade" id="add_time_modal{{$task->_id}}" tabindex="-1" aria-hidden="true" style="display: none;">
                                                                <div class="modal-dialog modal-xl">
                                                                    <div class="modal-content rounded">
                                                                        <div class="modal-header justify-content-end border-0 pb-0">
                                                                            <!--begin::Close-->
                                                                            <div class="btn btn-sm btn-icon btn-active-color-primary" data-bs-dismiss="modal">
                                                                                <!--begin::Svg Icon | path: icons/duotune/arrows/arr061.svg-->
                                                                                <span class="svg-icon svg-icon-1">
                                                                                    <svg xmlns="http://www.w3.org/2000/svg" width="24" height="24" viewBox="0 0 24 24" fill="none">
                                                                                        <rect opacity="0.5" x="6" y="17.3137" width="16" height="2" rx="1" transform="rotate(-45 6 17.3137)" fill="black"></rect>
                                                                                        <rect x="7.41422" y="6" width="16" height="2" rx="1" transform="rotate(45 7.41422 6)" fill="black"></rect>
                                                                                    </svg>
                                                                                </span>
                                                                                <!--end::Svg Icon-->
                                                                            </div>
                                                                            <!--end::Close-->
                                                                        </div>
                                                                        <form action="{{ route('worked_time.add') }}" method="POST" class="form fv-plugins-bootstrap5 fv-plugins-framework">
                                                                            <input type="hidden" name="_token" value="{{ csrf_token() }}">                                    
                                                                            <input type="hidden" name="project_id" value="{{$project->_id}}">                                    
                                                                            <input type="hidden" name="module_id" value="{{$module->_id}}">
                                                                            <input type="hidden" name="milestone_id" value="{{$milestone->_id}}">
                                                                            <input type="hidden" name="task_id" value="{{$task->_id}}">
                                                                            <div class="modal-body pt-0 pb-15 px-5 px-xl-20">
                                                                                <div class="mb-13 text-center">
                                                                                    <h1 class="mb-3">Adauga timp lucrat</h1>
                                                                                </div>
                                                                                
                                                                                <div class="col-md-12 fv-row fv-plugins-icon-container">
                                                                                    <label class="fs-5 fw-bold mb-2">Proiect: {{$project->name}}</label>
                                                                                    <label class="fs-5 fw-bold mb-2">{{$project->client->name}}</label>
                                                                                </div>

                                                                                <div class="col-md-12 fv-row fv-plugins-icon-container">
                                                                                    <label class="fs-5 fw-bold mb-2">Modul: {{$module->name}}</label>
                                                                                </div>

                                                                                <div class="col-md-12 fv-row fv-plugins-icon-container">
                                                                                    <label class="fs-5 fw-bold mb-2">Milestone: {{$milestone->name}}</label>
                                                                                </div>
                                                                                
                                                                                
                                                                                <div class="col-md-6 fv-row fv-plugins-icon-container mb-5">
                                                                                    <label class="required fs-5 fw-bold mb-2">Data</label>
                                                                                    <input type="text" class="form-control form-control-solid flatpickr-input active" placeholder="Selecteaza data" id="data{{$task->_id}}" name="date" readonly="readonly">
                                                                                </div>

                                                                                @section('script')
                                                                                @parent
                                                                                <script>                                                                            
                                                                                    var task_start_date_picker = $("#data{{$task->_id}}").flatpickr({enableTime:!1,dateFormat:"d-m-Y"})
                                                                                    task_start_date_picker.setDate(new Date());
                                                                                </script>
                                                                                @endsection
                                                                                
                                                                                <div class="col-md-12 fv-row fv-plugins-icon-container mb-5">
                                                                                    <label class="required fs-5 fw-bold mb-2">Ore lucrate</label>
                                                                                    <input type="number" step="0.5" class="form-control form-control-solid flatpickr-input active" placeholder="Selecteaza numarul de ore" name="hours">
                                                                                    <!-- <select class="form-select form-select-solid select2-hidden-accessible" name="hours" data-control="select2" data-hide-search="true" data-placeholder="Select a Team Member"  data-select2-id="" tabindex="-1" aria-hidden="true">
                                                                                        @for($i=0.5; $i<=24; $i+=0.5)
                                                                                        <option value="{{$i}}">{{$i}}</option>
                                                                                        @endfor
                                                                                    </select> -->
                                                                                </div>

                                                                                <div class="d-flex flex-column mb-8">
                                                                                    <label class="fs-6 fw-bold mb-2">Obesrvatii</label>
                                                                                    <textarea class="form-control form-control-solid" rows="3" name="obs" placeholder="Type Target Details"></textarea>
                                                                                </div>                                                   
                                                        
                                                                                <div class="d-flex flex-center flex-row-fluid pt-12">
                                                                                    <button type="submit" class="btn btn-primary">Adauga</button>
                                                                                </div>
                                                                            </div>
                                                                        </form>
                                                                    </div>
                                                                </div>
                                                            </div>
                                                        </tr>
                                                        <!--begin::Item-->
                                                        
                                                        @endif
                                                        @endforeach
                                                        @endforeach
                                                        @endforeach   
                                                        
                                                        
                                                    </tbody>
                                                </table>                                                
                                            </td>                                                                              
                                        </tr>                               
                                    </tbody>
                                </table>                           
                            </div>                        
                        </div>
                        <div class="card-body">
                            <span class="text-gray-400 fw-bold fs-7 d-block text-start ps-0">Perioada estimata: <span style="color:#cc0099"><b>{{$project->estimated_start_date->format("d.m.Y")}} - {{$project->estimated_end_date->format("d.m.Y")}}</b></span></span>
                            <span class="text-gray-400 fw-bold fs-7 d-block text-start ps-0">Ore estimate: <span style="color:#00cc00"><b>{{$project->estimated_hours}}</b></span></span>
                            <span class="text-gray-400 fw-bold fs-7 d-block text-start ps-0">Ore lucrate: <span style="color:#3366ff"><b>{{$project->worked_hours}}</b></span></span>
                            <span class="text-gray-400 fw-bold fs-7 d-block text-start ps-0">Atribuit lui: 
                                <span style="color:#cc0099"><b>
                                    @foreach($project->users as $user)
                                    {{$user->name}}[{{$user->role->code}}], 
                                    @endforeach
                                </b></span>
                            </span>
                            <span class="text-gray-400 fw-bold fs-7 d-block text-start ps-0">Creat la: <b>{{$project->created_at->format("d.m.Y")}}</b></span>
                        </div>
                    </div>  
                </div>
                @endif
                @endforeach   
            </div>
            <div class="separator separator-dashed"></div>
        </div>
        <div class="m-0">
            <div class="d-flex align-items-center collapsible py-3 toggle mb-0 collapsed" data-bs-toggle="collapse" data-bs-target="#kt_job_6_2" aria-expanded="false">
                <!--begin::Icon-->
                <div class="btn btn-sm btn-icon mw-20px btn-active-color-primary me-5">
                    <!--begin::Svg Icon | path: icons/duotune/general/gen036.svg-->
                    <span class="svg-icon toggle-on svg-icon-primary svg-icon-1">
                        <svg xmlns="http://www.w3.org/2000/svg" width="24" height="24" viewBox="0 0 24 24" fill="none">
                            <rect opacity="0.3" x="2" y="2" width="20" height="20" rx="5" fill="black"></rect>
                            <rect x="6.0104" y="10.9247" width="12" height="2" rx="1" fill="black"></rect>
                        </svg>
                    </span>
                    <span class="svg-icon toggle-off svg-icon-1">
                        <svg xmlns="http://www.w3.org/2000/svg" width="24" height="24" viewBox="0 0 24 24" fill="none">
                            <rect opacity="0.3" x="2" y="2" width="20" height="20" rx="5" fill="black"></rect>
                            <rect x="10.8891" y="17.8033" width="12" height="2" rx="1" transform="rotate(-90 10.8891 17.8033)" fill="black"></rect>
                            <rect x="6.01041" y="10.9247" width="12" height="2" rx="1" fill="black"></rect>
                        </svg>
                    </span>
                </div>
                <h4 class="text-gray-700 fw-bolder cursor-pointer mb-0">În așteptare</h4>

            </div>
            <div id="kt_job_6_2"  class="row g-5 g-xl-10 mb-xl-10 collapse">
                @foreach ($projects as $project)
                @if ($project->status != "Activ")
                <div class="col-md-4 col-lg-4 col-xl-4 col-xxl-4 mb-md-5 mb-xl-4" >
                    <div class="card" >
                        <div class="card-header pt-5">
                            <div class="card-title d-flex flex-column">
                                <table class="table table-row-dashed align-middle gs-0 gy-4 my-0">
                                    <tbody>
                                        <tr>
                                            <td>
                                            </td>
                                            <td class="ps-0">
                                                <a href="{{ route('project.edit', $project->_id) }}" class="text-gray-800 fw-bolder text-hover-primary mb-1 fs-6 text-start pe-0">
                                                    {{$project->name}}
                                                    <span class="badge badge-light-info me-auto">În așteptare</span>
                                                </a>
                                                <span class="text-gray-400 fw-bold fs-7 d-block text-start ps-0">{{$project->client->name}}</span>
                                            </td>  
                                                                            
                                        </tr>                               
                                    </tbody>
                                </table>                           
                            </div>                        
                        </div>
                        <div class="card-body">
                            <span class="text-gray-400 fw-bold fs-7 d-block text-start ps-0">Perioada estimata: <span style="color:#cc0099"><b>{{$project->estimated_start_date->format("d.m.Y")}} - {{$project->estimated_end_date->format("d.m.Y")}}</b></span></span>
                            <span class="text-gray-400 fw-bold fs-7 d-block text-start ps-0">Ore estimate: <span style="color:#00cc00"><b>{{$project->estimated_hours}}</b></span></span>
                            <span class="text-gray-400 fw-bold fs-7 d-block text-start ps-0">Ore lucrate: <span style="color:#3366ff"><b>{{$project->worked_hours}}</b></span></span>
                            <span class="text-gray-400 fw-bold fs-7 d-block text-start ps-0">Atribuit lui: 
                                <span style="color:#cc0099"><b>
                                    @foreach($project->users as $user)
                                    {{$user->name}}[{{$user->role->code}}], 
                                    @endforeach
                                </b></span>
                            </span>
                            <span class="text-gray-400 fw-bold fs-7 d-block text-start ps-0">Creat la: <b>{{$project->created_at->format("d.m.Y")}}</b></span>
                        </div>
                    </div>  
                </div>
                @endif
                @endforeach 
            </div>
            <div class="separator separator-dashed"></div>
            <!--end::Separator-->
        </div>

        <div class="m-0">
            <div class="d-flex align-items-center collapsible py-3 toggle mb-0 collapsed" data-bs-toggle="collapse" data-bs-target="#kt_job_6_3" aria-expanded="false">
                <!--begin::Icon-->
                <div class="btn btn-sm btn-icon mw-20px btn-active-color-primary me-5">
                    <!--begin::Svg Icon | path: icons/duotune/general/gen036.svg-->
                    <span class="svg-icon toggle-on svg-icon-primary svg-icon-1">
                        <svg xmlns="http://www.w3.org/2000/svg" width="24" height="24" viewBox="0 0 24 24" fill="none">
                            <rect opacity="0.3" x="2" y="2" width="20" height="20" rx="5" fill="black"></rect>
                            <rect x="6.0104" y="10.9247" width="12" height="2" rx="1" fill="black"></rect>
                        </svg>
                    </span>
                    <span class="svg-icon toggle-off svg-icon-1">
                        <svg xmlns="http://www.w3.org/2000/svg" width="24" height="24" viewBox="0 0 24 24" fill="none">
                            <rect opacity="0.3" x="2" y="2" width="20" height="20" rx="5" fill="black"></rect>
                            <rect x="10.8891" y="17.8033" width="12" height="2" rx="1" transform="rotate(-90 10.8891 17.8033)" fill="black"></rect>
                            <rect x="6.01041" y="10.9247" width="12" height="2" rx="1" fill="black"></rect>
                        </svg>
                    </span>
                </div>
                <h4 class="text-gray-700 fw-bolder cursor-pointer mb-0">Închise</h4>

            </div>
            <div id="kt_job_6_3"  class="row g-5 g-xl-10 mb-xl-10 collapse">
                @foreach ($projects as $project)
                @if ($project->status == "Închis")
                <div class="col-md-4 col-lg-4 col-xl-4 col-xxl-4 mb-md-5 mb-xl-4" >
                    <div class="card" >
                        <div class="card-header pt-5">
                            <div class="card-title d-flex flex-column">
                                <table class="table table-row-dashed align-middle gs-0 gy-4 my-0">
                                    <tbody>
                                        <tr>
                                            <td>
                                            </td>
                                            <td class="ps-0">
                                                <a href="{{ route('project.edit', $project->_id) }}" class="text-gray-800 fw-bolder text-hover-primary mb-1 fs-6 text-start pe-0">
                                                    {{$project->name}}
                                                    <span class="badge badge-light-danger me-auto">Închis</span>
                                                </a>
                                                <span class="text-gray-400 fw-bold fs-7 d-block text-start ps-0">{{$project->client->name}}</span>
                                            </td>  
                                                                            
                                        </tr>                               
                                    </tbody>
                                </table>                           
                            </div>                        
                        </div>
                        <div class="card-body">
                            <span class="text-gray-400 fw-bold fs-7 d-block text-start ps-0">Perioada estimata: <span style="color:#cc0099"><b>{{$project->estimated_start_date->format("d.m.Y")}} - {{$project->estimated_end_date->format("d.m.Y")}}</b></span></span>
                            <span class="text-gray-400 fw-bold fs-7 d-block text-start ps-0">Ore estimate: <span style="color:#00cc00"><b>{{$project->estimated_hours}}</b></span></span>
                            <span class="text-gray-400 fw-bold fs-7 d-block text-start ps-0">Ore lucrate: <span style="color:#3366ff"><b>{{$project->worked_hours}}</b></span></span>
                            <span class="text-gray-400 fw-bold fs-7 d-block text-start ps-0">Atribuit lui: 
                                <span style="color:#cc0099"><b>
                                    @foreach($project->users as $user)
                                    {{$user->name}}[{{$user->role->code}}], 
                                    @endforeach
                                </b></span>
                            </span>
                            <span class="text-gray-400 fw-bold fs-7 d-block text-start ps-0">Creat la: <b>{{$project->created_at->format("d.m.Y")}}</b></span>
                        </div>
                    </div>  
                </div>
                @endif
                @endforeach 
            </div>
            <div class="separator separator-dashed"></div>
            <!--end::Separator-->
        </div>
        
    </div>

   
   
</div>
@endsection

@section('menuVariables')
<script>
    var menuItemName = "menuDashboard";
</script>
@endsection