@extends('layouts.dashboard')
@section('content')
<!-- <script src="https://cdn.socket.io/4.8.1/socket.js" integrity="sha384-mkQ3/7FUtcGyoppY6bz/PORYoGqOl7/aSUMn2ymDOJcapfS6PHqxhRTMh1RR0Q6+" crossorigin="anonymous"></script> -->
<style>
    .filter{
        margin: 0px 15px 17px 0px;
        padding: 5px;
    }
    #search{
        width: 100px;
        margin-top: -5px;
        margin-right: 40px;
    }
</style>
<div class="content-wrapper" style="min-height: 241px;">
        <div class="content-header">
            <div class="container-fluid">
                <div class="row mb-2">
                    <div class="col-sm-6">
                        <h1 class="m-0">{{ $title }}</h1>
                    </div>
                </div>
            </div>
        </div>

        <section class="content">
            <div class="container-fluid">
                <div class="row"> 

                    <div class="col-12 col-sm-12 hide">
                        <div class="card card-tabs">
                            <div class="card-header p-3 text-center">

                                Mobile Number : <input type="text" name="mobile_number" class="filter" placeholder="Mobile Number"/> &nbsp; &nbsp;

                                Event ID : <input type="text" name="event_id" class="filter" placeholder="Event ID"/>&nbsp; &nbsp;

                                Status : <select name="event_status" class="filter">
                                    <option value="all" class="filter m-2">All</option>
                                    <option value="quoted" class="filter m-2">Quoted</option>
                                    <option value="non-quoted" class="filter m-2">Non-Quoted</option>
                                    <option value="cancelled" class="filter m-2">Cancelled</option>
                                    <option value="past" class="filter m-2">Past</option>
                                </select>

                                <br/>
                                Event Creation Date: <input type="text" name="event_creation_range" id="event_creation_range"  value="" class="filter daterange m-2" /> 
                                Event Date: <input type="text" name="event_date_range" id="event_date_range" value="" class="filter daterange m-2" />
                            
                                <button type="button" class="btn btn-primary" id="search">Search</button>
                            </div>
                        </div>
                    </div>

                    <div class="col-12 col-sm-12">
                        <div class="card p-2">
                            <div class="card-body table-responsive p-1">
                                <table id="rmlist" class="table table-hover text-nowrap">
                                    <thead>
                                    <tr>
                                        <th>Sr.No.</th>
                                        <th>STATUS</th>
                                        <th>PAYMENT STATUS</th>
                                        <th>REQUEST TYPE</th>
                                        <th>CREATED DATE</th>
                                        <th>CREATED TIME</th>
                                        <th>EVENT TYPE</th>
                                        <th>EVENT CATEGORY</th>
                                        <th>EVENT ID</th>
                                        <th>EVENT TIME</th>
                                        <th>ACTION</th>
                                    </tr>
                                    </thead>
                                    <tbody>
                                        
                                    </tbody>
                                </table>
                            </div>
                        </div>
                    </div>
                </div>
            </div>
        </section>
    </div>
</div>
@endsection