@extends('Admin.layouts.master')
@section('title', 'Personal Dashboard')
@section('style')
    <link rel="stylesheet"
        href="https://cdnjs.cloudflare.com/ajax/libs/jquery-datetimepicker/2.5.20/jquery.datetimepicker.css">
    <style>
        .dataTables_filter {
            display: none;
        }

        .dt-buttons {
            display: none;
        }
    </style>
@endsection
@section('content')
    <div class="app-main flex-column flex-row-fluid" id="kt_app_main">
        <div class="d-flex flex-column flex-column-fluid">
            <div id="kt_app_content_container" class="app-container container-xxl">
                <div class="row max-w-100 mt-10 index_table">
                    <div class="top_header d-flex justify-content-between">
                        <p class='fs-2'>My Tasks</p>
                        <div class="table_right_options d-flex">
                            <button type="button" class="btn btn-light-primary me-3" id="ExportReporttoExcelTasks">
                                <span class="svg-icon svg-icon-2">
                                    <svg width="24" height="24" viewBox="0 0 24 24" fill="none"
                                        xmlns="http://www.w3.org/2000/svg">
                                        <rect opacity="0.3" x="12.75" y="4.25" width="12" height="2" rx="1"
                                            transform="rotate(90 12.75 4.25)" fill="currentColor"></rect>
                                        <path
                                            d="M12.0573 6.11875L13.5203 7.87435C13.9121 8.34457 14.6232 8.37683 15.056 7.94401C15.4457 7.5543 15.4641 6.92836 15.0979 6.51643L12.4974 3.59084C12.0996 3.14332 11.4004 3.14332 11.0026 3.59084L8.40206 6.51643C8.0359 6.92836 8.0543 7.5543 8.44401 7.94401C8.87683 8.37683 9.58785 8.34458 9.9797 7.87435L11.4427 6.11875C11.6026 5.92684 11.8974 5.92684 12.0573 6.11875Z"
                                            fill="currentColor"></path>
                                        <path opacity="0.3"
                                            d="M18.75 8.25H17.75C17.1977 8.25 16.75 8.69772 16.75 9.25C16.75 9.80228 17.1977 10.25 17.75 10.25C18.3023 10.25 18.75 10.6977 18.75 11.25V18.25C18.75 18.8023 18.3023 19.25 17.75 19.25H5.75C5.19772 19.25 4.75 18.8023 4.75 18.25V11.25C4.75 10.6977 5.19771 10.25 5.75 10.25C6.30229 10.25 6.75 9.80228 6.75 9.25C6.75 8.69772 6.30229 8.25 5.75 8.25H4.75C3.64543 8.25 2.75 9.14543 2.75 10.25V19.25C2.75 20.3546 3.64543 21.25 4.75 21.25H18.75C19.8546 21.25 20.75 20.3546 20.75 19.25V10.25C20.75 9.14543 19.8546 8.25 18.75 8.25Z"
                                            fill="currentColor"></path>
                                    </svg>
                                </span>
                                Export</button>
                            <div class="d-flex align-items-center position-relative">
                                <span class="svg-icon svg-icon-1 position-absolute ms-6">
                                    <svg width="24" height="24" viewBox="0 0 24 24" fill="none"
                                        xmlns="http://www.w3.org/2000/svg">
                                        <rect opacity="0.5" x="17.0365" y="15.1223" width="8.15546" height="2"
                                            rx="1" transform="rotate(45 17.0365 15.1223)" fill="currentColor" />
                                        <path
                                            d="M11 19C6.55556 19 3 15.4444 3 11C3 6.55556 6.55556 3 11 3C15.4444 3 19 6.55556 19 11C19 15.4444 15.4444 19 11 19ZM11 5C7.53333 5 5 7.53333 5 11C5 14.4667 7.53333 17 11 17C14.4667 17 17 14.4667 17 11C17 7.53333 14.4667 5 11 5Z"
                                            fill="currentColor" />
                                    </svg>
                                </span>
                                <input type="text" data-kt-user-table-filter="search"
                                    class="form-control bg-white form-control-solid w-250px ps-14"
                                    placeholder="Search Tasks" id="searchboxtasks" />
                            </div>
                        </div>
                    </div>

                    <div class="dataTable_area my-5 mb-0">
                        <div class="card">
                            <div class="card-body py-4">
                                <table class="table align-middle table-row-dashed fs-6 gy-5" id="my-tasks-table">
                                    <thead>
                                        <tr class="text-start text-muted fw-bold fs-7 text-uppercase gs-0">
                                            <th class="max-w-125px align-top">Sr No</th>
                                            <th class="max-w-125px align-top">Subject</th>
                                            <th class="min-w-125px w-150px align-top">Due Date</th>
                                            <th class="min-w-50px w-75px align-top">Status</th>
                                            <th class="min-w-50px w-100px align-top">Priority</th>
                                            <th class="min-w-50px w-100px align-top">Reminder</th>
                                            <th class="min-w-100px align-top notexport">Actions</th>
                                        </tr>
                                    </thead>
                                    <tbody class="text-gray-600 fw-semibold">
                                        @foreach ($tasks as $task)
                                            <tr>
                                                <td>{{ $loop->iteration }}</td>
                                                <td>{{ $task->subject }}</td>
                                                <td>{{ $task->due_date->format('d/m/Y') }}</td>
                                                <td>{{ $task->status == 1 ? 'Closed' : 'Open' }}</td>
                                                <td>{{ $task->priority }}</td>
                                                <td>{{ $task->reminder }}</td>
                                                <td class=" notexport">
                                                    <a class="action_icon edit-task-button" data-id="{{ $task->id }}"
                                                        data-subject="{{ $task->subject }}"
                                                        data-due-date="{{ $task->due_date }}"
                                                        data-priority="{{ $task->priority }}"
                                                        data-owner="{{ $task->owner }}"
                                                        data-reminder="{{ $task->reminder }}"
                                                        data-status="{{ $task->status }}">
                                                        <i class="fa-solid fa-pen-to-square"></i>
                                                    </a>
                                                    <a class="action_icon delete deleteTasks mx-5"
                                                        data-task-id={{ $task->id }}>
                                                        <i class="fa-solid fa-trash"></i>
                                                    </a>
                                                </td>
                                            </tr>
                                        @endforeach
                                    </tbody>
                                </table>
                            </div>
                        </div>
                    </div>
                    <div class="row max-w-100 mt-10 index_table">
                        <div class="top_header d-flex justify-content-between">
                            <p class='fs-2'>My Meetings</p>
                            <div class="table_right_options d-flex">
                                <button type="button" class="btn btn-light-primary me-3" id="ExportReporttoExcelMeetings">
                                    <span class="svg-icon svg-icon-2">
                                        <svg width="24" height="24" viewBox="0 0 24 24" fill="none"
                                            xmlns="http://www.w3.org/2000/svg">
                                            <rect opacity="0.3" x="12.75" y="4.25" width="12" height="2"
                                                rx="1" transform="rotate(90 12.75 4.25)" fill="currentColor"></rect>
                                            <path
                                                d="M12.0573 6.11875L13.5203 7.87435C13.9121 8.34457 14.6232 8.37683 15.056 7.94401C15.4457 7.5543 15.4641 6.92836 15.0979 6.51643L12.4974 3.59084C12.0996 3.14332 11.4004 3.14332 11.0026 3.59084L8.40206 6.51643C8.0359 6.92836 8.0543 7.5543 8.44401 7.94401C8.87683 8.37683 9.58785 8.34458 9.9797 7.87435L11.4427 6.11875C11.6026 5.92684 11.8974 5.92684 12.0573 6.11875Z"
                                                fill="currentColor"></path>
                                            <path opacity="0.3"
                                                d="M18.75 8.25H17.75C17.1977 8.25 16.75 8.69772 16.75 9.25C16.75 9.80228 17.1977 10.25 17.75 10.25C18.3023 10.25 18.75 10.6977 18.75 11.25V18.25C18.75 18.8023 18.3023 19.25 17.75 19.25H5.75C5.19772 19.25 4.75 18.8023 4.75 18.25V11.25C4.75 10.6977 5.19771 10.25 5.75 10.25C6.30229 10.25 6.75 9.80228 6.75 9.25C6.75 8.69772 6.30229 8.25 5.75 8.25H4.75C3.64543 8.25 2.75 9.14543 2.75 10.25V19.25C2.75 20.3546 3.64543 21.25 4.75 21.25H18.75C19.8546 21.25 20.75 20.3546 20.75 19.25V10.25C20.75 9.14543 19.8546 8.25 18.75 8.25Z"
                                                fill="currentColor"></path>
                                        </svg>
                                    </span>
                                    Export</button>
                                <div class="d-flex align-items-center position-relative">
                                    <span class="svg-icon svg-icon-1 position-absolute ms-6">
                                        <svg width="24" height="24" viewBox="0 0 24 24" fill="none"
                                            xmlns="http://www.w3.org/2000/svg">
                                            <rect opacity="0.5" x="17.0365" y="15.1223" width="8.15546" height="2"
                                                rx="1" transform="rotate(45 17.0365 15.1223)"
                                                fill="currentColor" />
                                            <path
                                                d="M11 19C6.55556 19 3 15.4444 3 11C3 6.55556 6.55556 3 11 3C15.4444 3 19 6.55556 19 11C19 15.4444 15.4444 19 11 19ZM11 5C7.53333 5 5 7.53333 5 11C5 14.4667 7.53333 17 11 17C14.4667 17 17 14.4667 17 11C17 7.53333 14.4667 5 11 5Z"
                                                fill="currentColor" />
                                        </svg>
                                    </span>
                                    <input type="text" data-kt-user-table-filter="search"
                                        class="form-control bg-white form-control-solid w-250px ps-14"
                                        placeholder="Search Meetings" id="searchboxmeetings" />
                                </div>
                            </div>
                        </div>

                        <div class="dataTable_area my-5 mb-0">
                            <div class="card">
                                <div class="card-body py-4">
                                    <table class="table align-middle table-row-dashed fs-6 gy-5" id="my-meetings-table">
                                        <thead>
                                            <tr class="text-start text-muted fw-bold fs-7 text-uppercase gs-0">
                                                <th class="max-w-125px align-top">Sr No</th>
                                                <th class="max-w-125px align-top">Location</th>
                                                <th class="min-w-125px w-150px align-top">from</th>
                                                <th class="min-w-50px w-75px align-top">To</th>
                                                <th class="min-w-50px w-100px align-top ">Priority</th>
                                                <th class="min-w-50px w-100px align-top ">Related To</th>
                                                <th class="min-w-50px w-100px align-top ">Status</th>
                                                <th class="min-w-100px align-top notexport">Actions</th>
                                            </tr>
                                        </thead>
                                        <tbody class="text-gray-600 fw-semibold">
                                            @foreach ($meetings as $meeting)
                                                <tr>
                                                    <td>{{ $loop->iteration }}</td>
                                                    <td>{{ $meeting->location }}</td>
                                                    <td>{{ $meeting->from->format('d/m/Y H:i:s') }}</td>
                                                    <td>{{ $meeting->to->format('d/m/Y H:i:s') }}</td>
                                                    <td>{{ $meeting->priority }}</td>
                                                    <td>{{ $meeting->related_to }}</td>
                                                    <td>{{ $meeting->status == 1 ? 'Closed' : 'Open' }}</td>
                                                    <td class="notexport">

                                                        <a class="action_icon edit-meeting-button"
                                                            data-meeting-id="{{ $meeting->id }}"
                                                            data-location="{{ $meeting->location }}"
                                                            data-to="{{ $meeting->to }}"
                                                            data-from="{{ $meeting->from }}"
                                                            data-host="{{ $meeting->host }}"
                                                            data-priority="{{ $meeting->priority }}"
                                                            data-participants="{{ $meeting->participants }}"
                                                            data-status="{{ $meeting->status }}"
                                                            data-related-to="{{ $meeting->related_to }}">
                                                            <i class="fa-solid fa-pen-to-square"></i>
                                                        </a>

                                                        <a class="action_icon delete deleteMeetings  mx-5"
                                                            data-meeting-id="{{ $meeting->id }}">
                                                            <i class="fa-solid fa-trash"></i>
                                                        </a>
                                                    </td>
                                                </tr>
                                            @endforeach
                                        </tbody>
                                    </table>
                                </div>
                            </div>
                        </div>
                    </div>
                    <div class="row max-w-100 mt-10 index_table">
                        <div class="top_header d-flex justify-content-between">
                            <p class='fs-2'>My Leads</p>
                            <div class="table_right_options d-flex">
                                <button type="button" class="btn btn-light-primary me-3" id="ExportReporttoExcel">
                                    <span class="svg-icon svg-icon-2">
                                        <svg width="24" height="24" viewBox="0 0 24 24" fill="none"
                                            xmlns="http://www.w3.org/2000/svg">
                                            <rect opacity="0.3" x="12.75" y="4.25" width="12" height="2"
                                                rx="1" transform="rotate(90 12.75 4.25)" fill="currentColor">
                                            </rect>
                                            <path
                                                d="M12.0573 6.11875L13.5203 7.87435C13.9121 8.34457 14.6232 8.37683 15.056 7.94401C15.4457 7.5543 15.4641 6.92836 15.0979 6.51643L12.4974 3.59084C12.0996 3.14332 11.4004 3.14332 11.0026 3.59084L8.40206 6.51643C8.0359 6.92836 8.0543 7.5543 8.44401 7.94401C8.87683 8.37683 9.58785 8.34458 9.9797 7.87435L11.4427 6.11875C11.6026 5.92684 11.8974 5.92684 12.0573 6.11875Z"
                                                fill="currentColor"></path>
                                            <path opacity="0.3"
                                                d="M18.75 8.25H17.75C17.1977 8.25 16.75 8.69772 16.75 9.25C16.75 9.80228 17.1977 10.25 17.75 10.25C18.3023 10.25 18.75 10.6977 18.75 11.25V18.25C18.75 18.8023 18.3023 19.25 17.75 19.25H5.75C5.19772 19.25 4.75 18.8023 4.75 18.25V11.25C4.75 10.6977 5.19771 10.25 5.75 10.25C6.30229 10.25 6.75 9.80228 6.75 9.25C6.75 8.69772 6.30229 8.25 5.75 8.25H4.75C3.64543 8.25 2.75 9.14543 2.75 10.25V19.25C2.75 20.3546 3.64543 21.25 4.75 21.25H18.75C19.8546 21.25 20.75 20.3546 20.75 19.25V10.25C20.75 9.14543 19.8546 8.25 18.75 8.25Z"
                                                fill="currentColor"></path>
                                        </svg>
                                    </span>
                                    Export</button>
                                <div class="d-flex align-items-center position-relative">
                                    <span class="svg-icon svg-icon-1 position-absolute ms-6">
                                        <svg width="24" height="24" viewBox="0 0 24 24" fill="none"
                                            xmlns="http://www.w3.org/2000/svg">
                                            <rect opacity="0.5" x="17.0365" y="15.1223" width="8.15546" height="2"
                                                rx="1" transform="rotate(45 17.0365 15.1223)"
                                                fill="currentColor" />
                                            <path
                                                d="M11 19C6.55556 19 3 15.4444 3 11C3 6.55556 6.55556 3 11 3C15.4444 3 19 6.55556 19 11C19 15.4444 15.4444 19 11 19ZM11 5C7.53333 5 5 7.53333 5 11C5 14.4667 7.53333 17 11 17C14.4667 17 17 14.4667 17 11C17 7.53333 14.4667 5 11 5Z"
                                                fill="currentColor" />
                                        </svg>
                                    </span>
                                    <input type="text" data-kt-user-table-filter="search"
                                        class="form-control bg-white form-control-solid w-250px ps-14"
                                        placeholder="Search Leads" id="searchbox" />
                                </div>
                            </div>
                        </div>


                        <div class="dataTable_area my-5 mb-0">
                            <div class="card">
                                <div class="card-body py-4">
                                    <table class="table align-middle table-row-dashed fs-6 gy-5" id="my-leads-table">
                                        <thead>
                                            <tr class="text-start text-muted fw-bold fs-7 text-uppercase gs-0">
                                                <th class="max-w-125px align-top">Sr No</th>
                                                <th class="max-w-125px align-top">Lead Name</th>
                                                <th class="min-w-125px w-150px align-top">Company</th>
                                                <th class="min-w-50px w-75px align-top">Email</th>
                                                <th class="min-w-50px w-100px align-top">Phone</th>
                                                <th class="min-w-50px w-100px align-top ">Lead Source</th>
                                                <th class="min-w-100px align-top notexport">Actions</th>
                                            </tr>
                                        </thead>
                                        <tbody class="text-gray-600 fw-semibold">
                                            {{-- @dd($leads) --}}
                                            @foreach ($leads as $lead)
                                                <tr>
                                                    <td>{{ $loop->iteration }}</td>
                                                    <td>{{ $lead->user->name }}</td>
                                                    <td>{{ $lead->lead_company ?? 'N/A' }}</td>
                                                    <td>{{ $lead->email }}</td>
                                                    <td>{{ $lead->mobile }}</td>
                                                    <td>{{ $lead->lead_source == null ? 'No Lead Source Assigned' : $lead->lead_source }}
                                                    </td>
                                                    <td
                                                        class="text-end d-flex align-items-center justify-content-around notexport">
                                                        <a href="{{ route('edit-lead', $lead->id) }}"
                                                            class="action_icon return_to_personal_dashboard"
                                                            data-bs-toggle="tooltip"
                                                            data-bs-custom-class="tooltip-inverse" data-bs-placement="top"
                                                            data-kt-initialized="1">
                                                            <svg class="svg-inline--fa fa-pen-to-square"
                                                                aria-hidden="true" focusable="false" data-prefix="fas"
                                                                data-icon="pen-to-square" role="img"
                                                                xmlns="http://www.w3.org/2000/svg" viewBox="0 0 512 512"
                                                                data-fa-i2svg="">
                                                                <path fill="currentColor"
                                                                    d="M471.6 21.7c-21.9-21.9-57.3-21.9-79.2 0L362.3 51.7l97.9 97.9 30.1-30.1c21.9-21.9 21.9-57.3 0-79.2L471.6 21.7zm-299.2 220c-6.1 6.1-10.8 13.6-13.5 21.9l-29.6 88.8c-2.9 8.6-.6 18.1 5.8 24.6s15.9 8.7 24.6 5.8l88.8-29.6c8.2-2.8 15.7-7.4 21.9-13.5L437.7 172.3 339.7 74.3 172.4 241.7zM96 64C43 64 0 107 0 160V416c0 53 43 96 96 96H352c53 0 96-43 96-96V320c0-17.7-14.3-32-32-32s-32 14.3-32 32v96c0 17.7-14.3 32-32 32H96c-17.7 0-32-14.3-32-32V160c0-17.7 14.3-32 32-32h96c17.7 0 32-14.3 32-32s-14.3-32-32-32H96z">
                                                                </path>
                                                            </svg>
                                                        </a>
                                                        <a class="action_icon delete deleteLead mx-5"
                                                            data-lead-id="{{ $lead->id }}">
                                                            <i class="fa-solid fa-trash"></i>
                                                        </a>
                                                    </td>
                                                </tr>
                                            @endforeach
                                        </tbody>
                                    </table>
                                </div>
                            </div>
                        </div>
                    </div>

                    <div class="modal fade" id="manage_commission_edit" tabindex="-1" aria-hidden="true">
                        <div class="modal-dialog modal-dialog-centered">
                            <div class="modal-content">
                                <div class="modal-header">
                                    <h2>Edit Tasks</h2>
                                    <div class="btn btn-sm btn-icon btn-active-color-primary" data-bs-dismiss="modal">
                                        <span class="svg-icon svg-icon-1">
                                            <svg width="24" height="24" viewBox="0 0 24 24" fill="none"
                                                xmlns="http://www.w3.org/2000/svg">
                                                <rect opacity="0.5" x="6" y="17.3137" width="16" height="2"
                                                    rx="1" transform="rotate(-45 6 17.3137)"
                                                    fill="currentColor" />
                                                <rect x="7.41422" y="6" width="16" height="2" rx="1"
                                                    transform="rotate(45 7.41422 6)" fill="currentColor" />
                                            </svg>
                                        </span>
                                    </div>
                                </div>
                                <div class="modal-body px-lg-10">
                                    <div class="stepper stepper-pills stepper-column d-flex flex-column flex-xl-row flex-row-fluid"
                                        id="kt_modal_create_app_stepper">
                                        <form id="edit-task" class="form pb-0" action="#">
                                            @csrf
                                            @method('PATCH')
                                            <input type="hidden" name="task_id" id="task-id">
                                            <div class="row">
                                                <div class="col-md-6 fv-row mb-7">
                                                    <label class="required fs-6 fw-semibold mb-2">Subject</label>
                                                    <input type="text" name="subject" class="form-control"
                                                        id="task-subject">
                                                </div>
                                                <div class="col-md-6 fv-row">
                                                    <label class="required fs-6 fw-semibold mb-2">Due Date</label>
                                                    <input class="form-control" type="text" id="dateTime"
                                                        name="due_date" autocomplete="off">
                                                </div>

                                                <div class="col-md-6 fv-row mb-7">
                                                    <label class="required fs-6 fw-semibold mb-2">Priority</label>
                                                    <select name="priority" class="form-control" id="task-priority">
                                                        <option value="">Select a Priority</option>
                                                        <option value="Low">Low</option>
                                                        <option value="Lowest">Lowest</option>
                                                        <option value="Normal">Normal</option>
                                                        <option value="High">High</option>
                                                        <option value="Highest">Highest</option>
                                                    </select>
                                                </div>
                                                <div class="col-md-6 fv-row">
                                                    <label class="required fs-6 fw-semibold mb-2">Owner</label>
                                                    <select name="owner" class="form-control" id="task-owner">
                                                        <option value="">Select a User</option>
                                                        @foreach ($users as $user)
                                                            <option value="{{ $user->id }}">{{ $user->name }}
                                                            </option>
                                                        @endforeach
                                                    </select>
                                                </div>
                                                <div class="col-md-6 fv-row">
                                                    <label class="required fs-6 fw-semibold mb-2">Reminder</label>
                                                    <input class="form-control" type="text" name="reminder"
                                                        autocomplete="off" id="task-reminder">
                                                </div>

                                                <div class="col-md-6 fv-row mb-7">
                                                    <label class="required fs-6 fw-semibold mb-2">Closed</label>
                                                    <input type="checkbox" id="task-status" name="status">
                                                </div>
                                            </div>
                                            <div class="modal-footer justify-content-center">
                                                <button type="button" class="btn btn-primary btn-hover-rise me-5"
                                                    data-bs-dismiss="modal" aria-label="Close">Cancel</button>
                                                <button type="submit" class="btn btn-primary">
                                                    <span class="indicator-label">Submit</span>
                                                </button>
                                            </div>
                                        </form>
                                    </div>
                                </div>
                            </div>
                        </div>
                    </div>


                    <div class="modal fade" id="manage_commission_edit_2" tabindex="-1" aria-hidden="true">
                        <div class="modal-dialog modal-dialog-centered mw-900px">
                            <div class="modal-content">
                                <div class="modal-header">
                                    <h2>Edit Meeting</h2>
                                    <div class="btn btn-sm btn-icon btn-active-color-primary" data-bs-dismiss="modal">
                                        <span class="svg-icon svg-icon-1">
                                            <svg width="24" height="24" viewBox="0 0 24 24" fill="none"
                                                xmlns="http://www.w3.org/2000/svg">
                                                <rect opacity="0.5" x="6" y="17.3137" width="16" height="2"
                                                    rx="1" transform="rotate(-45 6 17.3137)"
                                                    fill="currentColor" />
                                                <rect x="7.41422" y="6" width="16" height="2" rx="1"
                                                    transform="rotate(45 7.41422 6)" fill="currentColor" />
                                            </svg>
                                        </span>
                                    </div>
                                </div>
                                <div class="modal-body px-lg-10">
                                    <div class="stepper stepper-pills stepper-column d-flex flex-column flex-xl-row flex-row-fluid"
                                        id="kt_modal_create_app_stepper">
                                        <form id="edit-meeting" class="form pb-0" action="#">
                                            @csrf
                                            @method('PATCH')
                                            <input type="hidden" name="meeting_id" id="meeting_id">
                                            <div class="row">
                                                <div class="col-md-6 fv-row mb-7">
                                                    <label class="required fs-6 fw-semibold mb-2">Location</label>
                                                    <input type="text" name="location" class="form-control"
                                                        id="meeting-location">
                                                </div>
                                                <div class="col-md-6 fv-row">
                                                    <label class="required fs-6 fw-semibold mb-2">From</label>
                                                    <input class="form-control" type="text" id="from"
                                                        name="from" autocomplete="off">
                                                </div>

                                                <div class="col-md-6 fv-row mb-7">
                                                    <label class="required fs-6 fw-semibold mb-2">To</label>
                                                    <input class="form-control" type="text" id="to"
                                                        name="to" autocomplete="off">
                                                </div>
                                                <div class="col-md-6 fv-row">
                                                    <label class="required fs-6 fw-semibold mb-2">Host</label>
                                                    <select name="host" id="meeting-host" class="form-control">
                                                        <option value="">Select a User</option>
                                                        @foreach ($users as $user)
                                                            <option value="{{ $user->id }}">{{ $user->name }}
                                                            </option>
                                                        @endforeach
                                                    </select>
                                                </div>
                                                <div class="col-md-6 fv-row mb-7">
                                                    <label class="required fs-6 fw-semibold mb-2">Priority</label>
                                                    <select name="priority" id="meeting-priority" class="form-control">
                                                        <option value="">Select a Priority</option>
                                                        <option value="Low">Low</option>
                                                        <option value="Lowest">Lowest</option>
                                                        <option value="Normal">Normal</option>
                                                        <option value="High">High</option>
                                                        <option value="Highest">Highest</option>
                                                    </select>
                                                </div>
                                                <div class="col-md-6 fv-row mb-7">
                                                    <label class="required fs-6 fw-semibold mb-2">Participants</label>
                                                    <input type="text" name="participants" id="meeting-participants"
                                                        class="form-control">
                                                </div>

                                                <!-- <span class="svg-icon svg-icon-2 position-absolute mx-4">
                                                    <svg width="24" height="24" viewBox="0 0 24 24" fill="none" xmlns="http://www.w3.org/2000/svg">
                                                        <path opacity="0.3" d="M21 22H3C2.4 22 2 21.6 2 21V5C2 4.4 2.4 4 3 4H21C21.6 4 22 4.4 22 5V21C22 21.6 21.6 22 21 22Z" fill="currentColor" />
                                                        <path d="M6 6C5.4 6 5 5.6 5 5V3C5 2.4 5.4 2 6 2C6.6 2 7 2.4 7 3V5C7 5.6 6.6 6 6 6ZM11 5V3C11 2.4 10.6 2 10 2C9.4 2 9 2.4 9 3V5C9 5.6 9.4 6 10 6C10.6 6 11 5.6 11 5ZM15 5V3C15 2.4 14.6 2 14 2C13.4 2 13 2.4 13 3V5C13 5.6 13.4 6 14 6C14.6 6 15 5.6 15 5ZM19 5V3C19 2.4 18.6 2 18 2C17.4 2 17 2.4 17 3V5C17 5.6 17.4 6 18 6C18.6 6 19 5.6 19 5Z" fill="currentColor" />
                                                        <path d="M8.8 13.1C9.2 13.1 9.5 13 9.7 12.8C9.9 12.6 10.1 12.3 10.1 11.9C10.1 11.6 10 11.3 9.8 11.1C9.6 10.9 9.3 10.8 9 10.8C8.8 10.8 8.59999 10.8 8.39999 10.9C8.19999 11 8.1 11.1 8 11.2C7.9 11.3 7.8 11.4 7.7 11.6C7.6 11.8 7.5 11.9 7.5 12.1C7.5 12.2 7.4 12.2 7.3 12.3C7.2 12.4 7.09999 12.4 6.89999 12.4C6.69999 12.4 6.6 12.3 6.5 12.2C6.4 12.1 6.3 11.9 6.3 11.7C6.3 11.5 6.4 11.3 6.5 11.1C6.6 10.9 6.8 10.7 7 10.5C7.2 10.3 7.49999 10.1 7.89999 10C8.29999 9.90003 8.60001 9.80003 9.10001 9.80003C9.50001 9.80003 9.80001 9.90003 10.1 10C10.4 10.1 10.7 10.3 10.9 10.4C11.1 10.5 11.3 10.8 11.4 11.1C11.5 11.4 11.6 11.6 11.6 11.9C11.6 12.3 11.5 12.6 11.3 12.9C11.1 13.2 10.9 13.5 10.6 13.7C10.9 13.9 11.2 14.1 11.4 14.3C11.6 14.5 11.8 14.7 11.9 15C12 15.3 12.1 15.5 12.1 15.8C12.1 16.2 12 16.5 11.9 16.8C11.8 17.1 11.5 17.4 11.3 17.7C11.1 18 10.7 18.2 10.3 18.3C9.9 18.4 9.5 18.5 9 18.5C8.5 18.5 8.1 18.4 7.7 18.2C7.3 18 7 17.8 6.8 17.6C6.6 17.4 6.4 17.1 6.3 16.8C6.2 16.5 6.10001 16.3 6.10001 16.1C6.10001 15.9 6.2 15.7 6.3 15.6C6.4 15.5 6.6 15.4 6.8 15.4C6.9 15.4 7.00001 15.4 7.10001 15.5C7.20001 15.6 7.3 15.6 7.3 15.7C7.5 16.2 7.7 16.6 8 16.9C8.3 17.2 8.6 17.3 9 17.3C9.2 17.3 9.5 17.2 9.7 17.1C9.9 17 10.1 16.8 10.3 16.6C10.5 16.4 10.5 16.1 10.5 15.8C10.5 15.3 10.4 15 10.1 14.7C9.80001 14.4 9.50001 14.3 9.10001 14.3C9.00001 14.3 8.9 14.3 8.7 14.3C8.5 14.3 8.39999 14.3 8.39999 14.3C8.19999 14.3 7.99999 14.2 7.89999 14.1C7.79999 14 7.7 13.8 7.7 13.7C7.7 13.5 7.79999 13.4 7.89999 13.2C7.99999 13 8.2 13 8.5 13H8.8V13.1ZM15.3 17.5V12.2C14.3 13 13.6 13.3 13.3 13.3C13.1 13.3 13 13.2 12.9 13.1C12.8 13 12.7 12.8 12.7 12.6C12.7 12.4 12.8 12.3 12.9 12.2C13 12.1 13.2 12 13.6 11.8C14.1 11.6 14.5 11.3 14.7 11.1C14.9 10.9 15.2 10.6 15.5 10.3C15.8 10 15.9 9.80003 15.9 9.70003C15.9 9.60003 16.1 9.60004 16.3 9.60004C16.5 9.60004 16.7 9.70003 16.8 9.80003C16.9 9.90003 17 10.2 17 10.5V17.2C17 18 16.7 18.4 16.2 18.4C16 18.4 15.8 18.3 15.6 18.2C15.4 18.1 15.3 17.8 15.3 17.5Z" fill="currentColor" />
                                                    </svg>
                                                </span> -->
                                            </div>
                                    </div>

                                    <div class="col-md-6 fv-row mb-7">
                                        <label class="required fs-6 fw-semibold mb-2">Related To</label>
                                        <input type="text" name="related_to" id="meeting-related-to"
                                            class="form-control">
                                    </div>
                                    <div class="col-md-6 fv-row mb-7">
                                        <label class="required fs-6 fw-semibold mb-2">Closed</label>
                                        <input type="checkbox" id="meeting-status" name="status">
                                    </div>
                                </div>
                                <div class="modal-footer justify-content-center">
                                    <button type="button" class="btn btn-primary btn-hover-rise me-5"
                                        data-bs-dismiss="modal" aria-label="Close">Cancel</button>
                                    <button type="submit" class="btn btn-primary">
                                        <span class="indicator-label">Submit</span>
                                    </button>
                                </div>
                                </form>
                            </div>
                        </div>
                    </div>
                </div>
            </div>

            <div class="modal fade" id="manage_commission_edit_3" tabindex="-1" aria-hidden="true">
                <div class="modal-dialog modal-dialog-centered mw-900px">
                    <div class="modal-content">
                        <div class="modal-header">
                            <h2>Edit Profile</h2>
                            <div class="btn btn-sm btn-icon btn-active-color-primary" data-bs-dismiss="modal">
                                <span class="svg-icon svg-icon-1">
                                    <svg width="24" height="24" viewBox="0 0 24 24" fill="none"
                                        xmlns="http://www.w3.org/2000/svg">
                                        <rect opacity="0.5" x="6" y="17.3137" width="16" height="2"
                                            rx="1" transform="rotate(-45 6 17.3137)" fill="currentColor" />
                                        <rect x="7.41422" y="6" width="16" height="2" rx="1"
                                            transform="rotate(45 7.41422 6)" fill="currentColor" />
                                    </svg>
                                </span>
                            </div>
                        </div>
                        <div class="modal-body px-lg-10">
                            <div class="stepper stepper-pills stepper-column d-flex flex-column flex-xl-row flex-row-fluid"
                                id="kt_modal_create_app_stepper">
                                <form id="kt_modal_new_target_form" class="form pb-0" action="#">
                                    <div class="row">
                                        <div class="col-md-6 fv-row mb-7">
                                            <label class="required fs-6 fw-semibold mb-2">Lead Name</label>
                                            <select class="form-select form-select-solid" data-control="select2"
                                                data-hide-search="true" data-dropdown-parent="#manage_commission_edit_3"
                                                data-placeholder="Select a Lead Name" name="target_assign">
                                                <option value="">Select user...</option>
                                                <option value="1">Karina Clark</option>
                                                <option value="2">Robert Doe</option>
                                                <option value="3">Niel Owen</option>
                                                <option value="4">Olivia Wild</option>
                                                <option value="5">Sean Bean</option>
                                            </select>
                                        </div>
                                        <div class="col-md-6 fv-row">
                                            <label class="required fs-6 fw-semibold mb-2">Company</label>
                                            <select class="form-select form-select-solid" data-control="select2"
                                                data-hide-search="true" data-dropdown-parent="#manage_commission_edit_3"
                                                data-placeholder="Select a Company" name="target_assign">
                                                <option value="">Select user...</option>
                                                <option value="1">Karina Clark</option>
                                                <option value="2">Robert Doe</option>
                                                <option value="3">Niel Owen</option>
                                                <option value="4">Olivia Wild</option>
                                                <option value="5">Sean Bean</option>
                                            </select>
                                        </div>

                                        <div class="col-md-6 fv-row mb-7">
                                            <label class="required fs-6 fw-semibold mb-2">Email</label>
                                            <select class="form-select form-select-solid" data-control="select2"
                                                data-hide-search="true" data-dropdown-parent="#manage_commission_edit_3"
                                                data-placeholder="Select a Email" name="target_assign">
                                                <option value="">Select user...</option>
                                                <option value="1">Karina Clark</option>
                                                <option value="2">Robert Doe</option>
                                                <option value="3">Niel Owen</option>
                                                <option value="4">Olivia Wild</option>
                                                <option value="5">Sean Bean</option>
                                            </select>
                                        </div>
                                        <div class="col-md-6 fv-row">
                                            <label class="required fs-6 fw-semibold mb-2">Phone</label>
                                            <input type="text" class="form-control form-control-solid"
                                                placeholder="Enter Phone" name="target_title" />
                                        </div>
                                        <div class="col-md-6 fv-row mb-7">
                                            <label class="required fs-6 fw-semibold mb-2">Lead Source</label>
                                            <input type="text" class="form-control form-control-solid"
                                                placeholder="Enter Lead Source" name="target_title" />
                                        </div>
                                        <div class="col-md-6 fv-row">
                                            <label class="required fs-6 fw-semibold mb-2">Lead Owner</label>
                                            <div class="position-relative d-flex align-items-center">
                                                <span class="svg-icon svg-icon-2 position-absolute mx-4">
                                                    <svg width="24" height="24" viewBox="0 0 24 24"
                                                        fill="none" xmlns="http://www.w3.org/2000/svg">
                                                        <path opacity="0.3"
                                                            d="M21 22H3C2.4 22 2 21.6 2 21V5C2 4.4 2.4 4 3 4H21C21.6 4 22 4.4 22 5V21C22 21.6 21.6 22 21 22Z"
                                                            fill="currentColor" />
                                                        <path
                                                            d="M6 6C5.4 6 5 5.6 5 5V3C5 2.4 5.4 2 6 2C6.6 2 7 2.4 7 3V5C7 5.6 6.6 6 6 6ZM11 5V3C11 2.4 10.6 2 10 2C9.4 2 9 2.4 9 3V5C9 5.6 9.4 6 10 6C10.6 6 11 5.6 11 5ZM15 5V3C15 2.4 14.6 2 14 2C13.4 2 13 2.4 13 3V5C13 5.6 13.4 6 14 6C14.6 6 15 5.6 15 5ZM19 5V3C19 2.4 18.6 2 18 2C17.4 2 17 2.4 17 3V5C17 5.6 17.4 6 18 6C18.6 6 19 5.6 19 5Z"
                                                            fill="currentColor" />
                                                        <path
                                                            d="M8.8 13.1C9.2 13.1 9.5 13 9.7 12.8C9.9 12.6 10.1 12.3 10.1 11.9C10.1 11.6 10 11.3 9.8 11.1C9.6 10.9 9.3 10.8 9 10.8C8.8 10.8 8.59999 10.8 8.39999 10.9C8.19999 11 8.1 11.1 8 11.2C7.9 11.3 7.8 11.4 7.7 11.6C7.6 11.8 7.5 11.9 7.5 12.1C7.5 12.2 7.4 12.2 7.3 12.3C7.2 12.4 7.09999 12.4 6.89999 12.4C6.69999 12.4 6.6 12.3 6.5 12.2C6.4 12.1 6.3 11.9 6.3 11.7C6.3 11.5 6.4 11.3 6.5 11.1C6.6 10.9 6.8 10.7 7 10.5C7.2 10.3 7.49999 10.1 7.89999 10C8.29999 9.90003 8.60001 9.80003 9.10001 9.80003C9.50001 9.80003 9.80001 9.90003 10.1 10C10.4 10.1 10.7 10.3 10.9 10.4C11.1 10.5 11.3 10.8 11.4 11.1C11.5 11.4 11.6 11.6 11.6 11.9C11.6 12.3 11.5 12.6 11.3 12.9C11.1 13.2 10.9 13.5 10.6 13.7C10.9 13.9 11.2 14.1 11.4 14.3C11.6 14.5 11.8 14.7 11.9 15C12 15.3 12.1 15.5 12.1 15.8C12.1 16.2 12 16.5 11.9 16.8C11.8 17.1 11.5 17.4 11.3 17.7C11.1 18 10.7 18.2 10.3 18.3C9.9 18.4 9.5 18.5 9 18.5C8.5 18.5 8.1 18.4 7.7 18.2C7.3 18 7 17.8 6.8 17.6C6.6 17.4 6.4 17.1 6.3 16.8C6.2 16.5 6.10001 16.3 6.10001 16.1C6.10001 15.9 6.2 15.7 6.3 15.6C6.4 15.5 6.6 15.4 6.8 15.4C6.9 15.4 7.00001 15.4 7.10001 15.5C7.20001 15.6 7.3 15.6 7.3 15.7C7.5 16.2 7.7 16.6 8 16.9C8.3 17.2 8.6 17.3 9 17.3C9.2 17.3 9.5 17.2 9.7 17.1C9.9 17 10.1 16.8 10.3 16.6C10.5 16.4 10.5 16.1 10.5 15.8C10.5 15.3 10.4 15 10.1 14.7C9.80001 14.4 9.50001 14.3 9.10001 14.3C9.00001 14.3 8.9 14.3 8.7 14.3C8.5 14.3 8.39999 14.3 8.39999 14.3C8.19999 14.3 7.99999 14.2 7.89999 14.1C7.79999 14 7.7 13.8 7.7 13.7C7.7 13.5 7.79999 13.4 7.89999 13.2C7.99999 13 8.2 13 8.5 13H8.8V13.1ZM15.3 17.5V12.2C14.3 13 13.6 13.3 13.3 13.3C13.1 13.3 13 13.2 12.9 13.1C12.8 13 12.7 12.8 12.7 12.6C12.7 12.4 12.8 12.3 12.9 12.2C13 12.1 13.2 12 13.6 11.8C14.1 11.6 14.5 11.3 14.7 11.1C14.9 10.9 15.2 10.6 15.5 10.3C15.8 10 15.9 9.80003 15.9 9.70003C15.9 9.60003 16.1 9.60004 16.3 9.60004C16.5 9.60004 16.7 9.70003 16.8 9.80003C16.9 9.90003 17 10.2 17 10.5V17.2C17 18 16.7 18.4 16.2 18.4C16 18.4 15.8 18.3 15.6 18.2C15.4 18.1 15.3 17.8 15.3 17.5Z"
                                                            fill="currentColor" />
                                                    </svg>
                                                </span>
                                                <input class="form-control form-control-solid ps-12"
                                                    placeholder="Select a Lead Owner" id='date_picker' name="due_date" />
                                            </div>
                                        </div>
                                        <div class="col-md-12 d-flex">
                                            <div class="form-check form-check-custom form-check-solid">
                                                <input class="form-check-input" type="radio" checked value="1"
                                                    name="option2" />
                                                <div class="form-check-label">
                                                    One Time
                                                </div>
                                            </div>

                                            <div class="form-check form-check-custom form-check-solid ms-10">
                                                <input class="form-check-input" type="radio" value="1"
                                                    name="option2" id="text_wow" />
                                                <div class="form-check-label">
                                                    Trail
                                                </div>
                                            </div>
                                        </div>
                                        <div class="col-md-12 mt-8">
                                            <label class="required fs-6 fw-semibold mb-2">Description</label>
                                            <textarea class="form-control form-control form-control-solid min-h-100px" data-kt-autosize="true"></textarea>
                                        </div>
                                    </div>
                                    <div class="submit_btn d-flex justify-content-center mt-15">
                                        <a href="https://wordpress.betadelivery.com/freeU-dashboard/pages/manage-commission/manage_commission.php"
                                            class="btn btn-light-dark">Calculate & Save</a>
                                    </div>
                                </form>
                            </div>
                        </div>
                    </div>
                </div>
            </div>
        </div>
    </div>
    <input type="hidden" name="route" id="route" value="{{ \Request::route()->getName() }}">
