@extends('layouts.app')

@section('appjs')
    <script type="application/javascript" src="{{ asset('js/app.js') }}"></script>
    <script src="{{ asset('js/bootstrap-multiselect.js')}}"></script>
    <link rel="stylesheet" href="{{ asset('css/bootstrap-multiselect.css')}}"/>
@endsection

@section('content')
@section('page_title')
    Lead Panel
@endsection
<div class="container-fluid">
    <div class="card">
        <div class="row ml-0 mr-0 mt-4 mb-n2">
            <div class="form-group col-md-2">@include('sales_menu') </div>
        </div>
        <div class="card-body table-responsive">
                <table class="table-bordered table-hover text-center" id="revenuedetails">
                    <thead>
                        <tr>
                            <th>Sl.No</th>
                            <th>Account ID</th>
                            <th>Client Name</th>
                            <th>City</th>
                            <th>State</th>
                            <th>Contact Person </th>
                            <th>Mobile</th>
                            <th>Email</th>
                            @canany(['isSales','isSalesManager','isSuperAdmin','isSupport', 'isAdmin'])
                            <th>Relation Manager</th>
                            @endcanany
                            <th>Website</th>
                            <th>Lead Created On</th>
                            <th>Activated Date</th>
                            <th>Channel</th>
                            <!-- <th>Chanel Type</th> -->
                            <th>Datatype</th>
                            <th>Volume</th>
                            <th>CPM</th>
                            <th>SMS Units</th>
                            <th>Revenue</th>
                        </tr>
                    </thead>
                </table>
        </div>
    </div>
</div>
<script src="{{asset('js/jquery.dataTables.min.js')}}"></script>
<script src="{{ asset('js/bootstrap-toggle.min.js')}}"></script>
<script>
    revenuedetails_list();
    //    fetch all data in data-table
    function revenuedetails_list() {
        $("#revenuedetails").DataTable().clear().destroy();
        $('#revenuedetails').DataTable({
            "processing": true,
            "serverSide": true,
            "paging": true,
            "searching": true,
            "ordering": true,
            "scrollX": true,
            "order": [
                [0, "desc"]
            ],
            "language": {
                search: '',
                searchPlaceholder: "Search...",
            },
            "ajax": {
                "url": "{{ url('getRevenueReport') }}",
                "dataType": "json",
                "type": "POST",
                "data": {
                    _token: "{{csrf_token()}}",
                },
            },
            aoColumns: [
                {
                    data: "id",
                    render: function(data, type, row, meta) {
                        return meta.row + meta.settings._iDisplayStart + 1;
                    }
                },
                { 
                    data: "id",
                    render: function(data, type, row, meta){
                    return ((row.id)  ? row.id :  "NA")
                    }
                },
                { 
                    data: "account_name",
                    render: function(data, type, row, meta){
                    return ((row.account_name)  ? row.account_name :  "NA")
                    }
                },
                { 
                    data: "city",
                    render: function(data, type, row, meta){
                    return ((row.city)  ? row.city :  "NA")
                    }
                },
                { 
                    data: "state",
                    render: function(data, type, row, meta){
                    return ((row.state)  ? row.state :  "NA")
                    }
                },
                {
                    data: "contact_person",
                    render: function(data, type, row, meta){
                    return ((row.contact_person)  ? row.contact_person :  "NA")
                    }
                },
                { 
                    data: "mobile_number",
                    render: function(data, type, row, meta){
                    return ((row.mobile_number)  ? row.mobile_number :  "NA")
                    }
                },
                {
                    data: "email",
                    render: function(data, type, row, meta){
                    return ((row.email)  ? row.email :  "NA")
                    }
                },
                @canany(['isSales','isSalesManager','isSuperAdmin','isSupport', 'isAdmin'])
                {
                    data: "relation_manager",
                    render: function(data, type, row, meta){
                    return ((row.relation_manager)  ? row.relation_manager :  "NA")
                    }
                },
                @endcanany
                {
                    data: "web_url",
                    render: function(data, type, row, meta){
                    return ((row.web_url)  ? row.web_url :  "NA")
                    }
                },
                {
                    data: "lead_created_on",
                    render: function(data, type, row, meta){
                    return ((row.lead_created_on)  ? row.lead_created_on :  "NA")
                    }
                },
                {
                    data: "activated_date",
                    render: function(data, type, row, meta){
                    return ((row.activated_date)  ? row.activated_date :  "NA")
                    }
                },
                {
                    data: "channel",
                    render: function(data, type, row, meta){
                    return ((row.channel)  ? row.channel :  "NA")
                    }
                },
                // {
                //     data: "channel_type",
                //     render: function(data, type, row, meta){
                //     return ((row.channel_type)  ? row.channel_type :  "NA")
                //     }
                // },
                {
                    data: "data_type",
                    render: function(data, type, row, meta){
                    return ((row.data_type)  ? row.data_type :  "NA")
                    }
                },
                {
                    data: "volume",
                    render: function(data, type, row, meta){
                    return ((row.volume)  ? row.volume :  "0")
                    }
                },
                {
                    data: "cpm",
                    render: function(data, type, row, meta){
                    return ((row.cpm)  ? row.cpm :  "NA")
                    }
                },
                {
                    data: "sms_units",
                    render: function(data, type, row, meta){
                    return ((row.sms_units)  ? row.sms_units :  "NA")
                    }
                },
                {
                    data: "revenue",
                    render: function(data, type, row, meta){
                    return ((row.revenue)  ? row.revenue :  "NA")
                    }
                },
            ],
        });
    }
</script>
@endsection