@extends('layout.main')
@section('content')

    <section id="dashboard">

        @include('shared.errors')



        <!-- Content -->
        <div class="container-fluid">
            <div class="row">

                <div class="col-12 col-md-2 mb-3  px-md-3">
                    <img
                        src="{{ asset('../../tenants/'.tenant('id').'/uploads/profile_photos/')}}/{{auth()->user()->profile_photo}}"
                        class='rounded-pill border border-primary border-opacity-10 p-2 bg-light ' width="200" height="200">

                    {{--                    "{{asset('../../'.tenantPath().'/images/logo/'.$general_settings->site_logo)}}"--}}
                </div>

                <div class="col-10 mb-3 pt-md-4">
                    <h4 class="font-weight-bold">{{$employee->full_name}} <span class="text-muted font-weight-normal"> ({{$user->username}})</span>
                    </h4>
                    <div class="text-muted mb-2">{{$employee->designation->designation_name ?? ''}}
                        , {{$employee->department->department_name ?? ''}}</div>
                    <p class="text-muted">{{__('Last Login')}}: {{$user->last_login_date}}</p>
                    <p class="text-muted">{{__('My Office Shift')}}:
                        @if(!$shift_in)
                            {{__('No Shift Today')}}
                        @else
                            {{$shift_in}} To {{$shift_out}}
                        @endif
                        ({{$shift_name}})</p>
                    <a class="btn btn-primary btn-lg" id="my_profile" href="{{route('profile')}}">
                        <i class="dripicons-user"></i> {{trans('file.Profile')}}
                    </a>
                    @if (isset($isEnableClockInClockOut) && $isEnableClockInClockOut)
                        <form class="d-inline m1-2" action="{{route('employee_attendance.post',$employee->id)}}"
                              name="set_clocking"
                              id="set_clocking" autocomplete="off" class="form" method="post" accept-charset="utf-8">
                            @csrf

                            <input type="hidden" value="{{$shift_in}}" name="office_shift_in" id="shift_in">
                            <input type="hidden" value="{{$shift_out}}" name="office_shift_out" id="shift_out">
                            <input type="hidden" value="" name="in_out_value" id="in_out">

                            @if(!$employee_attendance || $employee_attendance->clock_in_out== 0)
                                <button class="btn btn-success btn-lg cursor-pointer"
                                        @if($employee->attendance_type=='ip_based' && $ipCheck!=true) disabled
                                        @endif type="submit" id="clock_in_btn"><i
                                        class="dripicons-enter"></i> {{__('Clock IN')}}</button>
                            @else
                                <button class="btn btn-danger btn-lg cursor-pointer"
                                        @if($employee->attendance_type=='ip_based' && $ipCheck!=true) disabled
                                        @endif type="submit" id="clock_out_btn"><i
                                        class="dripicons-exit"></i> {{__('Clock OUT')}}</button>
                            @endif
                            <br>
                            @if($employee->attendance_type=='ip_based' && $ipCheck!=true)
                                <small class="text-danger"><i>{{__("Please login with your office's internet to clock in or clock out")}}</i></small>
                            @endif
                        </form>
                    @endif
                </div>
            </div>
        </div>

        <div class="container-fluid">
            <div class="row admin-dashboard-boxes">

                <div class="admin-page-box-item box-hover">
                    <div class="wrapper">
                        <a href="{{route('profile').'#Employee_Payslip'}}">
                            <i class="fa-light fa-money-bill"></i>
                            <div class="box-text">
                                <span>{{__('file.Payslip')}}</span>
                                <span>
                            </span>
                            </div>
                        </a>
                        <a href="{{route('profile').'#Employee_Payslip'}}" class="read-more-link">
                            {{__('file.ReadMore')}}
                            <i class="fa-solid fa-chevrons-right"></i>
                        </a>
                    </div>
                </div>


                <div class="admin-page-box-item box-hover">
                    <div class="wrapper">
                        <a href="{{route('profile').'#Employee_Core_hr'}}">
                            <i class="fa-regular fa-award"></i>
                            <div class="box-text">
                                <span>{{$employee_award_count}} {{__('file.Award')}}</span>
                                <span>
                            </span>
                            </div>
                        </a>
                        <a href="{{route('profile').'#Employee_Core_hr'}}" class="read-more-link">
                            {{__('file.ReadMore')}}
                            <i class="fa-solid fa-chevrons-right"></i>
                        </a>
                    </div>
                </div>


                <div class="admin-page-box-item box-hover">
                    <div class="wrapper">
                        <a href="{{route('announcements.index')}}">
                            <i class="fa-regular fa-megaphone"></i>
                            <div class="box-text">
                                <span>{{ count($announcements) }} {{trans('file.Announcement')}}</span>
                                <span>
                            </span>
                            </div>
                        </a>
                        <a href="{{route('announcements.index')}}" class="read-more-link">
                            {{__('file.ReadMore')}}
                            <i class="fa-solid fa-chevrons-right"></i>
                        </a>
                    </div>
                </div>


                <div class="admin-page-box-item box-hover" id="holiday">
                    <div class="wrapper">
                        <a href="#" id="holiday">
                            <i class="fa-regular fa-party-horn"></i>
                            <div class="box-text">
                                <span>{{ count($holidays) }} {{__('Upcoming Holidays')}}</span>
                                <span>
                            </span>
                            </div>
                        </a>
                        <a href="#" class="read-more-link" id="holiday">
                            {{__('file.ReadMore')}}
                            <i class="fa-solid fa-chevrons-right"></i>
                        </a>
                    </div>
                </div>

                <div class="row p-0 m-0">
                    <div class="col-md-4 mt-4 p-1">
                        <div class="card p-4 b12 box-hover">
                            <div class="card-body d-flex justify-content-center align-items-center gap-3 text-primary">
                                <i class="fa-light fa-house-person-leave fs-1"></i>
                                <h3 class="text-center">{{__('file.Leave')}}</h3>
                            </div>
                            <div class="d-flex justify-content-between">
                                <a class="btn btn-outline-dark btn-block" href="{{route('profile').'#Leave'}}">
                                    {{trans('file.ReadMore')}}
                                </a>
                                <button class="btn btn-primary mt-0"
                                        id="leave_request">{{__('Request Leave')}}</button>
                            </div>
                        </div>
                    </div>


                    <div class="col-md-4 mt-4 p-1">
                        <div class="card p-4 b12 box-hover">
                            <div
                                class="card-body d-flex justify-content-center align-items-center gap-3 text-secondary">
                                <i class="fa-light fa-plane fs-1"></i>
                                <h3 class="text-center">{{__('file.Travel')}}</h3>
                            </div>
                            <div class="d-flex justify-content-between">
                                <a class="btn btn-outline-dark btn-block"
                                   href="{{route('profile').'#Employee_travel'}}">
                                    {{trans('file.ReadMore')}}
                                </a>
                                <button class="btn btn-secondary btn-block mt-0"
                                        id="travel_request">{{__('Request Travel')}}</button>
                            </div>
                        </div>
                    </div>


                    <div class="col-md-4 mt-4 p-1">
                        <div class="card p-4 b12 box-hover">
                            <div class="card-body d-flex justify-content-center align-items-center gap-3 text-warning">
                                <i class="fa-regular fa-tickets-airline fs-1"></i>
                                <h3 class="text-center">{{__('file.Ticket')}}</h3>
                            </div>
                            <div class="d-flex justify-content-between">
                                <a class="btn btn-outline-dark btn-block"
                                   href="{{route('profile').'#Employee_ticket'}}">
                                    {{trans('file.ReadMore')}}
                                </a>
                                <button class="btn btn-primary btn-block mt-0"
                                        id="ticket_request">{{__('Open A Ticket')}}</button>
                            </div>
                        </div>
                    </div>

                </div>
            </div>


            <div class="">
                <div class="row p-0 m-0">

                    <div class="col-md-4 mt-4 b12 p-1">
                        <div class="card b12 overflow-hidden box-hover p-2">
                            <div class="card-header border-bottom">
                                <h4>{{__('Assigned Projects')}} ({{$assigned_projects_count}})</h4>
                            </div>
                            <div class="card-body list pt-3">
                                <table class="table">
                                    <tbody>
                                    @foreach($assigned_projects as $project)
                                        @if (count($project->assignedProjects)!=0)
                                            <tr>
                                                <td>
                                                    <a class="text-primary"
                                                       href="{{route('projects.show',$project->assignedProjects[0]->id)}}">
                                                        <h5>{{$project->assignedProjects[0]->title}}</h5></a>
                                                </td>
                                            </tr>
                                        @endif
                                    @endforeach
                                    </tbody>
                                </table>
                            </div>
                        </div>
                    </div>

                    <div class="col-md-4 mt-4 p-1">
                        <div class="card  b12 overflow-hidden box-hover p-2">
                            <div class="card-header border-bottom">
                                <h4>{{__('Assigned Tasks')}} ({{$assigned_tasks_count}})</h4>
                            </div>
                            <div class="card-body list pt-3">
                                <table class="table">
                                    <tbody>
                                    @foreach($assigned_tasks as $task)
                                        @if (count($task->assignedTasks)!=0)
                                            <tr>
                                                <td>
                                                    <a class="orange-text"
                                                       href="{{route('tasks.show',$task->assignedTasks[0]->id)}}">
                                                        <h5>{{$task->assignedTasks[0]->task_name}}</h5></a>
                                                </td>
                                            </tr>
                                        @endif
                                    @endforeach
                                    </tbody>
                                </table>
                            </div>
                        </div>
                    </div>

                    <div class="col-md-4 mt-4 p-1">
                        <div class="card  b12 overflow-hidden box-hover p-2">
                            <div class="card-header border-bottom">
                                <h4>{{__('Assigned Tickets')}} ({{$assigned_tickets_count}})</h4>
                            </div>
                            <div class="card-body list pt-3">
                                <table class="table">
                                    <tbody>
                                    @foreach($assigned_tickets as $ticket)
                                        @if (count($ticket->assignedTickets)!=0)
                                            <tr>
                                                <td>
                                                    <a class="orange-text"
                                                       href="{{route('tickets.show',$ticket->assignedTickets[0]->ticket_code)}}">
                                                        <h5>{{$ticket->assignedTickets[0]->subject}}</h5></a>
                                                </td>
                                            </tr>
                                        @endif
                                    @endforeach
                                    </tbody>
                                </table>
                            </div>
                        </div>
                    </div>
                </div>
            </div>

            <div id="holidayModal" class="modal fade" role="dialog">
                <div class="modal-dialog modal-dialog-centered">
                    <div class="modal-content">

                        <div class="modal-header">
                            <h5 id="exampleModalLabel" class="modal-title">{{__('Holidays')}}</h5>
                            <button type="button" data-bs-dismiss="modal" id="close" aria-label="Close"
                                    class="btn-close"></button>
                        </div>

                        <div class="modal-body">
                            @foreach($holidays as $holiday)
                                <div class="d-flex justify-content-between align-items-center">
                                    <strong class="name blue-text">{{$holiday->event_name}}</strong>
                                    {{trans('file.From')}}: {{$holiday->start_date}} <br/>{{trans('file.To')}}: {{$holiday->end_date}}
                                </div>
                            @endforeach
                        </div>
                    </div>
                </div>
            </div>

            <div id="leaveModal" class="modal fade" role="dialog">
                <div class="modal-dialog modal-dialog-centered">
                    <div class="modal-content">

                        <div class="modal-header">
                            <h5 id="exampleModalLabel" class="modal-title">{{__('Request Leave')}}</h5>
                            <button type="button" data-bs-dismiss="modal" id="close" aria-label="Close"
                                    class="btn-close"></button>
                        </div>

                        <div class="modal-body">
                            <span id="leave_form_result"></span>
                            <form method="post" id="leaveSampleForm" class="form-horizontal">

                                @csrf
                                <div class="row">

                                    <div class="col-md-6 form-group">
                                        <label>{{__('Leave Type')}} *</label>
                                        <select name="leave_type" id="leave_type" class="form-control selectpicker "
                                                data-live-search="true" data-live-search-style="contains"
                                                title='{{__('Leave Type')}}'>
                                            @foreach($leave_types as $leave_type)
                                                <option value="{{$leave_type->id}}"
                                                        data-day="{{ $leave_type->allocated_day }}">{{$leave_type->leave_type}}
                                                    ({{$leave_type->allocated_day}} Days)
                                                </option>
                                            @endforeach
                                        </select>
                                    </div>


                                    <div class="col-md-4 form-group">
                                        <label>{{__('Start Date')}} *</label>
                                        <input type="text" name="start_date" id="start_date" class="form-control date"
                                               value="">
                                    </div>

                                    <div class="col-md-4 form-group">
                                        <label>{{__('End Date')}} *</label>
                                        <input type="text" name="end_date" id="end_date" class="form-control test date"
                                               value="">
                                    </div>

                                    <div class="col-md-4 form-group">
                                        <label>{{__('Total Days')}}</label>
                                        <input type="text" readonly id="total_days" class="form-control">
                                    </div>

                                    <div class="col-md-6 form-group">
                                        <label for="leave_reason">{{trans('file.Description')}}</label>
                                        <textarea class="form-control" id="leave_reason" name="leave_reason"
                                                  rows="3"></textarea>
                                    </div>

                                    <div class="container">
                                        <div class="form-group" align="center">
                                            <input type="hidden" name="company_id" value="{{$employee->company_id}}"/>
                                            <input type="hidden" name="department_id"
                                                   value="{{$employee->department_id}}"/>
                                            <input type="hidden" name="employee_id" value="{{$employee->id}}"/>
                                            <input type="hidden" name="status" value="pending"/>

                                            <input type="hidden" name="diff_date_hidden" id="diff_date_hidden"/>
                                            <input type="submit" name="action_button" class="btn btn-primary"
                                                   value={{trans('file.Add')}} />
                                        </div>
                                    </div>

                                </div>
                            </form>

                        </div>
                    </div>
                </div>
            </div>

            <div id="travelModal" class="modal fade" role="dialog">
                <div class="modal-dialog modal-dialog-centered">
                    <div class="modal-content">

                        <div class="modal-header">
                            <h5 id="exampleModalLabel" class="modal-title">{{__('Request Travel')}}</h5>
                            <button type="button" data-bs-dismiss="modal" aria-label="Close" class="btn-close"></button>
                        </div>

                        <div class="modal-body">
                            <span id="travel_form_result"></span>
                            <form method="post" id="travel_sample_form" class="form-horizontal">

                                @csrf
                                <div class="row">


                                    <div class="col-md-6 form-group">
                                        <label>{{__('file.Type')}}</label>
                                        <select name="travel_type_id" class="form-control selectpicker "
                                                data-live-search="true" data-live-search-style="contains"
                                                title='{{__('Selecting',['key'=>trans('file.Arrangement')])}}...'>
                                            @foreach($travel_types as $travel_type)
                                                <option
                                                    value="{{$travel_type->id}}">{{$travel_type->arrangement_type}}</option>
                                            @endforeach
                                        </select>
                                    </div>


                                    <div class="col-md-6 form-group">
                                        <label>{{__('Purpose Of Visit')}} *</label>
                                        <input type="text" name="purpose_of_visit" class="form-control"
                                               placeholder="{{__('Purpose Of Visit')}}">
                                    </div>

                                    <div class="col-md-6 form-group">
                                        <label>{{__('Place Of Visit')}} *</label>
                                        <input type="text" name="place_of_visit" class="form-control"
                                               placeholder="{{__('Place Of Visit')}}">
                                    </div>


                                    <div class="col-md-6">
                                        <div class="form-group">
                                            <label>{{trans('file.Description')}}</label>
                                            <textarea class="form-control" name="description" rows="3"></textarea>
                                        </div>
                                    </div>

                                    <div class="col-md-6 form-group">
                                        <label>{{__('Start Date')}} *</label>
                                        <input type="text" name="start_date" class="form-control date"
                                               autocomplete="off"
                                               value="">
                                    </div>

                                    <div class="col-md-6 form-group">
                                        <label>{{__('End Date')}} *</label>
                                        <input type="text" name="end_date" class="form-control date" autocomplete="off"
                                               value="">
                                    </div>

                                    <div class="col-md-6 form-group">
                                        <label>{{__('Expected Budget')}}</label>
                                        <input type="text" name="expected_budget" class="form-control">
                                    </div>


                                    <div class="col-md-6 form-group">
                                        <label>{{__('Travel Mode')}}</label>
                                        <select name="travel_mode" class="form-control selectpicker "
                                                data-live-search="true" data-live-search-style="contains"
                                                title='{{__('Travel Mode')}}'>
                                            <option value="By Bus">{{__('By Bus')}}</option>
                                            >
                                            <option value="By Train">{{__('By Train')}}</option>
                                            <option value="By Plane">{{__('By Plane')}}</option>
                                            <option value="By Taxi">{{__('By Taxi')}}</option>
                                            <option value="By Rental Car">{{__('By Rental Car')}}</option>
                                            <option value="By Other">{{__('By Other')}}</option>
                                        </select>
                                    </div>


                                    <div class="container">
                                        <div class="form-group" align="center">

                                            <input type="hidden" name="company_id" value="{{$employee->company_id}}"/>
                                            <input type="hidden" name="department_id"
                                                   value="{{$employee->department_id}}"/>
                                            <input type="hidden" name="employee_id" value="{{$employee->id}}"/>
                                            <input type="hidden" name="status" value="pending"/>

                                            <input type="submit" name="action_button" class="btn btn-primary"
                                                   value={{trans('file.Add')}} />
                                        </div>
                                    </div>
                                </div>

                            </form>

                        </div>
                    </div>
                </div>
            </div>

            <div id="ticketModal" class="modal fade" role="dialog">
                <div class="modal-dialog modal-dialog-centered">
                    <div class="modal-content">

                        <div class="modal-header">
                            <h5 id="exampleModalLabel" class="modal-title">{{__('Open A Ticket')}}</h5>
                            <button type="button" data-bs-dismiss="modal" id="close" aria-label="Close"
                                    class="btn-close"></button>
                        </div>

                        <div class="modal-body">
                            <span id="ticket_form_result"></span>
                            <form method="post" id="ticket_sample_form" class="form-horizontal"
                                  enctype="multipart/form-data">

                                @csrf

                                <div class="row">


                                    <div class="col-md-6 form-group">
                                        <label>{{trans('file.Priority')}}</label>
                                        <select name="ticket_priority" id="ticket_priority"
                                                class="form-control selectpicker "
                                                data-live-search="true" data-live-search-style="contains"
                                                title='{{__('Selecting',['key'=>trans('file.Priority')])}}...'>
                                            <option value="low">{{trans('file.Low')}}</option>
                                            <option value="medium">{{trans('file.Medium')}}</option>
                                            <option value="high">{{trans('file.High')}}</option>
                                            <option value="critical">Critical</option>
                                        </select>
                                    </div>

                                    <div class="col-md-6 form-group">
                                        <label>{{trans('file.Subject')}} *</label>
                                        <input type="text" name="subject" id="subject" class="form-control"
                                               placeholder="{{trans('file.Subject')}}">
                                    </div>

                                    <div class="col-md-6 form-group">
                                        <label>{{__('Ticket Note')}}</label>
                                        <input type="text" name="ticket_note" id="ticket_note" class="form-control"
                                               placeholder="{{trans('file.Optional')}}">
                                    </div>

                                    <div class="col-md-6 form-group hide_edit">
                                        <label>{{__('Ticket Attachments')}} </label>
                                        <input type="file" name="ticket_attachments" id="ticket_attachments"
                                               class="form-control">
                                    </div>

                                    <div class="col-md-6">
                                        <div class="form-group">
                                            <label>{{trans('file.Description')}}</label>
                                            <textarea class="form-control" id="description" name="description"
                                                      rows="3"></textarea>
                                        </div>
                                    </div>


                                    <div class="container">
                                        <div class="form-group" align="center">
                                            <input type="hidden" name="company_id" value="{{$employee->company_id}}"/>
                                            <input type="hidden" name="department_id"
                                                   value="{{$employee->department_id}}"/>
                                            <input type="hidden" name="employee_id" value="{{$employee->id}}"/>
                                            {{-- <input type="hidden" name="ticket_status" value="pending"/> --}}
                                            <input type="hidden" name="ticket_status" value="open"/>

                                            <input type="submit" name="action_button" class="btn btn-primary"
                                                   value={{trans('file.Add')}} />

                                        </div>
                                    </div>
                                </div>
                            </form>

                        </div>
                    </div>
                </div>
            </div>


            <script>
                (function ($) {
                    "use strict";


                    let startDateInput = $('#start_date');
                    let endDateInput = $('#end_date');
                    let totalDaysInput = $('#total_days');

                    $(document).ready(function () {

                        let date = $('.date');
                        let dateFormatJs = @json(session('dateFormatJs'));
                        date.datepicker({
                            format: dateFormatJs,
                            autoclose: true,
                            todayHighlight: true,
                            language: "{{ app()->getLocale() }}"
                        });

                        // const startDateInput = $('#start_date');
                        // const endDateInput = $('#end_date');
                        // const totalDaysInput = $('#total_days');

                        startDateInput.on('change', function () {
                            getDateResult();
                        });

                        endDateInput.on('change', function () {
                            getDateResult();
                        });

                        const getDateResult = () => {

                            // Convert Date formate to YYYY-MM-DD
                            if (!startDateInput.val() || !endDateInput.val()) {
                                return;
                            }

                            let startDateFormat = convertDataFormat(startDateInput.val());
                            let endDateFormat = convertDataFormat(endDateInput.val());

                            let startDate = new Date(startDateFormat);
                            let endDate = new Date(endDateFormat);
                            let timeDiff = endDate.getTime() - startDate.getTime();
                            // Convert the difference from milliseconds to days and update the totalDays input field
                            let totalDays = Math.ceil(timeDiff / (1000 * 3600 * 24)) + 1;
                            if (totalDays < 0) {
                                totalDaysInput.val(0);
                            } else {
                                totalDaysInput.val(totalDays);
                            }
                        }

                        const convertDataFormat = getDateValue => {
                            const inputDate = getDateValue;
                            const parts = inputDate.split("-");
                            const date = new Date(parts[2], parts[1] - 1, parts[0]);
                            const outputDate = date.toISOString().substring(0, 10);
                            return outputDate;
                        }
                    });

                    // let date = $('.date');
                    // let dateFormatJs = @json(session('dateFormatJs'));
                    // date.datepicker({
                    //     format: dateFormatJs,
                    //     autoclose: true,
                    //     todayHighlight: true,
                    // language: "{{ app()->getLocale() }}"
                    // });

                    $('#holiday').on('click', function () {
                        $('#holidayModal').modal('show');
                    });

                    $('#leave_request').on('click', function () {
                        $('#leaveModal').modal('show');
                    });

                    $('#travel_request').on('click', function () {
                        $('#travelModal').modal('show');
                    });

                    $('#ticket_request').on('click', function () {
                        $('#ticketModal').modal('show');
                    });


                    $('#leaveSampleForm').on('submit', function (event) {
                        event.preventDefault();

                        let start_date = $("#start_date").datepicker('getDate');
                        let end_date = $("#end_date").datepicker('getDate');
                        let dayDiff = Math.ceil((end_date - start_date) / (1000 * 60 * 60 * 24)) + 1;
                        $('#diff_date_hidden').val(dayDiff);

                        let allocatedDay = $("#leave_type option:selected").data('day');

                        let html = '';
                        if (allocatedDay < totalDaysInput.val()) {
                            html += '<div class="alert alert-danger">' + '<p>Insufficient Allocated Day</p>' + '</div>';
                            return $('#leave_form_result').html(html).slideDown(300).delay(5000).slideUp(300);
                        }

                        $.ajax({
                            url: "{{ route('leaves.store') }}",
                            method: "POST",
                            data: new FormData(this),
                            contentType: false,
                            cache: false,
                            processData: false,
                            dataType: "json",
                            success: function (data) {
                                console.log(data);

                                if (data.errors) {
                                    html += '<div class="alert alert-danger">';
                                    for (let count = 0; count < data.errors.length; count++) {
                                        html += '<p>' + data.errors[count] + '</p>';
                                    }
                                    html += '</div>';
                                } else if (data.limit) {
                                    html += '<div class="alert alert-danger">' + data.limit + '</div>';
                                } else if (data.remaining_leave) {
                                    html += '<div class="alert alert-danger">' + data.remaining_leave + '</div>';
                                } else if (data.error) {
                                    html += '<div class="alert alert-danger">' + data.error + '</div>';
                                } else if (data.success) {
                                    html += '<div class="alert alert-success">' + data.success + '</div>';
                                    $('#leaveSampleForm')[0].reset();
                                    $('select').selectpicker('refresh');
                                    $('.date').datepicker('update');
                                }
                                $('#leave_form_result').html(html).slideDown(300).delay(5000).slideUp(300);
                            }
                        });


                    });

                    $('#travel_sample_form').on('submit', function (event) {
                        event.preventDefault();

                        $.ajax({
                            url: "{{ route('travels.store') }}",
                            method: "POST",
                            data: new FormData(this),
                            contentType: false,
                            cache: false,
                            processData: false,
                            dataType: "json",
                            success: function (data) {
                                let html = '';
                                if (data.errors) {
                                    html = '<div class="alert alert-danger">';
                                    for (var count = 0; count < data.errors.length; count++) {
                                        html += '<p>' + data.errors[count] + '</p>';
                                    }
                                    html += '</div>';
                                }
                                if (data.error) {
                                    html = '<div class="alert alert-danger">' + data.error + '</div>';
                                }
                                if (data.success) {
                                    html = '<div class="alert alert-success">' + data.success + '</div>';
                                    $('#travel_sample_form')[0].reset();
                                    $('select').selectpicker('refresh');
                                    $('.date').datepicker('update');
                                }
                                $('#travel_form_result').html(html).slideDown(300).delay(5000).slideUp(300);
                            }
                        })
                    });


                    $('#ticket_sample_form').on('submit', function (event) {
                        event.preventDefault();

                        $.ajax({
                            url: "{{ route('tickets.store') }}",
                            method: "POST",
                            data: new FormData(this),
                            contentType: false,
                            cache: false,
                            processData: false,
                            dataType: "json",
                            success: function (data) {
                                let html = '';
                                if (data.errors) {
                                    html = '<div class="alert alert-danger">';
                                    for (var count = 0; count < data.errors.length; count++) {
                                        html += '<p>' + data.errors[count] + '</p>';
                                    }
                                    html += '</div>';
                                }
                                if (data.success) {
                                    html = '<div class="alert alert-success">' + data.success + '</div>';
                                    $('#ticket_sample_form')[0].reset();
                                    $('select').selectpicker('refresh');
                                }
                                $('#ticket_form_result').html(html).slideDown(300).delay(5000).slideUp(300);
                            }
                        })
                    });

                })(jQuery);
            </script>
    </section>
@endsection