@extends('admin.layout.master')

@section('content')
<style>
    .dt-buttons{
        float: right;
    }
    div.dataTables_wrapper div.dataTables_processing{
        z-index:99999;
    }
</style>
    <!-- Content Header (Page header) -->
<div class="content-header">
    <div class="container-fluid">
        <div class="row mb-2">
            <div class="col-sm-6">
                <h1 class="m-0"> Sales channel</h1>
            </div><!-- /.col -->
            <div class="col-sm-6">
                <ol class="breadcrumb float-sm-right">
                    <li class="breadcrumb-item"><a href="#">Home</a></li>
                    <li class="breadcrumb-item active"> Sales channel</li>
                </ol>
            </div><!-- /.col -->
        </div><!-- /.row -->
    </div><!-- /.container-fluid -->
</div>
<!-- /.content-header -->



<section class="content">
    <div class="container-fluid">
        <div class="card">
            <div class="card-body">
                <form action="{{ route('admin.sales-channel') }}" id="frm_search" method="get">
                    <div class="row mb-2">

                        <div class="col-2">
                            <div class="form-group">
                                <label for="form-label">Start Date</label>
                                <input type="date" name="start_date" id="start_date" value="{{ !empty($start_date) ? $start_date : "" }}" class="form-control" placeholder="Review Start Date">
                            </div>
                        </div>
                        <div class="col-2">
                            <div class="form-group">
                                <label for="form-label">End Date</label>
                                <input type="date" name="end_date" id="end_date" value="{{ !empty($end_date) ? $end_date : "" }}" class="form-control" placeholder="Review End Date">
                            </div>
                        </div>
                         <div class="col-2 form-group fliterfromgroup">
                            <label for="form-label">Channel</label>
                            <select name="orderchannel" id="orderchannel" class="form-control">
                                <option value="">Select Channel</option>
                                <option value="ADVERTISING" @if($orderchannel == 'ADVERTISING') selected @endif >ADVERTISING</option>
                                <option value="ORGANIC" @if($orderchannel == 'ORGANIC') selected @endif >ORGANIC</option>
                                <option value="MARKETING" @if($orderchannel == 'MARKETING') selected @endif >MARKETING</option>
			         <option value="MARKETPLACE" @if($orderchannel == 'MARKETPLACE') selected @endif >MARKETPLACE</option>
                                <option value="AGENT" @if($orderchannel == 'AGENT') selected @endif >AGENT</option>
                                <option value="DIRECT" @if($orderchannel == 'DIRECT') selected @endif>DIRECT</option>
                                <option value="UNKNOWN" @if($orderchannel == 'UNKNOWN') selected @endif>UNKNOWN</option>

                            </select>
                        </div>
                        <div class="col-2 form-group fliterfromgroup">
                            <label for="form-label">Order Status</label>
                            <select name="orderstatus" id="orderstatus" class="form-control">
                                <option value="">Select Order Status</option>
                                <option value="New" @if($orderstatus == 'New') selected @endif >New</option>
                                <option value="Pending" @if($orderstatus == 'Pending') selected @endif >Pending</option>
                                <option value="Shipped" @if($orderstatus == 'Shipped') selected @endif >Shipped</option>
                                <option value="Ready to Ship" @if($orderstatus == 'Ready to Ship') selected @endif>Ready to Ship</option>
                                <option value="Processing" @if($orderstatus == 'Processing') selected @endif>Processing</option>
                                <option value="Cancelled" @if($orderstatus == 'Cancelled') selected @endif>Cancelled</option>
                            </select>
                        </div>
                        <div class="col-2 form-group fliterfromgroup">
                            <label for="form-label">Order Source</label>
                            <select name="ordersource" id="ordersource" class="form-control">
                                <option value="">Select Order Status</option>
                                <option value="ONLINE" @if($ordersource == 'ONLINE') selected @endif >ONLINE</option>
                                <option value="PHONE" @if($ordersource == 'PHONE') selected @endif>PHONE</option>

                            </select>
                        </div>
                        <div class="col-2">
                            <button class="btn btn-success " type="submit" style="margin-top: 30px !important;">Submit</button>
                            <a class="btn btn-warning" href="{{ route('admin.sales-channel') }}" style="margin-top: 30px !important;">Reset</a>
                        </div>

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

        <div class="row">
            <div class="col-12">
                <div class="card">
                    <div class="card-body">
                        <div class="table-responsive ">
                            <table class="table table-bordered sales-channel-datatable">
                                <thead class="thead-dark">
                                    <tr>
                                        @foreach ($columns_list_header as $c)
                                        <th class="noSearch">{{ $c }}</th>
                                        @endforeach
                                    </tr>
                                </thead>
                            </table>
                        </div>
                    </div>
                </div>
                <!-- /.card -->
            </div>
            <!-- /.col -->
        </div>
        <!-- /.row -->
    </div>
    <!-- /.container-fluid -->
</section>
  <!-- /.content -->

  <script type="text/javascript">

    var table ="";
    var dataPreference = "{{ $dataPreferencejson }}";
    function newexportaction(e, dt, button, config) {
        var start_date = $('#start_date').val();
        var end_date = $('#end_date').val();
        var orderstatus = $('#orderstatus').val();
        var ordersource = $('#ordersource').val();
        var orderchannel = $('#orderchannel').val();
        window.location.href = "{{ route('admin.sales-channel-export') }}?search_start_date="+start_date+"&search_end_date="+end_date+"&search_orderstatus="+orderstatus+"&search_ordersource="+ordersource+"&search_orderchannel="+orderchannel;
    }
    $( document ).ready(function() {

       table = $('.sales-channel-datatable').DataTable({
        "dom": 'Blfrtip',
                    "buttons": [
                        {
                            "extend": 'excel',
                            "text": 'Export Orders',
                            "titleAttr": 'Excel',
                            "title": 'Most Viewed Parts',
                            "className": "btn-info",
                            "action": newexportaction
                        },
                    ],
              searching: false,
              processing: true,
              serverSide: true,
              order: [[0, 'desc']],
              "autoWidth" : false,
              ajax: {
                  url: "{{ route('admin.sales-channel') }}",
                  type: "get",
                  data: function (data) {
                    delete data.columns;
                    data.search_start_date = "{{ $start_date }}";
                    data.search_end_date = "{{ $end_date }}";
                    data.search_orderstatus = "{{ $orderstatus }}";
                    data.search_ordersource = "{{ $ordersource }}";
                    data.search_orderchannel = "{{ $orderchannel }}";
                }

              },
              columns: [
                                            ],
              "columnDefs": [  { targets: '_all', width:'20px' },{ visible: false, targets: JSON.parse(dataPreference) }
                            ],

          });

  });

  </script>

@endsection