@extends('layouts.admin')

@section('main-content')

@php
    $setting_notification_email = App\Models\Setting::where('name', 'work_notification_email')->first();
    $setting_notification_sms = App\Models\Setting::where('name', 'work_notification_sms')->first();
    $work = $selected_task;
    
    $phone = $work?->process?->contact_phone ? $work?->process?->contact_phone : $work?->process?->client?->phone ?? '';
    $phone = substr_replace($phone, ' ', 3, 0);
    $phone = substr_replace($phone, ' ', 6, 0);
    $phone = substr_replace($phone, ' ', 10, 0);

    $worksheet = App\Models\Worksheet::where('offer_id', $work?->offer?->id)->get();
    $issue_ticket = $work?->issue_ticket;
@endphp

<div class="card">
    <div class="card-header">
        Munkák szervezése
    </div>
    <div class="card-body">

        {{-- Szervezendő feladatok --}}
        <div class="col-12 mb-3 px-0">
            <div class="accordion accordion-flush" id="accordion">
                <div class="accordion-item">
                    <h2 class="accordion-header" id="flush-heading">
                        <button class="accordion-button @if(!$work) collapsed @endif" type="button" data-bs-toggle="collapse" data-bs-target="#flush-collapse" aria-expanded="false" aria-controls="flush-collapse">
                            <h5 class="mb-0">Feladatok @if($issue_ticket) (Hibaazonosító: {{$issue_ticket->issue_number}})@endif</h5>
                        </button>
                    </h2>
                    <div id="flush-collapse" class="accordion-collapse collapse @if(!$work) show @endif" aria-labelledby="flush-heading" data-bs-parent="#accordion">
                        @foreach($tasks->chunk(6) as $chunk)
                            <div class="row mx-0 py-2">
                                @foreach($chunk as $task)
                                    @php
                                        $route = $task->offer_id ? 'works.organize' : 'tasks.edit';
                                    @endphp
                                    <div class="col-6 col-md-4 col-lg-2 p-1">
                                        <div 
                                            class="card text-white @if($work && $work->id == $task->id) bg-primary @else bg-secondary @endif mb-3" 
                                            style="max-width: 18rem; min-height: 100%; max-height: 12rem; cursor: pointer;" 
                                            onclick="window.location='{{route($route, ['id' => $task->id])}}'"
                                        >
                                            {{-- <div class="card-header">Header</div> --}}
                                            <div class="card-body text-center">
                                            @if(!$task->task_id)
                                            <h5 class="card-title">{{ $task->process->contact_name ? $task->process->contact_name : $task->process->client->full_name }}</h5>
                                            <p class="card-text">{{ $task->process->address->full_address }}</p>
                                            @else
                                            <h5 class="card-title">{{ $task->task->title }}</h5>
                                            <p class="card-text">{{ $task->task->description }}</p>
                                            @endif
                                            </div>
                                        </div>
                                    </div>
                                @endforeach
                            </div>
                        @endforeach
                    </div>
                </div>
            </div>
        </div>
        
        <div class="row">
            {{-- Adatok & Form --}}
            @if ($work)
            <div class="col-12 col-xl-6 mb-2">
                <div class="card mb-2">
                    <div class="card-body">
                        <h5 class="card-title">
                            @if(!$issue_ticket)
                            {{ $work?->offer?->offer_number ?? null }} 
                            @else
                            {{$issue_ticket->issue_number}}
                            @endif
                            {{ $work?->process?->client?->company_name ? $work?->process?->client?->company_name.' -' : '' }} 
                            {{ $work?->process?->project_name ? $work?->process?->project_name.',' : '' }} 
                            {{ $work?->process?->contact_name ? $work?->process?->contact_name : $work?->process?->client?->full_name }}
                        </h5>
                        <h6 class="card-subtitle mb-2 text-muted">
                            <a href="{{route('works.work_details', [$work->id])}}" target="_blank">{{ $work->process->address->full_address }}</a>
                        </h6>
                        <p class="card-text">
                            @if($work->process->contact_phone || $work->process->client->phone) 
                                <a href="tel:{{ $work->process->contact_phone ? $work->process->contact_phone : $work->process->client->phone ?? '' }}">{{ $phone }}</a>
                            @endif
                        </p>
                    </div>
                </div>

                <form action="{{ route('works.organize_date') }}" method="POST" id="task_form_{{ $work->id }}">
                    @csrf
                    <div class="mb-2">
                        @if(!$issue_ticket)
                            <div style="font-weight: 600">Munkavégzés leírása:</div>
                            <div>{{$work->offer->work_description ?? ''}}</div>
                            <div style="font-weight: 600">Feladat leírása:</div>
                            <div>{{$work->description ?? ''}}</div>
                            <div>{{$work->order_description ?? ''}}</div>
                            <div style="font-weight: 600">Feladathoz megjegyzés:</div>
                            <div>{!! ($work->comments()->get()->map(function ($comment) { return $comment->comment; })->implode('. ')) ? $work->comments()->get()->map(function ($comment) { return $comment->comment; })->implode('. ') : ''; !!}</div>
                        @else
                            <div style="font-weight: 600">Hibabejelentés leírása:</div>
                            <div>{{$issue_ticket->description ?? ''}}</div>
                            <div style="font-weight: 600">Hibajavítás leírása:</div>
                            <div>{{$issue_ticket->fix_description ?? ''}}</div>
                                @if(isset($issue_ticket->history))
                                    <hr>
                                    @include('issue_ticket.history', [$issue_ticket])
                                @endif
                            <div style="font-weight: 600">Feladat leírása:</div>
                            <div>{{$work->description ?? ''}}</div>
                            <div style="font-weight: 600">Feladathoz megjegyzés:</div>
                            <div>
                                {!! ($work->comments()->get()->map(function ($comment) { return $comment->comment; })->implode('. ')) ? $work->comments()->get()->map(function ($comment) { return $comment->comment; })->implode('. ') : ''; !!}
                            </div>
                        @endif

                        {{-- {!! $work->calEvent('main_calendar', 'fullcalendar')['title'] ?? '' !!} --}}

                        @if(App\Models\Offer::find($work->offer_id)->final_payment_method == 'cash_locally')
                        <br><i>Fennmaradó összeget a helyszínen fizetik ({{ number_format($work->offer->remaining_amount ?? 0, 0, '', ' ').' Ft.'}})</i>
                        @endif
                    </div>

                    <hr />

                    @if(!$issue_ticket)
                    <div class="mb-2">
                        {!! ($work->offer->supplier_offers->unique('id')->implode('stock', ', ')) ? 'Polc: ' . $work->offer->supplier_offers->unique('id')->implode('stock', ', ') : '' !!}
                    </div>
                    @endif
                    {{--
                    <div class="mb-2">
                        {{ App\Models\SaleItem::find(array_keys($work->offer->products))->map(function($saleItem){ return $saleItem->short_name; })->implode(', ') }}
                        {{ App\Models\SaleItem::find(array_keys($work->offer->services))->map(function($saleItem){ return $saleItem->short_name; })->implode(', ') }}
                    </div>
                    --}}

                    {{-- <div class="mb-2">
                        @php
                            $documents = collect($work->offer->getDocuments())->whereIn('type', ['survey',  'plan', 'location', 'technical_description'])->map(function ($document) { return $document->typeLang . ': <a href="'.$document->fileOpenUrl.'" target="_blank">'.$document->name.'</a>'; })->implode(' <br> ');
                        @endphp

                        {!! ($documents) ?? '' !!}
                    </div> --}}

                    @if(!$issue_ticket)
                    <div class="mb-2">
                        @php
                            $documents = collect($work->offer->getDocuments())->whereIn('type', ['survey', 'plan', 'location', 'technical_description']);
                            $sortedDocuments = $documents->sortBy(function ($document) {
                                $types = ['survey', 'location', 'plan', 'technical_description'];
                                $type = in_array($document->type, $types) ? array_search($document->type, $types) : -1;
                                return $type;
                            })->map(function ($document) {
                                return $document->typeLang . ': <a href="' . $document->fileOpenUrl . '" target="_blank">' . $document->name . '</a>';
                            })->implode(' <br> ');
                        @endphp
                    
                        {!! ($sortedDocuments) ?? '' !!}
                    </div>
                    @endif
                    
                    <div class="mb-3 comment-box mt-1">
                        @include('comments.panel', ['comment_target' => $work])
                    </div>

                    {{-- @if ($work->status != 'organize') --}}
                    <div class="mb-3">
                        <label for="status">{!! __('Státusz') !!}</label>
                        <select class="form-select mt-1 set_date_to_null @error('status') is-invalid @enderror" id="status" name="status">
                            @foreach (App\Models\Work::statuses() as $key => $value)
                                @if($key == 'delayed')
                                    @continue
                                @endif
                                <option @if($key == 'completed') @cannot('work-set_completed') disabled @endcannot @endif value="{{$key}}" @if(isset($work->status) && $key == $work->status) selected @endif>{!! __($value) !!}</option>
                            @endforeach
                        </select>
                    </div>
                    {{-- @endif --}}

                    <div class="form-group">
                        <label for="start_date">{!! __('Kezdés időpontja') !!}</label>
                        <input type="text" name="start_date" class="form-control w-100 input_start_date datetimepicker @error('start_date') is-invalid @enderror" onchange="check_date('#new_{{ $work->id }}');" id="task_{{ $work->id }}_start_date" data-type="start_date" data-taskid="{{ $work->id }}" value="{{ ($work->start_date) ? date('Y-m-d H:i', strtotime($work->start_date)) : null }}">
                        @error('start_date')
                            <span class="invalid-feedback" role="alert">
                                <strong>{{ $message }}</strong>
                            </span>
                        @enderror
                    </div>

                    <div class="form-group">
                        <label for="end_date">{!! __('Befejezés időpontja') !!}</label>
                        <input type="text" name="end_date" class="form-control w-100 input_end_date datetimepicker @error('end_date') is-invalid @enderror" onchange="check_date('#new_{{ $work->id }}')" id="task_{{ $work->id }}_end_date" data-type="end_date" data-taskid="{{ $work->id }}" value="{{ ($work->start_date) ? date('Y-m-d H:i', strtotime($work->end_date)) : null }}">
                        @error('end_date')
                            <span class="invalid-feedback" role="alert">
                                <strong>{{ $message }}</strong>
                            </span>
                        @enderror
                    </div>

                    {{--
                    <div class="form-group">
                        <label for="notification_date">{!! __('Kezdés időpontja az értesítésben') !!}</label>
                        <input type="text" name="notification_date" class="form-control w-100 input_notification_date datetimepicker @error('notification_date') is-invalid @enderror" onchange="check_date('#new_{{ $work->id }}')" id="task_{{ $work->id }}_notification_date" data-type="notification_date" data-taskid="{{ $work->id }}" value="{{ ($work->start_date) ? date('Y-m-d H:i', strtotime($work->notification_date)) : null }}">
                        @error('notification_date')
                            <span class="invalid-feedback" role="alert">
                                <strong>{{ $message }}</strong>
                            </span>
                        @enderror
                    </div>
                    --}}
                    <input type="hidden" name="id" value="{{ $work->id }}">
                    <input type="hidden" name="need_to_be_reorganised" class="need_to_be_reorganised"/> {{-- Újra szervezésre került (dátum) --}}
                    <button class="btn btn-primary btn-sm submit_button mt-2" type="button" onclick="chk_vehicle()">Mentés</button>
                    @if($setting_notification_email->value == true)
                        <div class="form-check float-right mt-2">
                            <input 
                                class="form-check-input" 
                                type="checkbox" 
                                id="work_notification_email" 
                                name="work_notification_email" 
                                value="@if($work->can_send_notification) 1 @endif"  
                                @if($work->can_send_notification) checked @endif
                            >
                            <label class="form-check-label" for="work_notification_email">
                                E-mail értesítés
                            </label>
                        </div>
                    @endif
                    @if($setting_notification_sms->value == true)
                        <div class="form-check float-right mt-2 mr-3">
                            <input 
                                class="form-check-input" 
                                type="checkbox" 
                                id="work_notification_sms" 
                                name="work_notification_sms" 
                                value="@if($work->can_send_notification) 1 @endif"  
                                @if($work->can_send_notification) checked @endif
                            >
                            <label class="form-check-label" for="work_notification_sms">
                                Sms értesítés
                            </label>
                        </div>
                    @endif
                </form>
            </div>
            @endif

            {{-- Naptár --}}
            <div id='calendar' class="col-12 @if($work) col-xl-6 @endif mb-3"></div>

            {{-- Dokumentumok --}}
            @if ($work)
            @php
                $document_types = []; // 'offer_mail', 'location', 'technical_description', 'email', 'warranty' //'control'
                $document_model = $issue_ticket ? 'IssueTicket' : 'Offer';
                $document_id    = $issue_ticket ? $issue_ticket->id : $work->offer->id;
                $offer = $work->offer;

                if(!$issue_ticket) 
                    $documents = $work->offer->getDocuments();
                else 
                    $documents = App\Models\Document::where('target_type', 'App\Models\\'.$document_model)->where('target_id', $issue_ticket->id)->get();
            @endphp

            {{-- Jogosultságok alapján a dokumentum típusok leküldése --}}
            @if(!$issue_ticket)
            @can('show-document-survey') @php array_push($document_types, 'survey') @endphp @endcan
            @can('show-document-plan') @php array_push($document_types, 'plan') @endphp @endcan
            @can('show-document-location') @php array_push($document_types, 'location') @endphp @endcan
            @can('show-document-technical_description') @php array_push($document_types, 'technical_description') @endphp @endcan
            @endif
            @can('show-document-issue_ticket') @php array_push($document_types, 'issue_ticket') @endphp @endcan

            <div class="col-12 col-xl-6 mb-3">
                <p class="h5">Dokumentumok</p>
                @include('process.tables.documents', [
                    'documents' => $documents, 
                    'types' => $document_types, 
                    'model' => $document_model, 
                    'id' => $document_id, 
                    'table_id' => 'dt_work_organize', 
                    'modal_type' => 'work_organize'
                ])
                
                {{--
                <p class="h5 mt-2">Munkalapok</p>
                @include('process.tables.worksheets', [
                    'work' => $work, 
                    'table_id'    => 'dt_worksheet',
                    'hide_button' => ['worksheet_create'],
                ])
                --}}

                @if($worksheet->count() != 0)
                <p class="h5 mt-4 mb-4">Munkalapok / jegyzőkönyvek</p>
                @include('process.tables.worksheets', [
                    'worksheet'   => $worksheet,
                    'table_id'    => 'dt_worksheet',
                    'hide_button' => ['worksheet_create'],
                ])
                @endif
            </div>

            {{-- Járművek szerkesztése --}}
            <div class="col-12 col-xl-6 mb-3">
                <p class="h5 mt-3">Járművek szerkesztése</p>
                <form method="POST" id="task_vehicle_form_{{ $work->id }}">
                    @csrf
                <div class="row">
                    <div class="col-12 col-md-6">
                        <div class="form-group">
                            <label for="vehicles">{!! __('Összes jármű') !!}</label>
                            <select id="vehicles" class="form-select" size="4" aria-label="select" onchange="select_move('#vehicles', '#work_vehicles')">
                                @foreach (App\Models\Vehicle::all()->keyBy('id') as $key => $value)
                                    @if (!isset($work->vehicles()->get()->keyBy('id')[$key]))
                                    <option value="{{$key}}">{{$value['plate_number']}}</option>
                                    @endif
                                @endforeach
                            </select>
                        </div>
                    </div>
                    <div class="col-12 col-md-6">
                        <div class="form-group">
                            <label for="work_vehicles">{!! __('Munkához rendelt járművek') !!}</label>
                            <select id="work_vehicles" name="work_vehicles[]" class="form-select" size="4" aria-label="select" onchange="select_move('#work_vehicles', '#vehicles');" data-save_work_vehicles="true" data-work_id="{{ $work->id }}">
                                @foreach ($work->vehicles()->get()->keyBy('id') as $work_vehicle)
                                    <option value="{{$work_vehicle['id']}}">{{$work_vehicle['plate_number']}}</option>
                                @endforeach
                            </select>
                        </div>
                    </div>
                </div>
                </form>

                {{-- Jármű kiválasztása szerkesztésre --}}
                <div id="work_vehicle_select">
                    @include('work.work_vehicle_select', ['work' => $work])
                </div>

                {{-- Dolgozók szerkesztése a járműben --}}
                <div id="vehicle_work_workers_form"></div>
            </div>
            @endif
        </div>
    </div>