@endsection
@section('scripts')
    <script src="https://cdnjs.cloudflare.com/ajax/libs/jquery-datetimepicker/2.5.20/jquery.datetimepicker.full.min.js">
    </script>
    <script>
        $('.return_to_personal_dashboard').click(function() {
            sessionStorage.setItem('backRoute', $('#route').val());
        })
        $('#dateTime').datetimepicker({
            debug: true,
            format: 'Y-m-d H:i:s',
            locale: 'ru'
        });

        $('#from').datetimepicker({
            debug: true,
            format: 'Y-m-d H:i:s',
            locale: 'ru'
        });

        $('#to').datetimepicker({
            debug: true,
            format: 'Y-m-d H:i:s',
            locale: 'ru'
        });



        $(function() {
            var tabletasks = $('#my-tasks-table').DataTable({
                dom: "Blfrtip",
                buttons: [{
                    extend: "excel",
                    title: "Tasks List",
                    text: "Export Search Results",
                    className: "btn btn-default",
                    exportOptions: {
                        columns: ":not(.notexport)",
                    },
                }, ],
            });

            var table = $('#my-leads-table').DataTable({
                dom: "Blfrtip",
                buttons: [{
                    extend: "excel",
                    title: "Leads List",
                    text: "Export Search Results",
                    className: "btn btn-default",
                    exportOptions: {
                        columns: ":not(.notexport)",
                    },
                }, ],
            });
            var tablemeetings = $('#my-meetings-table').DataTable({
                dom: "Blfrtip",
                buttons: [{
                    extend: "excel",
                    title: "Meetings List",
                    text: "Export Search Results",
                    className: "btn btn-default",
                    exportOptions: {
                        columns: ":not(.notexport)",
                    },
                }, ],
            });

            $("#ExportReporttoExcel").on("click", function() {
                table.button(".buttons-excel").trigger();
            });
            $("#searchbox").keyup(function() {
                table.search($(this).val()).draw();
            });

            $("#ExportReporttoExcelMeetings").on("click", function() {
                tablemeetings.button(".buttons-excel").trigger();
            });
            $("#searchboxmeetings").keyup(function() {
                tablemeetings.search($(this).val()).draw();
            });

            $("#ExportReporttoExcelTasks").on("click", function() {
                tabletasks.button(".buttons-excel").trigger();
            });
            $("#searchboxtasks").keyup(function() {
                tabletasks.search($(this).val()).draw();
            });
        });

        $('.deleteTasks').click(function() {
            Swal.fire({
                title: `Do you want to delete this task?`,
                showDenyButton: false,
                showCancelButton: true,
                confirmButtonText: 'Yes',
            }).then((result) => {
                if (result.isConfirmed) {
                    $.ajax({
                        url: "{{ route('delete-task') }}",
                        type: "delete",
                        headers: {
                            "X-CSRF-TOKEN": $('meta[name="csrf-token"]').attr("content"),
                        },
                        data: {
                            id: $(this).data('task-id'),
                        },
                        dataType: "json",
                        success: function(result) {
                            if (result.status == 200) {
                                toastr.success(result.message);
                                setTimeout(() => {
                                    location.reload();
                                }, 1000);
                            }
                            if (result.status == 400) {
                                toastr.warning(result.message);
                            }
                        },
                    });
                }
            })
        });

        $('.deleteMeetings').click(function() {
            Swal.fire({
                title: `Do you want to delete this meeting?`,
                showDenyButton: false,
                showCancelButton: true,
                confirmButtonText: 'Yes',
            }).then((result) => {
                if (result.isConfirmed) {
                    $.ajax({
                        url: "{{ route('delete-meeting') }}",
                        type: "delete",
                        headers: {
                            "X-CSRF-TOKEN": $('meta[name="csrf-token"]').attr("content"),
                        },
                        data: {
                            id: $(this).data('meeting-id'),
                        },
                        dataType: "json",
                        success: function(result) {
                            if (result.status == 200) {
                                toastr.success(result.message);
                                setTimeout(() => {
                                    location.reload();
                                }, 1000);
                            }
                            if (result.status == 400) {
                                toastr.warning(result.message);
                            }
                        },
                    });
                }
            })
        });

        $('.deleteLead').click(function() {
            Swal.fire({
                title: `Do you want to delete this lead?`,
                showDenyButton: false,
                showCancelButton: true,
                confirmButtonText: 'Yes',
            }).then((result) => {
                if (result.isConfirmed) {
                    $.ajax({
                        url: "{{ route('delete-lead') }}",
                        type: "delete",
                        headers: {
                            "X-CSRF-TOKEN": $('meta[name="csrf-token"]').attr("content"),
                        },
                        data: {
                            id: $(this).data('lead-id'),
                        },
                        dataType: "json",
                        success: function(result) {
                            if (result.status == 200) {
                                toastr.success(result.message);
                                setTimeout(() => {
                                    location.reload();
                                }, 1000);
                            }
                            if (result.status == 400) {
                                toastr.warning(result.message);
                            }
                        },
                    });
                }
            })
        });

        $('.edit-task-button').click(function(e) {
            $('#task-id').val($(this).data("id"));
            $('#task-subject').val($(this).data("subject"));
            $('#dateTime').val($(this).data("due-date"));
            $('#task-priority').val($(this).data("priority"));
            $('#task-owner').val($(this).data("owner"));
            $('#task-reminder').val($(this).data("reminder"));
            $(this).data('status') ? $('#task-status').attr('checked', true) : $('#task-status').attr('checked',
                false);
            $('#manage_commission_edit').modal('show');
        })

        $('.edit-meeting-button').click(function(e) {
            $('#meeting_id').val($(this).data("meeting-id"));
            $('#meeting-location').val($(this).data("location"));
            $('#from').val($(this).data("from"));
            $('#to').val($(this).data("to"));
            $('#meeting-priority').val($(this).data("priority"));
            $('#meeting-host').val($(this).data("host"));
            $('#meeting-participants').val($(this).data("participants"));
            $('#meeting-related-to').val($(this).data("related-to"));
            $(this).data('status') ? $('#meeting-status').attr('checked', true) : $('#meeting-status').attr(
                'checked', false);
            $('#manage_commission_edit_2').modal('show');
        })

        // for Subject
        $.validator.addMethod("charactersOnly", function(value, element) {
            return /^[a-zA-Z]+$/.test(value);
        }, "Please enter only alphabetical characters");

        // for reminder
        $.validator.addMethod("numbersOnly", function(value, element) {
            return /^[0-9]+$/.test(value);
        }, "Please enter only numbers");

        // for due_date
        $.validator.addMethod("validDateFormat", function(value, element) {
            // Regular expression to match the date format "YYYY-MM-DD HH:MM:SS"
            return /^\d{4}-\d{2}-\d{2} \d{2}:\d{2}:\d{2}$/.test(value);
        }, "Please enter a valid date format (YYYY-MM-DD HH:MM:SS)");


        $("#edit-task").validate({
            ignore: [],
            debug: false,
            rules: {
                subject: {
                    required: true,
                    // charactersOnly: true // Using the custom validation rule for individual characters
                },
                due_date: {
                    required: true,
                    validDateFormat: true // Using the custom validation rule for date format
                },
                priority: 'required',
                owner: 'required',
                reminder: {
                    required: true,
                    // numbersOnly: true // Using the custom validation rule for numbers only
                }
            },
            messages: {
                // subject: "Please enter subject with only alphabetical characters",
                due_date: "Please enter a valid date format (YYYY-MM-DD HH:MM:SS)",
                priority: 'Please select a priority',
                owner: 'Please select a owner',
                // reminder: "Please enter only numbers for the reminder"
            },
            submitHandler: function(form) {
                var formData = new FormData(form);
                $.ajax({
                    url: "{{ route('edit-task') }}",
                    type: "POST",
                    data: formData,
                    beforeSend: function() {
                        // $('#loaderBtn').removeClass('d-none');
                        // $('#save-btn').addClass('d-none');
                    },
                    processData: false,
                    contentType: false,
                    dataType: "json",
                    success: function(result) {
                        // $('#save-btn').removeClass('d-none');
                        // $('#loaderBtn').addClass('d-none');
                        if (result.status == 200) {
                            toastr.success(result.message);
                            setTimeout(() => {
                                location.reload();
                            }, 1000);
                        }
                        if (result.status == 400) {
                            toastr.warning(result.message);
                        }
                    },
                });
            },
        });

        $("#edit-meeting").validate({
            ignore: [],
            debug: false,
            rules: {
                location: {
                    required: true,
                    // charactersOnly: true // Using the custom validation rule for individual characters
                },
                from: 'required',
                to: 'required',
                host: 'required',
                priority: 'required',
                participants: {
                    required: true,
                    // charactersOnly: true // Using the custom validation rule for individual characters
                },
                related_to: {
                    required: true,
                    charactersOnly: true // Using the custom validation rule for individual characters
                }
            },
            messages: {
                // location: "Please enter location with only alphabetical characters",
                from: "Please choose from date",
                to: 'Please select a to date',
                host: 'Please select a host',
                priority: "Please enter priority",
                // participants: "Please enter participants with only alphabetical characters",
                related_to: "Please enter related to with only alphabetical characters"
            },
            submitHandler: function(form) {
                var formData = new FormData(form);
                $.ajax({
                    url: "{{ route('edit-meeting') }}",
                    type: "POST",
                    data: formData,
                    beforeSend: function() {
                        // $('#loaderBtn').removeClass('d-none');
                        // $('#save-btn').addClass('d-none');
                    },
                    processData: false,
                    contentType: false,
                    dataType: "json",
                    success: function(result) {
                        // $('#save-btn').removeClass('d-none');
                        // $('#loaderBtn').addClass('d-none');
                        if (result.status == 200) {
                            toastr.success(result.message);
                            setTimeout(() => {
                                location.reload();
                            }, 1000);
                        }
                        if (result.status == 400) {
                            toastr.warning(result.message);
                        }
                    },
                });
            },
        });
    </script>
@endsection