@extends('Web/layout')
@section('title','Vist Report')
@section('content')
    <div class="pt-3">
        <div class="page-title d-flex">
            <div class="align-self-center">
                <a href="#" data-back-button class="me-3 ms-0 icon icon-xxs bg-theme rounded-s shadow-m">
                <i class="bi bi-chevron-left color-theme font-14"></i>
                </a>
            </div>
            <div class="align-self-center me-auto">
                <h1 class="color-theme mb-0 font-18">Visit Report</h1>
            </div>
            <div class="align-self-center ms-auto">
            
            </div>
        </div>
    </div>
    <div class="content">
        <form class="demo-animation needs-validation m-0" novalidate="">
            <div class="form-custom form-label form-icon mb-3">
            <i class="bi bi-search font-14"></i>
            <input type="text" class="form-control rounded-xs" id="c1" placeholder="Search By Scheme Name" onkeyup="searchVisitDataByNameorScheme(this)" >
            <label for="c1" class="color-theme">Search By Client Name, Scheme Name</label>
            </div>
            <!-- <button class="btn btn-full bg-blue-dark rounded-xs text-uppercase font-700 w-100 btn-s mt-4" type="submit">Next</button>onkeyup="searchSchemeByName(this)" -->
        </form>  
    </div>
  
    <div class="content" style="margin: 0px 15px 0px 15px;">
        <div class="row">
            <div class="col-3">
                <span class="badge border border-blue-dark color-blue-dark rounded-s btn-full font-14 All vs" onclick="statusVisitFilter('All')" style="width: 5rem ;padding-top: 10px;padding-bottom: 10px;">All</span>
            </div>
            <div class="col-3">
                <span class="badge border border-green-dark color-green-dark rounded-s btn-full font-14 Approved vs" onclick="statusVisitFilter('Approved')" style="width: 5rem ;padding-top: 10px;padding-bottom: 10px;">Approved</span>
            </div>
            <div class="col-3">
                <span class="badge border border-yellow-dark color-yellow-dark rounded-s btn-full font-14 Pending vs" onclick="statusVisitFilter('Pending')" style="width: 5rem ;padding-top: 10px;padding-bottom: 10px;">Pending</span>
            </div>
            <div class="col-3">
                <span class="badge border border-red-dark color-red-dark rounded-s btn-full font-14 Rejected vs" onclick="statusVisitFilter('Rejected')" style="width: 5rem ;padding-top: 10px;padding-bottom: 10px;">Rejected</span>
            </div>
        </div>
    </div>
    <!-- <div class="content mt-2" style="margin: 0px 15px 0px 15px;">
        <span class="badge border border-black-dark color-black-dark color-black rounded-s btn-full font-14" style="float: right;width: 5rem ;padding-top: 10px;padding-bottom: 10px;"><i class="bi bi-filter"></i>Filter</span> 
    </div> -->
    <div class="content my-0 mt-3 mb-3 px-1">
        <div class="d-flex" >
            <div class="align-self-center" style="width:100%;">
                <h3 class="font-18 mb-2 " style="float:right;" data-bs-toggle="offcanvas" data-bs-target="#menu-transfer"><i class="bi bi-filter"></i>Filter</h3>
            </div>
          
        </div>
    </div>

    
    
    <div id="visitAllData">

    </div>
    <!-- <div class="card card-style">
        <div class="content" >
        </div>
    </div> -->
    <div id="menu-activity-4" class="offcanvas offcanvas-top offcanvas-detached rounded-m">
        <div class="menu-size" style="height:650px;">
            <div class="content">
                <div class="d-flex py-1">
                    <div class="align-self-center">
                        <h2 class="font-700 mb-0"  id="v_p_name"></h2><span id="v_status"></span>
                        <!-- <h4 class="pt-1 font-14 mb-n1 " id="v_status"></h4> -->
                    </div>
                    <div class="align-self-center ms-auto">
                        <a href="#" class="icon icon-xs me-n2" data-bs-dismiss="offcanvas">
                            <i class="bi bi-x-circle-fill color-red-dark font-16"></i>
                        </a>
                    </div>
                    
                </div>
                <div class="row">
                    <div class="col-12 mt-2 mb-2" id="v_image">

                    </div>
                </div>
                <div class="row">
                    <strong class="col-5 color-theme">Father Name</strong>
                    <strong class="col-7 text-end" id="v_father_name"></strong>
                    <div class="col-12 mt-2 mb-2">
                        <div class="divider my-0"></div>
                    </div>
                    <strong class="col-5 color-theme">Email Address</strong>
                    <strong class="col-7 text-end" id="v_email"></strong>
                    <div class="col-12 mt-2 mb-2">
                        <div class="divider my-0"></div>
                    </div>
                    <strong class="col-5 color-theme">Mobile Number</strong>
                    <strong class="col-7 text-end" id="v_phone"></strong>
                    <div class="col-12 mt-2 mb-2">
                        <div class="divider my-0"></div>
                    </div>
                    <strong class="col-5 color-theme">Scheme Name</strong>
                    <strong class="col-7 text-end color-highlight" id="v_scheme_name"></strong>
                    <div class="col-12 mt-2 mb-2">
                        <div class="divider my-0"></div>
                    </div>
                    <strong class="col-5 color-theme">Visit Date</strong>
                    <strong class="col-7 text-end color-highlight" id="v_date"></strong>
                    <div class="col-12 mt-2 mb-2">
                        <div class="divider my-0"></div>
                    </div>
                    
                    <!-- <div class="col-6">
                        <a href="#" data-bs-dismiss="offcanvas" class="btn btn-s btn-full gradient-green shadow-bg shadow-bg-xs">Approve</a>
                    </div>
                    <div class="col-6">
                        <a href="#" data-bs-dismiss="offcanvas" class="btn btn-s btn-full gradient-red shadow-bg shadow-bg-xs">Reject</a>
                    </div> -->
                </div>
            </div>
        </div>
    </div>
    <div id="menu-transfer"  class="offcanvas offcanvas-top offcanvas-detached rounded-m" style="display: block; visibility: visible;" aria-modal="true" role="dialog">
        <div class="menu-size" style="height:340px;">
            <div class="d-flex mx-3 mt-3 py-1">
                <div class="align-self-center">
                    <h1 class="mb-0">Filter</h1>
                </div>
                <div class="align-self-center ms-auto">
                    <a href="#" class="ps-4" shadow-0="" me-n2"="" data-bs-dismiss="offcanvas">
                    <i class="bi bi-x color-red-dark font-26 line-height-xl"></i>
                    </a>
                </div>
            </div>
            <div class="divider divider-margins mt-3"></div>
            <div class="content mt-0">
                <div class="form-custom form-label form-icon">
                    <i class="bi bi-code-square font-14"></i>
                    <input type="date" class="form-control rounded-xs" id="filter_start_date" placeholder="Start Date">
                    <label for="c3" class="form-label-always-active color-highlight font-11">Start Date</label>
                </div>
                <div class="pb-3"></div>
                <div class="form-custom form-label form-icon">
                    <i class="bi bi-code-square font-14"></i>
                    <input type="date" class="form-control rounded-xs" id="filter_end_date" placeholder="End Date">
                    <label for="c4" class="form-label-always-active color-highlight font-11">End Date</label>
                </div>
                <div class="pb-3"></div>
                <div class="row">
                    <div class="col-6">
                        <button data-bs-dismiss="offcanvas" class="btn btn-full gradient-highlight rounded-s shadow-bg shadow-bg-s" style="width:100%;" onclick="visitFilterDateWiseClear()" >Clear</buttom>
                    </div>
                    <div class="col-6">
                        <button class="btn btn-full gradient-green rounded-s shadow-bg shadow-bg-s" data-bs-dismiss="offcanvas" style="width:100%;" onclick="visitFilterDateWise()" >Apply</buttom>
                    </div>
                </div>
            </div>
          
        </div>
    </div>
@endsection