</div>
@endsection


@push('scripts')
<script>
let work_status = $('#status').val();

function chk_vehicle() {
    if ($('input[name="start_date"]').val() && $("#work_vehicles option").length === 0) {
        alert('Jelenleg nincs jármű a feladat elvégzéséhez. A munkát csak akkor lehet leszervezni, ha biztosítasz hozzá legalább egy járművet.')
        
        return false;
    }

    if ($('input[name="start_date"]').val() == '' && $("#work_vehicles option").length != 0) {
        alert('Jelenleg nincs időpont a feladat elvégzéséhez. A munkát csak akkor lehet leszervezni, ha kezdési és befejezési időpontot választasz.')
        
        return false;
    }

    return organize_date('#task_form_{{ $work->id }}');
};

$(function() {
    $('.datetimepicker').datetimepicker({
        showSecond: true,
        format:'Y-m-d H:i',
        step:30,
        minDate: 0,
        minTime:'7:00',
        maxTime:'20:00',
        defaultTime:'08:00',
        dayOfWeekStart: 1,
        onChangeDateTime:function(dp,$input){
            if($input.data('type') == 'start_date')
            {
                var start_date = $input.val();

                if(start_date) {
                    window.selectOrganizedOption();
                    start_date = new Date(start_date);
                    var notification_date = start_date;

                    var month = ('0' + (start_date.getMonth()+1)).slice(-2);
                    var year = start_date.getFullYear();
                    var day = ('0'+start_date.getDate()).slice(-2);

                    if(start_date.getHours() < 17) {
                        var hour = 17;//start_date.getHours()+9;
                        var min = '00';
                    } else {
                        var hour = start_date.getHours()+1;
                        var min = ('0'+start_date.getMinutes()).slice(-2);
                    }

                    end_date = year+'-'+month+'-'+day+' '+hour+':'+min; // +':'+sec;
                    end_date_input = $('#task_'+$input.data('taskid')+'_end_date');
                    end_date_input.val(end_date);

                    notification_date.setHours(notification_date.getHours() + 1);
                    console.log(notification_date);

                    // Formázás
                    var notification_year = notification_date.getFullYear();
                    var notification_month = ('0' + (notification_date.getMonth() + 1)).slice(-2);
                    var notification_day = ('0' + notification_date.getDate()).slice(-2);
                    var notification_hour = ('0' + notification_date.getHours()).slice(-2);
                    var notification_min = ('0' + notification_date.getMinutes()).slice(-2);

                    // Kívánt formátum
                    var notification_date_str = `${notification_year}-${notification_month}-${notification_day} ${notification_hour}:${notification_min}`;

                    notification_date_input = $('#task_'+$input.data('taskid')+'_notification_date');
                    notification_date_input.val(notification_date_str);

                    window.organize_status_check('organized');
                }
            }
        }
    }).attr('readonly', 'readonly')

    window.get_date_time = function(dateObj) {
        var dateObj = new Date(dateObj);
        var date = $.datepicker.formatDate('yy-m-d', dateObj);
        var time = dateObj.getHours()+":"+dateObj.getMinutes();
        var get_h_null = (dateObj.getHours() < 10) ? 0 : '';
        var get_s_null = (dateObj.getMinutes() == 0) ? 0 : '';

        return date + ' ' + get_h_null + time + get_s_null;
    }

    window.selectOrganizedOption = function() {
        var selectElement = document.getElementById('status');
        var optionElements = selectElement.options;
    var currentSelectedValue = selectElement.value;
    
        if (currentSelectedValue !== 'completed') {
            for (var i = 0; i < optionElements.length; i++) {
                if (optionElements[i].value === 'organized') {
                    selectElement.selectedIndex = i;
                    break;
                }
            }
        }
    }
});

