@extends('layouts.metronic')

@section('title')
    <h1 class="d-flex align-items-center text-dark fw-bolder fs-3 my-1">
        {{ !empty($project)?$project->name:"Proiect Nou"}}</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="d-flex flex-column flex-xl-row">
        <div class="flex-column flex-lg-row-auto w-100 w-xl-350px mb-12">
            <div class="card mb-5">
                <div class="card-body pt-15">

                    <div class="py-3 d-flex flex-stack flex-wrap">
                        <!--begin::Toggle-->
                        <div class="d-flex align-items-center collapsible rotate active" data-bs-toggle="collapse" href="#kt_customer_view_payment_method_1" role="button" aria-expanded="true" aria-controls="kt_customer_view_payment_method_1">

                            <div class="me-3">
                                <div class="d-flex align-items-center">
                                    <span class="fs-3 text-gray-800 text-hover-primary fw-bolder mb-1">{{ !empty($project)?$project->name:"Proiect Nou"}}</span>
                                </div>
                                
                                <span class="fs-5 fw-bold text-muted mb-6">{{ !empty($project)?$project->client->name:""}}</span>

                                @if (!empty($project))
                                @if (Auth::user()->role->code == 'ADMIN' || Auth::user()->role->code == 'PM' || Auth::user()->email == 'andrei.lucaci@headlightsolutions.ro')
                                <a href="{{ route('project.changeStatus', [$project->_id]) }}"  id="statusButton">    
                                    @endif
                                @if($project->status=="Activ")
                                    <span class="badge badge-light-success me-auto">Activ</span>
                                @else
                                    <span class="badge badge-light-danger me-auto">Închis</span>
                                @endif
                                @if (Auth::user()->role->code == 'ADMIN' || Auth::user()->role->code == 'PM' || Auth::user()->email == 'andrei.lucaci@headlightsolutions.ro')
                                </a>
                                @endif
                                @endif
                            </div>
                            <!--end::Summary-->
                        </div>
                        @if (!empty($project)) 
                        @if (Auth::user()->role->code == 'ADMIN' || Auth::user()->role->code == 'PM' || Auth::user()->email == 'andrei.lucaci@headlightsolutions.ro')
                        <div class="d-flex my-3 ms-9">
                            <a href="#" class="btn btn-icon btn-active-light-primary w-30px h-30px me-3" data-bs-toggle="modal" data-bs-target="#kt_modal_new_card">
                                <span data-bs-toggle="tooltip" data-bs-trigger="hover" title="" data-bs-original-title="Edit">
                                    <span class="svg-icon svg-icon-3">
                                        <svg xmlns="http://www.w3.org/2000/svg" width="24" height="24" viewBox="0 0 24 24" fill="none">
                                            <path opacity="0.3" d="M21.4 8.35303L19.241 10.511L13.485 4.755L15.643 2.59595C16.0248 2.21423 16.5426 1.99988 17.0825 1.99988C17.6224 1.99988 18.1402 2.21423 18.522 2.59595L21.4 5.474C21.7817 5.85581 21.9962 6.37355 21.9962 6.91345C21.9962 7.45335 21.7817 7.97122 21.4 8.35303ZM3.68699 21.932L9.88699 19.865L4.13099 14.109L2.06399 20.309C1.98815 20.5354 1.97703 20.7787 2.03189 21.0111C2.08674 21.2436 2.2054 21.4561 2.37449 21.6248C2.54359 21.7934 2.75641 21.9115 2.989 21.9658C3.22158 22.0201 3.4647 22.0084 3.69099 21.932H3.68699Z" fill="black"></path>
                                            <path d="M5.574 21.3L3.692 21.928C3.46591 22.0032 3.22334 22.0141 2.99144 21.9594C2.75954 21.9046 2.54744 21.7864 2.3789 21.6179C2.21036 21.4495 2.09202 21.2375 2.03711 21.0056C1.9822 20.7737 1.99289 20.5312 2.06799 20.3051L2.696 18.422L5.574 21.3ZM4.13499 14.105L9.891 19.861L19.245 10.507L13.489 4.75098L4.13499 14.105Z" fill="black"></path>
                                        </svg>
                                    </span>
                                </span>
                            </a>
                        </div>
                        @endif
                        @endif
                    </div>

                    
                    <div class="d-flex flex-stack fs-4 py-3">
                        @if (empty($project)) 
                        <form action="{{ route('project.save') }}" method="POST" class="form fv-plugins-bootstrap5 fv-plugins-framework">
                            <input type="hidden" name="_token" value="{{ csrf_token() }}">                                    

                            <div class="col-md-12 fv-row fv-plugins-icon-container mb-5">
                                <label class="required fs-5 fw-bold mb-2">Nume</label>
                                <input type="text" class="form-control form-control-solid" name="name" value="{{ (!empty($project))?$project->name:old('name') }}" required>
                            </div>


                            <div class="col-md-12 fv-row fv-plugins-icon-container">
                                <label class="required fs-5 fw-bold mb-2">Client</label>
                                    <select name="client_id" class="form-select form-select-solid select2-hidden-accessible"  data-control="select2" data-hide-search="true" data-placeholder="Select a Team Member"  data-select2-id="" tabindex="-1" aria-hidden="true">
                                        @foreach ($clients as $client)
                                        <option value="{{ $client->_id }}" {{ (!empty($project) && $project->client_id==$client->_id)?'selected':'' }}>{{ $client->name }}</option>
                                        @endforeach
                                    </select>
                            </div>              
                            
                            <div class="d-flex my-4">
                                <button type="submit" class="btn btn-sm btn-primary" data-kt-users-modal-action="submit">
                                    <span class="indicator-label">Salvează</span>
                                </button>
                            </div>
                        </form>
                        @endif
                    </div>
                    @if (!empty($project)) 
                    <div class="separator separator-dashed my-3"></div>
                        @if (!empty($project->analyze_url)) 
                        <div class="pb-5 fs-6">
                            <a class="nav-link text-active-primary pb-4 active" target="_blank" href="{{$project->analyze_url}}">Analiză</a>
                        </div>
                        @endif
                        @if (!empty($project->manual_url)) 
                        <div class="pb-5 fs-6">
                            <a class="nav-link text-active-primary pb-4 active" target="_blank" href="{{$project->manual_url}}">Manual Utilizator</a>
                        </div>
                        @endif
                    @endif
                    <!--end::Details content-->
                </div>
                <!--end::Card body-->
            </div>
            <!--end::Card-->
        </div>
        <!--end::Sidebar-->
        <!--begin::Content-->
        @if (!empty($project))
        <div class="flex-lg-row-fluid ms-lg-15">
            <ul class="nav nav-custom nav-tabs nav-line-tabs nav-line-tabs-2x border-0 fs-4 fw-bold mb-8">
                <li class="nav-item">
                    <a class="nav-link text-active-primary pb-4 active" data-bs-toggle="tab" href="#modules_tab">Module</a>
                </li>
                <li class="nav-item">
                    <a class="nav-link text-active-primary pb-4" data-bs-toggle="tab" href="#users_tab">Utilizatori</a>
                </li>                
            </ul>
            <!--end:::Tabs-->
            <!--begin:::Tab content-->
            <div class="tab-content" id="myTabContent">
                <div class="tab-pane fade active show" id="modules_tab" role="tabpanel">
                    <div class="card">              
                        <div class="card-header border-0 pt-6">
                            <div class="card-title">
                                <h2>Module</h2>
                            </div>
                            
                        </div>          
                        <div class="card-body pt-0">
                            <!--begin::Table-->
                            <div id="kt_customers_table_wrapper" class="dataTables_wrapper dt-bootstrap4 no-footer">
                                <div class="table-responsive">
                                    <table id="kt_customers_table" class="table table-row-bordered gy-5">
                                        <tbody>
                                            @foreach ($project->modules as $module)
                                            <tr class="gradeX odd" role="row">
                                                <td> {{ $module->name }} </td>
                                                <td class="text-end">  
                                                    @if (Auth::user()->role->code == 'ADMIN' || Auth::user()->role->code == 'PM' || Auth::user()->email == 'andrei.lucaci@headlightsolutions.ro')
                                                    @if (count($module->milestones) == 0)
                                                    <a href="{{ route('module.delete', [$project->_id, $module->_id]) }}" class="btn btn-icon btn-bg-light btn-active-color-primary btn-sm" data-action="delete_row">    
                                                        <span class="svg-icon svg-icon-3">
                                                            <svg xmlns="http://www.w3.org/2000/svg" width="24" height="24" viewBox="0 0 24 24" fill="none">
                                                                <path d="M5 9C5 8.44772 5.44772 8 6 8H18C18.5523 8 19 8.44772 19 9V18C19 19.6569 17.6569 21 16 21H8C6.34315 21 5 19.6569 5 18V9Z" fill="black"></path>
                                                                <path opacity="0.5" d="M5 5C5 4.44772 5.44772 4 6 4H18C18.5523 4 19 4.44772 19 5V5C19 5.55228 18.5523 6 18 6H6C5.44772 6 5 5.55228 5 5V5Z" fill="black"></path>
                                                                <path opacity="0.5" d="M9 4C9 3.44772 9.44772 3 10 3H14C14.5523 3 15 3.44772 15 4V4H9V4Z" fill="black"></path>
                                                            </svg>
                                                        </span>
                                                    </a>
                                                    @endif
                                                    @endif
                
                                                    <a href="{{ route('module.edit', [$project->_id, $module->_id]) }}" class="btn btn-icon btn-bg-light btn-active-color-primary btn-sm me-1">
                                                        <span class="svg-icon svg-icon-3">
                                                            <svg xmlns="http://www.w3.org/2000/svg" width="24" height="24" viewBox="0 0 24 24" fill="none">
                                                                <path opacity="0.3" d="M21.4 8.35303L19.241 10.511L13.485 4.755L15.643 2.59595C16.0248 2.21423 16.5426 1.99988 17.0825 1.99988C17.6224 1.99988 18.1402 2.21423 18.522 2.59595L21.4 5.474C21.7817 5.85581 21.9962 6.37355 21.9962 6.91345C21.9962 7.45335 21.7817 7.97122 21.4 8.35303ZM3.68699 21.932L9.88699 19.865L4.13099 14.109L2.06399 20.309C1.98815 20.5354 1.97703 20.7787 2.03189 21.0111C2.08674 21.2436 2.2054 21.4561 2.37449 21.6248C2.54359 21.7934 2.75641 21.9115 2.989 21.9658C3.22158 22.0201 3.4647 22.0084 3.69099 21.932H3.68699Z" fill="black"></path>
                                                                <path d="M5.574 21.3L3.692 21.928C3.46591 22.0032 3.22334 22.0141 2.99144 21.9594C2.75954 21.9046 2.54744 21.7864 2.3789 21.6179C2.21036 21.4495 2.09202 21.2375 2.03711 21.0056C1.9822 20.7737 1.99289 20.5312 2.06799 20.3051L2.696 18.422L5.574 21.3ZM4.13499 14.105L9.891 19.861L19.245 10.507L13.489 4.75098L4.13499 14.105Z" fill="black"></path>
                                                            </svg>
                                                        </span>
                                                    </a>                                                                                               
                                                </td>       
                                            </tr>
                                            @endforeach
                                        </tbody>
                                    </table>
                                </div>                
                            </div>
                        </div>
                    </div>
                </div>
                <div class="tab-pane fade" id="users_tab" role="tabpanel">
                    <div class="card">
                        <div class="card-header border-0 pt-6">
                            <div class="card-title">
                                <h2>Utilizatori</h2>
                            </div>
                            <div class="card-toolbar">
                                <!--begin::Toolbar-->
                                <div class="d-flex justify-content-end" data-kt-customer-table-toolbar="base">
                                    <!--begin::Add button-->
                                    @if (Auth::user()->role->code == 'ADMIN' || Auth::user()->role->code == 'PM' || Auth::user()->email == 'andrei.lucaci@headlightsolutions.ro')
                                    <a href="#" class="btn btn-primary er fs-6 px-8 py-4" data-bs-toggle="modal" data-bs-target="#kt_modal_upgrade_plan">Adauga utilizatori</a>
                                    @endif
                                    <!--end::Add button-->
                                </div>
                                <!--end::Toolbar-->                
                            </div>
                        </div>
                        <div class="card-body pt-0">
                            <!--begin::Table-->
                            <div id="kt_customers_table_users_wrapper" class="dataTables_wrapper dt-bootstrap4 no-footer">
                                <div class="table-responsive">
                                    <table id="kt_customers_table_users" class="table table-row-bordered gy-5">
                                        <tbody>
                                            @foreach ($project->users as $user)
                                            <tr class="gradeX odd" role="row">
                                                <td> {{ $user->name }} [{{ $user->role->code }}] </td>
                                                <td class="text-end">                                    
                                                </td>       
                                            </tr>
                                            @endforeach
                                        </tbody>
                                    </table>
                                </div>
                                
                            </div>
                            <!--end::Table-->
                        </div>
                    </div>
                </div>
            </div>
        </div>
        @endif
    </div>




    

    
    <!--end::Card-->    
    @if (!empty($project)) 
    
    <div class="modal fade" id="kt_modal_new_card" tabindex="-1" aria-hidden="true">
        <!--begin::Modal dialog-->
        <div class="modal-dialog modal-dialog-centered mw-650px">
            <!--begin::Modal content-->
            <div class="modal-content">
                <!--begin::Modal header-->
                <div class="modal-header">
                    <!--begin::Modal title-->
                    <h2>Setari proiect</h2>
                    <!--end::Modal title-->
                    <!--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 x="7.41422" y="6" width="16" height="2" rx="1" transform="rotate(45 7.41422 6)" fill="black" />
                            </svg>
                        </span>
                        <!--end::Svg Icon-->
                    </div>
                    <!--end::Close-->
                </div>
                <!--end::Modal header-->
                <!--begin::Modal body-->
                <div class="modal-body scroll-y mx-5 mx-xl-15 my-7">
                    <!--begin::Form-->
                    
                        
                        <!--end::Actions-->
                    

                    <form action="{{ route('project.save') }}" method="POST" class="form fv-plugins-bootstrap5 fv-plugins-framework">
                        <input type="hidden" name="_token" value="{{ csrf_token() }}">                                    
                        <input type="hidden" name="id" value="{{ $project->_id }}">

                        <div class="col-md-12 fv-row fv-plugins-icon-container mb-5">
                            <label class="required fs-5 fw-bold mb-2">Nume</label>
                            <input type="text" class="form-control form-control-solid" name="name" value="{{ (!empty($project))?$project->name:old('name') }}" required>
                        </div>


                        <div class="col-md-12 fv-row fv-plugins-icon-container mb-5">
                            <label class="required fs-5 fw-bold mb-2">Client</label>
                                <select name="client_id" class="form-select form-select-solid select2-hidden-accessible"  data-control="select2" data-hide-search="true" data-placeholder="Select a Team Member"  data-select2-id="" tabindex="-1" aria-hidden="true">
                                    @foreach ($clients as $client)
                                    <option value="{{ $client->_id }}" {{ (!empty($project) && $project->client_id==$client->_id)?'selected':'' }}>{{ $client->name }}</option>
                                    @endforeach
                                </select>
                        </div>    

                        <div class="col-md-12 fv-row fv-plugins-icon-container mb-5">
                            <label class="fs-5 fw-bold mb-2">Analiza</label>
                            <input type="text" class="form-control form-control-solid" name="analyze_url" value="{{ (!empty($project))?$project->analyze_url:old('analyze_url') }}">
                        </div>

                        <div class="col-md-12 fv-row fv-plugins-icon-container mb-5">
                            <label class="fs-5 fw-bold mb-2">Manual Utilizator</label>
                            <input type="text" class="form-control form-control-solid" name="manual_url" value="{{ (!empty($project))?$project->manual_url:old('manual_url') }}">
                        </div>
                        
                        <div class="text-center pt-15">
                            <button type="reset" id="kt_modal_new_card_cancel" class="btn btn-light me-3">Discard</button>
                            <button type="submit" id="kt_modal_new_card_submit" class="btn btn-primary">
                                <span class="indicator-label">Salvează</span>                                
                            </button>
                        </div>

                        

                        
                        
                    </form>
                    <!--end::Form-->
                </div>
                <!--end::Modal body-->
            </div>
            <!--end::Modal content-->
        </div>
        <!--end::Modal dialog-->
    </div>

    <div class="modal fade" id="kt_modal_upgrade_plan" 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('project.add.users', $project->_id) }}" method="POST" class="form fv-plugins-bootstrap5 fv-plugins-framework">
                    <input type="hidden" name="_token" value="{{ csrf_token() }}">                                    
                    <div class="modal-body pt-0 pb-15 px-5 px-xl-20">
                        <div class="mb-13 text-center">
                            <h1 class="mb-3">Utilizatori</h1>
                        </div>
                        <div class="d-flex flex-column">
                            <table>
                                <tbody>
                                    @foreach($departments as $department)
                                    <tr>
                                        <td colspan="2">{{$department->name}}</td>
                                    </tr>
                                    <tr>
                                        <td width="20px">
                                        </td>
                                        <td>
                                            @foreach($department->users as $user)
                                            <table>
                                                <tbody>     
                                                    <tr>
                                                        <td width="10px">
                                                            <input name="{{$user->_id}}" type="checkbox" {{ ($project->users->contains($user))?"checked":""}}/>
                                                        </td>
                                                        <td>
                                                            {{$user->name}} ({{ $user->role->code }})
                                                        </td>
                                                    </tr>
                                                </tbody>
                                            </table>
                                            @endforeach
                                        </td>
                                    </tr>
                                    @endforeach
                                </tbody>
                            </table>
                        </div>
                        <div class="d-flex flex-center flex-row-fluid pt-12">
                            <button type="submit" class="btn btn-primary">Salveaza</button>
                        </div>
                    </div>
                </form>
            </div>
        </div>
    </div>
    @endif
</div>




@endsection

@section('script')
<script src="assets/plugins/custom/datatables/datatables.bundle.js"></script>
<script>
    AddDeleteFunctionToRows('kt_customers_table_wrapper', 0); 

    document.getElementById("statusButton").addEventListener('click', function (e) {
        e.preventDefault();
        Swal.fire({
            html: "Ești sigur că vrei să schimbi statusul proiectului?",
            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").getAttribute('href');
            } 
        });
    })
</script>
@endsection

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