function check_date(block)
{
    if($(block).find('.input_start_date').val() != '' &&  $(block).find('.input_end_date').val())
       $(block).find('.submit_button').removeClass('d-none');
}
// FullCalendar
document.addEventListener('DOMContentLoaded', function() {
    function getInitialView() {
        if (window.innerWidth >= 768) {
            return 'timeGridWeek';
        } else if (window.innerWidth <= 768) {
            return 'listMonth';
        } else {
            return 'dayGridMonth';
        }
    }

    var calendarEl = document.getElementById('calendar');

    var calendar = new FullCalendar.Calendar(calendarEl, {
        // timeZone: 'UTC',
        headerToolbar: {
            left: 'prev,next today',
            center: 'title',
            right: 'dayGridMonth,timeGridWeek,timeGridDay,list'
        },
        views: {
            list: {
                visibleRange: function(currentDate) {
                    // Generate a new date for manipulating in the next step
                    var startDate = new Date(currentDate.valueOf());
                    var endDate = new Date(currentDate.valueOf());
                    // Adjust the start & end dates, respectively
                    startDate.setDate(startDate.getDate()); // Current day
                    endDate.setDate(endDate.getDate() + 31); // 31 days into the future

                    return { start: startDate, end: endDate };
                }
            }
        },
        initialView: 'timeGridWeek',
        windowResize: function (view) {
            var newView = getInitialView();
            calendar.changeView(newView);
        },
        themeSystem: 'bootstrap5',
        navLinks: true, // can click day/week names to navigate views
        editable: false,
        selectable: true,
        droppable: false,
        locale: 'hu',
        firstDay: 1,
        initialDate: '{{ date("Y-m-d") }}',
        events: {!! $events !!},
        eventClick: function(info) {
            info.jsEvent.preventDefault(); // don't let the browser navigate
            // console.log(info.event.id);
            var worksOrganizeRoute = '{{ route('works.organize', ':slug') }}';
            var tasksEditRoute = '{{ route('tasks.edit', ':slug') }}';
            var url = info.event.extendedProps.offer_id ? worksOrganizeRoute : tasksEditRoute;
            url = url.replace(':slug', info.event.id);
            window.location = url;
        },
    });

    calendar.render();
});

$(document).ready(function() {
    window.organize_status_check = function(new_status = null) {
      var status = new_status ? new_status : $('#status').val();

      if (status != 'organized') {
        $('#work_notification_email').prop('checked', false).prop('disabled', true);
        $('#work_notification_sms').prop('checked', false).prop('disabled', true);
      } else {
        $('#work_notification_email').prop('disabled', false);
        $('#work_notification_sms').prop('disabled', false);

        if(new_status) {
            $('#work_notification_email').prop('checked', true)
            $('#work_notification_sms').prop('checked', true)
        }
      }
    }

    $('#status').change(function() {
      organize_status_check();
    });

    organize_status_check();
  });
  </script>
@endpush