@extends('layouts.app')
@section('title', __( 'report.profit_loss' ))

@section('content')

<!-- Content Header (Page header) -->
<section class="content-header">
    <h1>@lang( 'report.profit_loss' )
    </h1>
</section>

<!-- Main content -->
<section class="content">
    <div class="print_section"><h2>{{session()->get('business.name')}} - @lang( 'report.profit_loss' )</h2></div>
    
    <div class="row no-print">
        <div class="col-md-3 col-md-offset-7 col-xs-6">
            <div class="input-group">
                <span class="input-group-addon bg-light-blue"><i class="fa fa-map-marker"></i></span>
                 <select class="form-control select2" id="profit_loss_location_filter">
                    @foreach($business_locations as $key => $value)
                        <option value="{{ $key }}">{{ $value }}</option>
                    @endforeach
                </select>
            </div>
        </div>
        <div class="col-md-2 col-xs-6">
            <div class="form-group pull-right">
                <div class="input-group">
                  <button type="button" class="btn btn-primary" id="profit_loss_date_filter">
                    <span>
                      <i class="fa fa-calendar"></i> {{ __('messages.filter_by_date') }}
                    </span>
                    <i class="fa fa-caret-down"></i>
                  </button>
                </div>
            </div>
        </div>
    </div>
    <div class="row">
        <div id="pl_data_div">
        </div>
    </div>
    

    <div class="row no-print">
        <div class="col-sm-12">
            <button type="button" class="btn btn-primary pull-right" 
            aria-label="Print" onclick="window.print();"
            ><i class="fa fa-print"></i> @lang( 'messages.print' )</button>
        </div>
    </div>
    <div class="row no-print">
        <div class="col-md-12">
           <!-- Custom Tabs -->
            <div class="nav-tabs-custom">
                <ul class="nav nav-tabs">
                    <li class="active">
                        <a href="#profit_by_products" data-toggle="tab" aria-expanded="true"><i class="fa fa-cubes" aria-hidden="true"></i> @lang('lang_v1.profit_by_products')</a>
                    </li>

                    <li>
                        <a href="#profit_by_categories" data-toggle="tab" aria-expanded="true"><i class="fa fa-tags" aria-hidden="true"></i> @lang('lang_v1.profit_by_categories')</a>
                    </li>

                    <li>
                        <a href="#profit_by_brands" data-toggle="tab" aria-expanded="true"><i class="fa fa-diamond" aria-hidden="true"></i> @lang('lang_v1.profit_by_brands')</a>
                    </li>

                    <li>
                        <a href="#profit_by_locations" data-toggle="tab" aria-expanded="true"><i class="fa fa-map-marker" aria-hidden="true"></i> @lang('lang_v1.profit_by_locations')</a>
                    </li>

                    <li>
                        <a href="#profit_by_invoice" data-toggle="tab" aria-expanded="true"><i class="fa fa-file-alt" aria-hidden="true"></i> @lang('lang_v1.profit_by_invoice')</a>
                    </li>

                    <li>
                        <a href="#profit_by_date" data-toggle="tab" aria-expanded="true"><i class="fa fa-calendar" aria-hidden="true"></i> @lang('lang_v1.profit_by_date')</a>
                    </li>
                    <li>
                        <a href="#profit_by_customer" data-toggle="tab" aria-expanded="true"><i class="fa fa-user" aria-hidden="true"></i> @lang('lang_v1.profit_by_customer')</a>
                    </li>
                    <li>
                        <a href="#profit_by_day" data-toggle="tab" aria-expanded="true"><i class="fa fa-calendar" aria-hidden="true"></i> @lang('lang_v1.profit_by_day')</a>
                    </li>
                </ul>

                <div class="tab-content">
                    <div class="tab-pane active" id="profit_by_products"> 
                        @include('report.partials.profit_by_products')
                    </div>

                    <div class="tab-pane" id="profit_by_categories">
                        @include('report.partials.profit_by_categories')
                    </div>

                    <div class="tab-pane" id="profit_by_brands">
                        @include('report.partials.profit_by_brands')
                    </div>

                    <div class="tab-pane" id="profit_by_locations">
                        @include('report.partials.profit_by_locations')
                    </div>

                    <div class="tab-pane" id="profit_by_invoice">
                        @include('report.partials.profit_by_invoice')
                    </div>

                    <div class="tab-pane" id="profit_by_date">
                        @include('report.partials.profit_by_date')
                    </div>

                    <div class="tab-pane" id="profit_by_customer">
                        @include('report.partials.profit_by_customer')
                    </div>

                    <div class="tab-pane" id="profit_by_day">
                        
                    </div>
                </div>
            </div>
        </div>
    </div>
	

</section>

@php
$businessdata = \App\Business::where('id',request()->session()->get('user.business_id'))->first();
@endphp

         
<!-- /.content -->
@stop
@section('javascript')
<script src="{{ asset('js/report.js?v=' . $asset_v) }}"></script>

<script type="text/javascript">
    $(document).ready( function() {
        profit_by_products_table = $('#profit_by_products_table').DataTable({
                processing: true,
                serverSide: true,
                "ajax": {
                    "url": "/reports/get-profit/product",
                    "data": function ( d ) {
                        d.start_date = $('#profit_loss_date_filter')
                            .data('daterangepicker')
                            .startDate.format('YYYY-MM-DD');
                        d.end_date = $('#profit_loss_date_filter')
                            .data('daterangepicker')
                            .endDate.format('YYYY-MM-DD');
                        d.location_id = $('#profit_loss_location_filter').val();
                    }
                },
                columns: [
                    { data: 'product', name: 'product'  },
                    { data: 'gross_profit', "searchable": false},
                ],
                buttons: [
            {
                extend: 'csv',
                text: '<i class="fa fa-file-csv"></i> Export to Csv',
                className: 'btn-sm',
                exportOptions: {
                    columns: ':visible'
                }
            },
            {
                extend: 'excel',
                text: '<i class="fas fa-file-excel"></i> Export to Excel',
                className: 'btn-sm',
                exportOptions: {
                    columns: ':visible'
                }
            },
            {
            extend: 'print',
                text: '<i class="fas fa-print"></i> Print',
                                    exportOptions: {
                        columns: ':visible'
                    },
                className: 'btn-sm',
                exportOptions: {
                        columns: ':visible'
                    },
                customize: function (win) {
                    var appliedFilters = '';


                    if (appliedFilters) {
                        appliedFilters = '<div style="text-align: center;">' +
                        '<img src="{{ asset('uploads/business_logos/' . $businessdata->logo) }}" style="max-width: 150px; max-height: 150px;" />' +
                        '<h2 class="text-center mb-3">{{ $businessdata->name }}</h2>' +
                        '<h3 class="mb-3">All Sales</h3>' +
                        '<div style="text-align: left;">' +
                        appliedFilters +
                        '</div>' +
                        '</div>';
                    } else {
                        appliedFilters = '<div style="text-align: center;">' +
                                            '<img src="{{ asset('uploads/business_logos/' . $businessdata->logo) }}" style="max-width: 150px; max-height: 150px;" />' +
                                            '<h2 class="text-center mb-3">{{ $businessdata->name }}</h2>' +
                                            '<h3 class="mb-3">Profit / Loss Report</h3>' +
                                            '</div>';
                    }


                    $(win.document.body).css('font-size', '10pt');
                    $(win.document.body).find('h1, h2').hide();
                    $(win.document.body).find('table').addClass('compact').css('font-size', 'inherit');

                    $(win.document.body).prepend(appliedFilters);

                    var lastTable = $(win.document.body).find('table:last');      
                    
                    lastTable.after(
                        '<div style="text-align: right; margin-top: 40px;">' +
                                    '<p><strong>Authorized Signatory:</strong> ' +' ----------- '+ '</p>');
                }
            },


            {
                text: '<i class="fas fa-columns"></i> Column Visibility',
                className: 'btn-sm',
                action: function (e, dt, node, config) {
                    e.preventDefault();
                    // Remove any existing dropdowns first
                    $('.dt-green-colvis-dropdown').remove();

                    var $btn = $(node);
                    var btnOffset = $btn.offset();
                    var btnHeight = $btn.outerHeight();

                    // Build dropdown container with green theme
                    var $dropdown = $('<div>', {
                        class: 'dt-green-colvis-dropdown',
                        css: {
                            position: 'absolute',
                            top: btnOffset.top + btnHeight + 6,
                            left: btnOffset.left,
                            minWidth: '240px',
                            maxWidth: '320px',
                            maxHeight: '360px',
                            overflowY: 'auto',
                            zIndex: 2000,
                            background: 'linear-gradient(180deg, #e8f8ec 0%, #c9f0d4 100%)',
                            border: '1px solid #2e7d32',
                            borderRadius: '10px',
                            boxShadow: '0 10px 30px rgba(46,125,50,0.25)',
                            padding: '10px',
                        }
                    });

                    var $title = $('<div>', {
                        text: 'Toggle columns',
                        css: {
                            color: '#1b5e20',
                            fontWeight: 700,
                            fontSize: '14px',
                            margin: '4px 8px 10px 8px'
                        }
                    });
                    $dropdown.append($title);

                    // Build checkbox list for each column
                    dt.columns().every(function (idx) {
                        var column = this;
                        var header = $(column.header());
                        var title = header.text() || ('Column ' + (idx + 1));

                        // Skip if marked non-toggleable
                        if (header.hasClass('no-hide') || header.hasClass('no-export')) {
                            return; // continue
                        }

                        var colId = 'dt-colvis-' + dt.table().node().id + '-' + idx + '-' + Date.now();
                        var $wrap = $('<label>', {
                            for: colId,
                            css: {
                                display: 'flex',
                                alignItems: 'center',
                                gap: '8px',
                                padding: '8px 10px',
                                margin: '6px 6px',
                                borderRadius: '8px',
                                border: '1px solid rgba(46,125,50,0.25)',
                                backgroundColor: 'rgba(76,175,80,0.06)',
                                cursor: 'pointer',
                                transition: 'all .15s ease',
                                userSelect: 'none'
                            }
                        })
                        .hover(function(){
                            $(this).css({ backgroundColor: '#2e7d32', color: '#fff', transform: 'translateY(-1px)' });
                        }, function(){
                            $(this).css({ backgroundColor: 'rgba(76,175,80,0.06)', color: '#1b5e20', transform: 'none' });
                        });

                        var $checkbox = $('<input>', {
                            type: 'checkbox',
                            id: colId,
                            checked: column.visible(),
                            css: {
                                width: '18px',
                                height: '18px',
                                accentColor: '#2e7d32',
                                cursor: 'pointer'
                            }
                        }).on('change', function (ev) {
                            ev.stopPropagation();
                            column.visible(this.checked);
                        });

                        var $text = $('<span>', {
                            text: title,
                            css: { flexGrow: 1, fontSize: '13px' }
                        });

                        $wrap.append($checkbox).append($text);
                        $dropdown.append($wrap);
                    });

                    // Append and show
                    $('body').append($dropdown);

                    // Hide logic: click outside and smart mouseleave with small delay
                    var hideTimeout;
                    function scheduleHide(){ hideTimeout = setTimeout(removeDropdown, 300); }
                    function cancelHide(){ if (hideTimeout) { clearTimeout(hideTimeout); hideTimeout = null; } }
                    function removeDropdown(){ $(document).off('mousedown.dtGreenColvis'); $dropdown.remove(); }

                    // Bridge area between button and dropdown: cancel hide when over either
                    $dropdown.on('mouseenter', cancelHide).on('mouseleave', scheduleHide);
                    $btn.on('mouseenter', cancelHide).on('mouseleave', scheduleHide);

                    $(document).on('mousedown.dtGreenColvis', function (evt) {
                        if (!$(evt.target).closest('.dt-green-colvis-dropdown').length && !$(evt.target).closest(node).length) {
                            removeDropdown();
                        }
                    });
                }
            },

            {
                extend: 'pdf',
                text: '<i class="fas fa-file-pdf"></i> Export PDF',
                className: 'btn-sm',
                exportOptions: {
                    columns: ':visible'
                }
            },
      
        ],
                footerCallback: function ( row, data, start, end, display ) {
                    var total_profit = 0;
                    for (var r in data){
                        total_profit += $(data[r].gross_profit).data('orig-value') ? 
                        parseFloat($(data[r].gross_profit).data('orig-value')) : 0;
                    }

                    $('#profit_by_products_table .footer_total').html(__currency_trans_from_en(total_profit));
                }
            });

        $('a[data-toggle="tab"]').on('shown.bs.tab', function (e) {
            var target = $(e.target).attr('href');
            if ( target == '#profit_by_categories') {
                if(typeof profit_by_categories_datatable == 'undefined') {
                    profit_by_categories_datatable = $('#profit_by_categories_table').DataTable({
                        processing: true,
                        serverSide: true,
                        "ajax": {
                            "url": "/reports/get-profit/category",
                            "data": function ( d ) {
                                d.start_date = $('#profit_loss_date_filter')
                                    .data('daterangepicker')
                                    .startDate.format('YYYY-MM-DD');
                                d.end_date = $('#profit_loss_date_filter')
                                    .data('daterangepicker')
                                    .endDate.format('YYYY-MM-DD');
                                d.location_id = $('#profit_loss_location_filter').val();
                            }
                        },
                        columns: [
                            { data: 'category', name: 'C.name'  },
                            { data: 'gross_profit', "searchable": false},
                        ],
                        buttons: [
            {
                extend: 'csv',
                text: '<i class="fa fa-file-csv"></i> Export to Csv',
                className: 'btn-sm',
                exportOptions: {
                    columns: ':visible'
                }
            },
            {
                extend: 'excel',
                text: '<i class="fas fa-file-excel"></i> Export to Excel',
                className: 'btn-sm',
                exportOptions: {
                    columns: ':visible'
                }
            },
            {
            extend: 'print',
                text: '<i class="fas fa-print"></i> Print',
                                    exportOptions: {
                        columns: ':visible'
                    },
                className: 'btn-sm',
                customize: function (win) {
                    var appliedFilters = '';


                    if (appliedFilters) {
                        appliedFilters = '<div style="text-align: center;">' +
                        '<img src="{{ asset('uploads/business_logos/' . $businessdata->logo) }}" style="max-width: 150px; max-height: 150px;" />' +
                        '<h2 class="text-center mb-3">{{ $businessdata->name }}</h2>' +
                        '<h3 class="mb-3">All Sales</h3>' +
                        '<div style="text-align: left;">' +
                        appliedFilters +
                        '</div>' +
                        '</div>';
                    } else {
                        appliedFilters = '<div style="text-align: center;">' +
                                            '<img src="{{ asset('uploads/business_logos/' . $businessdata->logo) }}" style="max-width: 150px; max-height: 150px;" />' +
                                            '<h2 class="text-center mb-3">{{ $businessdata->name }}</h2>' +
                                            '<h3 class="mb-3">Profit / Loss Report</h3>' +
                                            '</div>';
                    }


                    $(win.document.body).css('font-size', '10pt');
                    $(win.document.body).find('h1, h2').hide();
                    $(win.document.body).find('table').addClass('compact').css('font-size', 'inherit');

                    $(win.document.body).prepend(appliedFilters);

                    var lastTable = $(win.document.body).find('table:last');      
                    
                    lastTable.after(
                        '<div style="text-align: right; margin-top: 40px;">' +
                                    '<p><strong>Authorized Signatory:</strong> ' +' ----------- '+ '</p>');
                }
            },


            {
                text: '<i class="fas fa-columns"></i> Column Visibility',
                className: 'btn-sm',
                action: function (e, dt, node, config) {
                    e.preventDefault();
                    $('.dt-green-colvis-dropdown').remove();
                    var $btn = $(node);
                    var btnOffset = $btn.offset();
                    var btnHeight = $btn.outerHeight();
                    var $dropdown = $('<div>', { class: 'dt-green-colvis-dropdown', css: { position:'absolute', top: btnOffset.top + btnHeight + 6, left: btnOffset.left, minWidth:'240px', maxWidth:'320px', maxHeight:'360px', overflowY:'auto', zIndex:2000, background:'linear-gradient(180deg, #e8f8ec 0%, #c9f0d4 100%)', border:'1px solid #2e7d32', borderRadius:'10px', boxShadow:'0 10px 30px rgba(46,125,50,0.25)', padding:'10px' }});
                    var $title = $('<div>', { text:'Toggle columns', css:{ color:'#1b5e20', fontWeight:700, fontSize:'14px', margin:'4px 8px 10px 8px' } });
                    $dropdown.append($title);
                    dt.columns().every(function (idx) {
                        var column = this; var header = $(column.header()); var title = header.text() || ('Column ' + (idx + 1));
                        if (header.hasClass('no-hide') || header.hasClass('no-export')) { return; }
                        var colId = 'dt-colvis-' + dt.table().node().id + '-' + idx + '-' + Date.now();
                        var $wrap = $('<label>', { for: colId, css:{ display:'flex', alignItems:'center', gap:'8px', padding:'8px 10px', margin:'6px 6px', borderRadius:'8px', border:'1px solid rgba(46,125,50,0.25)', backgroundColor:'rgba(76,175,80,0.06)', cursor:'pointer', transition:'all .15s ease', userSelect:'none' } })
                          .hover(function(){ $(this).css({ backgroundColor:'#2e7d32', color:'#fff', transform:'translateY(-1px)' }); }, function(){ $(this).css({ backgroundColor:'rgba(76,175,80,0.06)', color:'#1b5e20', transform:'none' }); });
                        var $checkbox = $('<input>', { type:'checkbox', id: colId, checked: column.visible(), css:{ width:'18px', height:'18px', accentColor:'#2e7d32', cursor:'pointer' } })
                          .on('change', function(ev){ ev.stopPropagation(); column.visible(this.checked); });
                        var $text = $('<span>', { text: title, css:{ flexGrow:1, fontSize:'13px' } });
                        $wrap.append($checkbox).append($text); $dropdown.append($wrap);
                    });
                    $('body').append($dropdown);
                    var hideTimeout; function scheduleHide(){ hideTimeout = setTimeout(removeDropdown, 300); } function cancelHide(){ if (hideTimeout){ clearTimeout(hideTimeout); hideTimeout=null; } } function removeDropdown(){ $(document).off('mousedown.dtGreenColvis'); $dropdown.remove(); }
                    $dropdown.on('mouseenter', cancelHide).on('mouseleave', scheduleHide); $btn.on('mouseenter', cancelHide).on('mouseleave', scheduleHide);
                    $(document).on('mousedown.dtGreenColvis', function(evt){ if (!$(evt.target).closest('.dt-green-colvis-dropdown').length && !$(evt.target).closest(node).length){ removeDropdown(); } });
                }
            },

            {
                extend: 'pdf',
                text: '<i class="fas fa-file-pdf"></i> Export PDF',
                className: 'btn-sm',
                exportOptions: {
                    columns: ':visible'
                }
            },
      
        ],
                        footerCallback: function ( row, data, start, end, display ) {
                            var total_profit = 0;
                            for (var r in data){
                                total_profit += $(data[r].gross_profit).data('orig-value') ? 
                                parseFloat($(data[r].gross_profit).data('orig-value')) : 0;
                            }

                            $('#profit_by_categories_table .footer_total').html(__currency_trans_from_en(total_profit));
                        },
                    });
                } else {
                    profit_by_categories_datatable.ajax.reload();
                }
            } else if (target == '#profit_by_brands') {
                if(typeof profit_by_brands_datatable == 'undefined') {
                    profit_by_brands_datatable = $('#profit_by_brands_table').DataTable({
                        processing: true,
                        serverSide: true,
                        "ajax": {
                            "url": "/reports/get-profit/brand",
                            "data": function ( d ) {
                                d.start_date = $('#profit_loss_date_filter')
                                    .data('daterangepicker')
                                    .startDate.format('YYYY-MM-DD');
                                d.end_date = $('#profit_loss_date_filter')
                                    .data('daterangepicker')
                                    .endDate.format('YYYY-MM-DD');
                                d.location_id = $('#profit_loss_location_filter').val();
                            }
                        },
                        columns: [
                            { data: 'brand', name: 'B.name'  },
                            { data: 'gross_profit', "searchable": false},
                        ],
                        buttons: [
            {
                extend: 'csv',
                text: '<i class="fa fa-file-csv"></i> Export to Csv',
                className: 'btn-sm',
                exportOptions: {
                    columns: ':visible'
                }
            },
            {
                extend: 'excel',
                text: '<i class="fas fa-file-excel"></i> Export to Excel',
                className: 'btn-sm',
                exportOptions: {
                    columns: ':visible'
                }
            },
            {
            extend: 'print',
                text: '<i class="fas fa-print"></i> Print',
                                    exportOptions: {
                        columns: ':visible'
                    },
                className: 'btn-sm',
                customize: function (win) {
                    var appliedFilters = '';


                    if (appliedFilters) {
                        appliedFilters = '<div style="text-align: center;">' +
                        '<img src="{{ asset('uploads/business_logos/' . $businessdata->logo) }}" style="max-width: 150px; max-height: 150px;" />' +
                        '<h2 class="text-center mb-3">{{ $businessdata->name }}</h2>' +
                        '<h3 class="mb-3">All Sales</h3>' +
                        '<div style="text-align: left;">' +
                        appliedFilters +
                        '</div>' +
                        '</div>';
                    } else {
                        appliedFilters = '<div style="text-align: center;">' +
                                            '<img src="{{ asset('uploads/business_logos/' . $businessdata->logo) }}" style="max-width: 150px; max-height: 150px;" />' +
                                            '<h2 class="text-center mb-3">{{ $businessdata->name }}</h2>' +
                                            '<h3 class="mb-3">Profit / Loss Report</h3>' +
                                            '</div>';
                    }


                    $(win.document.body).css('font-size', '10pt');
                    $(win.document.body).find('h1, h2').hide();
                    $(win.document.body).find('table').addClass('compact').css('font-size', 'inherit');

                    $(win.document.body).prepend(appliedFilters);

                    var lastTable = $(win.document.body).find('table:last');      
                    
                    lastTable.after(
                        '<div style="text-align: right; margin-top: 40px;">' +
                                    '<p><strong>Authorized Signatory:</strong> ' +' ----------- '+ '</p>');
                }
            },


            {
                text: '<i class="fas fa-columns"></i> Column Visibility',
                className: 'btn-sm',
                action: function (e, dt, node, config) {
                    e.preventDefault();
                    $('.dt-green-colvis-dropdown').remove();
                    var $btn = $(node);
                    var btnOffset = $btn.offset();
                    var btnHeight = $btn.outerHeight();
                    var $dropdown = $('<div>', { class: 'dt-green-colvis-dropdown', css: { position:'absolute', top: btnOffset.top + btnHeight + 6, left: btnOffset.left, minWidth:'240px', maxWidth:'320px', maxHeight:'360px', overflowY:'auto', zIndex:2000, background:'linear-gradient(180deg, #e8f8ec 0%, #c9f0d4 100%)', border:'1px solid #2e7d32', borderRadius:'10px', boxShadow:'0 10px 30px rgba(46,125,50,0.25)', padding:'10px' }});
                    var $title = $('<div>', { text:'Toggle columns', css:{ color:'#1b5e20', fontWeight:700, fontSize:'14px', margin:'4px 8px 10px 8px' } });
                    $dropdown.append($title);
                    dt.columns().every(function (idx) {
                        var column = this; var header = $(column.header()); var title = header.text() || ('Column ' + (idx + 1));
                        if (header.hasClass('no-hide') || header.hasClass('no-export')) { return; }
                        var colId = 'dt-colvis-' + dt.table().node().id + '-' + idx + '-' + Date.now();
                        var $wrap = $('<label>', { for: colId, css:{ display:'flex', alignItems:'center', gap:'8px', padding:'8px 10px', margin:'6px 6px', borderRadius:'8px', border:'1px solid rgba(46,125,50,0.25)', backgroundColor:'rgba(76,175,80,0.06)', cursor:'pointer', transition:'all .15s ease', userSelect:'none' } })
                          .hover(function(){ $(this).css({ backgroundColor:'#2e7d32', color:'#fff', transform:'translateY(-1px)' }); }, function(){ $(this).css({ backgroundColor:'rgba(76,175,80,0.06)', color:'#1b5e20', transform:'none' }); });
                        var $checkbox = $('<input>', { type:'checkbox', id: colId, checked: column.visible(), css:{ width:'18px', height:'18px', accentColor:'#2e7d32', cursor:'pointer' } })
                          .on('change', function(ev){ ev.stopPropagation(); column.visible(this.checked); });
                        var $text = $('<span>', { text: title, css:{ flexGrow:1, fontSize:'13px' } });
                        $wrap.append($checkbox).append($text); $dropdown.append($wrap);
                    });
                    $('body').append($dropdown);
                    var hideTimeout; function scheduleHide(){ hideTimeout = setTimeout(removeDropdown, 300); } function cancelHide(){ if (hideTimeout){ clearTimeout(hideTimeout); hideTimeout=null; } } function removeDropdown(){ $(document).off('mousedown.dtGreenColvis'); $dropdown.remove(); }
                    $dropdown.on('mouseenter', cancelHide).on('mouseleave', scheduleHide); $btn.on('mouseenter', cancelHide).on('mouseleave', scheduleHide);
                    $(document).on('mousedown.dtGreenColvis', function(evt){ if (!$(evt.target).closest('.dt-green-colvis-dropdown').length && !$(evt.target).closest(node).length){ removeDropdown(); } });
                }
            },

            {
                extend: 'pdf',
                text: '<i class="fas fa-file-pdf"></i> Export PDF',
                className: 'btn-sm',
                exportOptions: {
                    columns: ':visible'
                }
            },
      
        ],
                        footerCallback: function ( row, data, start, end, display ) {
                            var total_profit = 0;
                            for (var r in data){
                                total_profit += $(data[r].gross_profit).data('orig-value') ? 
                                parseFloat($(data[r].gross_profit).data('orig-value')) : 0;
                            }

                            $('#profit_by_brands_table .footer_total').html(__currency_trans_from_en(total_profit));
                        },
                    });
                } else {
                    profit_by_brands_datatable.ajax.reload();
                }
            } else if (target == '#profit_by_locations') {
                if(typeof profit_by_locations_datatable == 'undefined') {
                    profit_by_locations_datatable = $('#profit_by_locations_table').DataTable({
                        processing: true,
                        serverSide: true,
                        "ajax": {
                            "url": "/reports/get-profit/location",
                            "data": function ( d ) {
                                d.start_date = $('#profit_loss_date_filter')
                                    .data('daterangepicker')
                                    .startDate.format('YYYY-MM-DD');
                                d.end_date = $('#profit_loss_date_filter')
                                    .data('daterangepicker')
                                    .endDate.format('YYYY-MM-DD');
                                d.location_id = $('#profit_loss_location_filter').val();
                            }
                        },
                        columns: [
                            { data: 'location', name: 'L.name'  },
                            { data: 'gross_profit', "searchable": false},
                        ],
                        buttons: [
            {
                extend: 'csv',
                text: '<i class="fa fa-file-csv"></i> Export to Csv',
                className: 'btn-sm',
                exportOptions: {
                    columns: ':visible'
                }
            },
            {
                extend: 'excel',
                text: '<i class="fas fa-file-excel"></i> Export to Excel',
                className: 'btn-sm',
                exportOptions: {
                    columns: ':visible'
                }
            },
            {
            extend: 'print',
                text: '<i class="fas fa-print"></i> Print',
                                    exportOptions: {
                        columns: ':visible'
                    },
                className: 'btn-sm',
                customize: function (win) {
                    var appliedFilters = '';


                    if (appliedFilters) {
                        appliedFilters = '<div style="text-align: center;">' +
                        '<img src="{{ asset('uploads/business_logos/' . $businessdata->logo) }}" style="max-width: 150px; max-height: 150px;" />' +
                        '<h2 class="text-center mb-3">{{ $businessdata->name }}</h2>' +
                        '<h3 class="mb-3">All Sales</h3>' +
                        '<div style="text-align: left;">' +
                        appliedFilters +
                        '</div>' +
                        '</div>';
                    } else {
                        appliedFilters = '<div style="text-align: center;">' +
                                            '<img src="{{ asset('uploads/business_logos/' . $businessdata->logo) }}" style="max-width: 150px; max-height: 150px;" />' +
                                            '<h2 class="text-center mb-3">{{ $businessdata->name }}</h2>' +
                                            '<h3 class="mb-3">Profit / Loss Report</h3>' +
                                            '</div>';
                    }


                    $(win.document.body).css('font-size', '10pt');
                    $(win.document.body).find('h1, h2').hide();
                    $(win.document.body).find('table').addClass('compact').css('font-size', 'inherit');

                    $(win.document.body).prepend(appliedFilters);

                    var lastTable = $(win.document.body).find('table:last');      
                    
                    lastTable.after(
                        '<div style="text-align: right; margin-top: 40px;">' +
                                    '<p><strong>Authorized Signatory:</strong> ' +' ----------- '+ '</p>');
                }
            },


            {
                text: '<i class="fas fa-columns"></i> Column Visibility',
                className: 'btn-sm',
                action: function (e, dt, node, config) {
                    e.preventDefault();
                    $('.dt-green-colvis-dropdown').remove();
                    var $btn = $(node);
                    var btnOffset = $btn.offset();
                    var btnHeight = $btn.outerHeight();
                    var $dropdown = $('<div>', { class: 'dt-green-colvis-dropdown', css: { position:'absolute', top: btnOffset.top + btnHeight + 6, left: btnOffset.left, minWidth:'240px', maxWidth:'320px', maxHeight:'360px', overflowY:'auto', zIndex:2000, background:'linear-gradient(180deg, #e8f8ec 0%, #c9f0d4 100%)', border:'1px solid #2e7d32', borderRadius:'10px', boxShadow:'0 10px 30px rgba(46,125,50,0.25)', padding:'10px' }});
                    var $title = $('<div>', { text:'Toggle columns', css:{ color:'#1b5e20', fontWeight:700, fontSize:'14px', margin:'4px 8px 10px 8px' } });
                    $dropdown.append($title);
                    dt.columns().every(function (idx) {
                        var column = this; var header = $(column.header()); var title = header.text() || ('Column ' + (idx + 1));
                        if (header.hasClass('no-hide') || header.hasClass('no-export')) { return; }
                        var colId = 'dt-colvis-' + dt.table().node().id + '-' + idx + '-' + Date.now();
                        var $wrap = $('<label>', { for: colId, css:{ display:'flex', alignItems:'center', gap:'8px', padding:'8px 10px', margin:'6px 6px', borderRadius:'8px', border:'1px solid rgba(46,125,50,0.25)', backgroundColor:'rgba(76,175,80,0.06)', cursor:'pointer', transition:'all .15s ease', userSelect:'none' } })
                      .hover(function(){ $(this).css({ backgroundColor:'#2e7d32', color:'#fff', transform:'translateY(-1px)' }); }, function(){ $(this).css({ backgroundColor:'rgba(76,175,80,0.06)', color:'#1b5e20', transform:'none' }); });
                        var $checkbox = $('<input>', { type:'checkbox', id: colId, checked: column.visible(), css:{ width:'18px', height:'18px', accentColor:'#2e7d32', cursor:'pointer' } })
                      .on('change', function(ev){ ev.stopPropagation(); column.visible(this.checked); });
                        var $text = $('<span>', { text: title, css:{ flexGrow:1, fontSize:'13px' } });
                        $wrap.append($checkbox).append($text); $dropdown.append($wrap);
                    });
                    $('body').append($dropdown);
                    var hideTimeout; function scheduleHide(){ hideTimeout = setTimeout(removeDropdown, 300); } function cancelHide(){ if (hideTimeout){ clearTimeout(hideTimeout); hideTimeout=null; } } function removeDropdown(){ $(document).off('mousedown.dtGreenColvis'); $dropdown.remove(); }
                    $dropdown.on('mouseenter', cancelHide).on('mouseleave', scheduleHide); $btn.on('mouseenter', cancelHide).on('mouseleave', scheduleHide);
                    $(document).on('mousedown.dtGreenColvis', function(evt){ if (!$(evt.target).closest('.dt-green-colvis-dropdown').length && !$(evt.target).closest(node).length){ removeDropdown(); } });
                }
            },

            {
                extend: 'pdf',
                text: '<i class="fas fa-file-pdf"></i> Export PDF',
                className: 'btn-sm',
                exportOptions: {
                    columns: ':visible'
                }
            },
      
        ],
                        footerCallback: function ( row, data, start, end, display ) {
                            var total_profit = 0;
                            for (var r in data){
                                total_profit += $(data[r].gross_profit).data('orig-value') ? 
                                parseFloat($(data[r].gross_profit).data('orig-value')) : 0;
                            }

                            $('#profit_by_locations_table .footer_total').html(__currency_trans_from_en(total_profit));
                        },
                    });
                } else {
                    profit_by_locations_datatable.ajax.reload();
                }
            } else if (target == '#profit_by_invoice') {
                if(typeof profit_by_invoice_datatable == 'undefined') {
                    profit_by_invoice_datatable = $('#profit_by_invoice_table').DataTable({
                        processing: true,
                        serverSide: true,
                        "ajax": {
                            "url": "/reports/get-profit/invoice",
                            "data": function ( d ) {
                                d.start_date = $('#profit_loss_date_filter')
                                    .data('daterangepicker')
                                    .startDate.format('YYYY-MM-DD');
                                d.end_date = $('#profit_loss_date_filter')
                                    .data('daterangepicker')
                                    .endDate.format('YYYY-MM-DD');
                                d.location_id = $('#profit_loss_location_filter').val();
                                d.payment_status = $('#sell_list_filter_payment_status').val();

                            }
                        },
                        columns: [
                            { data: 'invoice_no', name: 'sale.invoice_no'  },
                            { data: 'payment_status', name: 'sale.payment_status'  },
                            { data: 'gross_profit', "searchable": false},
                        ],
                        buttons: [
            {
                extend: 'csv',
                text: '<i class="fa fa-file-csv"></i> Export to Csv',
                className: 'btn-sm',
                exportOptions: {
                    columns: ':visible'
                }
            },
            {
                extend: 'excel',
                text: '<i class="fas fa-file-excel"></i> Export to Excel',
                className: 'btn-sm',
                exportOptions: {
                    columns: ':visible'
                }
            },
            {
            extend: 'print',
                text: '<i class="fas fa-print"></i> Print',
                                    exportOptions: {
                        columns: ':visible'
                    },
                className: 'btn-sm',
                customize: function (win) {
                    var appliedFilters = '';


                    if (appliedFilters) {
                        appliedFilters = '<div style="text-align: center;">' +
                        '<img src="{{ asset('uploads/business_logos/' . $businessdata->logo) }}" style="max-width: 150px; max-height: 150px;" />' +
                        '<h2 class="text-center mb-3">{{ $businessdata->name }}</h2>' +
                        '<h3 class="mb-3">All Sales</h3>' +
                        '<div style="text-align: left;">' +
                        appliedFilters +
                        '</div>' +
                        '</div>';
                    } else {
                        appliedFilters = '<div style="text-align: center;">' +
                                            '<img src="{{ asset('uploads/business_logos/' . $businessdata->logo) }}" style="max-width: 150px; max-height: 150px;" />' +
                                            '<h2 class="text-center mb-3">{{ $businessdata->name }}</h2>' +
                                            '<h3 class="mb-3">Profit / Loss Report</h3>' +
                                            '</div>';
                    }


                    $(win.document.body).css('font-size', '10pt');
                    $(win.document.body).find('h1, h2').hide();
                    $(win.document.body).find('table').addClass('compact').css('font-size', 'inherit');

                    $(win.document.body).prepend(appliedFilters);

                    var lastTable = $(win.document.body).find('table:last');      
                    
                    lastTable.after(
                        '<div style="text-align: right; margin-top: 40px;">' +
                                    '<p><strong>Authorized Signatory:</strong> ' +' ----------- '+ '</p>');
                }
            },


            {
                text: '<i class="fas fa-columns"></i> Column Visibility',
                className: 'btn-sm',
                action: function (e, dt, node, config) {
                    e.preventDefault();
                    $('.dt-green-colvis-dropdown').remove();
                    var $btn = $(node);
                    var btnOffset = $btn.offset();
                    var btnHeight = $btn.outerHeight();
                    var $dropdown = $('<div>', { class: 'dt-green-colvis-dropdown', css: { position:'absolute', top: btnOffset.top + btnHeight + 6, left: btnOffset.left, minWidth:'240px', maxWidth:'320px', maxHeight:'360px', overflowY:'auto', zIndex:2000, background:'linear-gradient(180deg, #e8f8ec 0%, #c9f0d4 100%)', border:'1px solid #2e7d32', borderRadius:'10px', boxShadow:'0 10px 30px rgba(46,125,50,0.25)', padding:'10px' }});
                    var $title = $('<div>', { text:'Toggle columns', css:{ color:'#1b5e20', fontWeight:700, fontSize:'14px', margin:'4px 8px 10px 8px' } });
                    $dropdown.append($title);
                    dt.columns().every(function (idx) {
                        var column = this; var header = $(column.header()); var title = header.text() || ('Column ' + (idx + 1));
                        if (header.hasClass('no-hide') || header.hasClass('no-export')) { return; }
                        var colId = 'dt-colvis-' + dt.table().node().id + '-' + idx + '-' + Date.now();
                        var $wrap = $('<label>', { for: colId, css:{ display:'flex', alignItems:'center', gap:'8px', padding:'8px 10px', margin:'6px 6px', borderRadius:'8px', border:'1px solid rgba(46,125,50,0.25)', backgroundColor:'rgba(76,175,80,0.06)', cursor:'pointer', transition:'all .15s ease', userSelect:'none' } })
                          .hover(function(){ $(this).css({ backgroundColor:'#2e7d32', color:'#fff', transform:'translateY(-1px)' }); }, function(){ $(this).css({ backgroundColor:'rgba(76,175,80,0.06)', color:'#1b5e20', transform:'none' }); });
                        var $checkbox = $('<input>', { type:'checkbox', id: colId, checked: column.visible(), css:{ width:'18px', height:'18px', accentColor:'#2e7d32', cursor:'pointer' } })
                          .on('change', function(ev){ ev.stopPropagation(); column.visible(this.checked); });
                        var $text = $('<span>', { text: title, css:{ flexGrow:1, fontSize:'13px' } });
                        $wrap.append($checkbox).append($text); $dropdown.append($wrap);
                    });
                    $('body').append($dropdown);
                    var hideTimeout; function scheduleHide(){ hideTimeout = setTimeout(removeDropdown, 300); } function cancelHide(){ if (hideTimeout){ clearTimeout(hideTimeout); hideTimeout=null; } } function removeDropdown(){ $(document).off('mousedown.dtGreenColvis'); $dropdown.remove(); }
                    $dropdown.on('mouseenter', cancelHide).on('mouseleave', scheduleHide); $btn.on('mouseenter', cancelHide).on('mouseleave', scheduleHide);
                    $(document).on('mousedown.dtGreenColvis', function(evt){ if (!$(evt.target).closest('.dt-green-colvis-dropdown').length && !$(evt.target).closest(node).length){ removeDropdown(); } });
                }
            },

            {
                extend: 'pdf',
                text: '<i class="fas fa-file-pdf"></i> Export PDF',
                className: 'btn-sm',
                exportOptions: {
                    columns: ':visible'
                }
            },
      
        ],
                        footerCallback: function ( row, data, start, end, display ) {
                            var total_profit = 0;
                            for (var r in data){
                                total_profit += $(data[r].gross_profit).data('orig-value') ? 
                                parseFloat($(data[r].gross_profit).data('orig-value')) : 0;
                            }

                            $('#profit_by_invoice_table .footer_total').html(__currency_trans_from_en(total_profit));
                        },
                    });
                } else {
                    profit_by_invoice_datatable.ajax.reload();
                }
            } else if (target == '#profit_by_date') {
                if(typeof profit_by_date_datatable == 'undefined') {
                    profit_by_date_datatable = $('#profit_by_date_table').DataTable({
                        processing: true,
                        serverSide: true,
                        "ajax": {
                            "url": "/reports/get-profit/date",
                            "data": function ( d ) {
                                d.start_date = $('#profit_loss_date_filter')
                                    .data('daterangepicker')
                                    .startDate.format('YYYY-MM-DD');
                                d.end_date = $('#profit_loss_date_filter')
                                    .data('daterangepicker')
                                    .endDate.format('YYYY-MM-DD');
                                d.location_id = $('#profit_loss_location_filter').val();
                            }
                        },
                        columns: [
                            { data: 'transaction_date', name: 'sale.transaction_date'  },
                            { data: 'gross_profit', "searchable": false},
                        ],
                        buttons: [
            {
                extend: 'csv',
                text: '<i class="fa fa-file-csv"></i> Export to Csv',
                className: 'btn-sm',
                exportOptions: {
                    columns: ':visible'
                }
            },
            {
                extend: 'excel',
                text: '<i class="fas fa-file-excel"></i> Export to Excel',
                className: 'btn-sm',
                exportOptions: {
                    columns: ':visible'
                }
            },
            {
            extend: 'print',
                text: '<i class="fas fa-print"></i> Print',
                                    exportOptions: {
                        columns: ':visible'
                    },
                className: 'btn-sm',
                customize: function (win) {
                    var appliedFilters = '';


                    if (appliedFilters) {
                        appliedFilters = '<div style="text-align: center;">' +
                        '<img src="{{ asset('uploads/business_logos/' . $businessdata->logo) }}" style="max-width: 150px; max-height: 150px;" />' +
                        '<h2 class="text-center mb-3">{{ $businessdata->name }}</h2>' +
                        '<h3 class="mb-3">All Sales</h3>' +
                        '<div style="text-align: left;">' +
                        appliedFilters +
                        '</div>' +
                        '</div>';
                    } else {
                        appliedFilters = '<div style="text-align: center;">' +
                                            '<img src="{{ asset('uploads/business_logos/' . $businessdata->logo) }}" style="max-width: 150px; max-height: 150px;" />' +
                                            '<h2 class="text-center mb-3">{{ $businessdata->name }}</h2>' +
                                            '<h3 class="mb-3">Profit / Loss Report</h3>' +
                                            '</div>';
                    }


                    $(win.document.body).css('font-size', '10pt');
                    $(win.document.body).find('h1, h2').hide();
                    $(win.document.body).find('table').addClass('compact').css('font-size', 'inherit');

                    $(win.document.body).prepend(appliedFilters);

                    var lastTable = $(win.document.body).find('table:last');      
                    
                    lastTable.after(
                        '<div style="text-align: right; margin-top: 40px;">' +
                                    '<p><strong>Authorized Signatory:</strong> ' +' ----------- '+ '</p>');
                }
            },


            {
                text: '<i class="fas fa-columns"></i> Column Visibility',
                className: 'btn-sm',
                action: function (e, dt, node, config) {
                    e.preventDefault();
                    $('.dt-green-colvis-dropdown').remove();
                    var $btn = $(node);
                    var btnOffset = $btn.offset();
                    var btnHeight = $btn.outerHeight();
                    var $dropdown = $('<div>', { class: 'dt-green-colvis-dropdown', css: { position:'absolute', top: btnOffset.top + btnHeight + 6, left: btnOffset.left, minWidth:'240px', maxWidth:'320px', maxHeight:'360px', overflowY:'auto', zIndex:2000, background:'linear-gradient(180deg, #e8f8ec 0%, #c9f0d4 100%)', border:'1px solid #2e7d32', borderRadius:'10px', boxShadow:'0 10px 30px rgba(46,125,50,0.25)', padding:'10px' }});
                    var $title = $('<div>', { text:'Toggle columns', css:{ color:'#1b5e20', fontWeight:700, fontSize:'14px', margin:'4px 8px 10px 8px' } });
                    $dropdown.append($title);
                    dt.columns().every(function (idx) {
                        var column = this; var header = $(column.header()); var title = header.text() || ('Column ' + (idx + 1));
                        if (header.hasClass('no-hide') || header.hasClass('no-export')) { return; }
                        var colId = 'dt-colvis-' + dt.table().node().id + '-' + idx + '-' + Date.now();
                        var $wrap = $('<label>', { for: colId, css:{ display:'flex', alignItems:'center', gap:'8px', padding:'8px 10px', margin:'6px 6px', borderRadius:'8px', border:'1px solid rgba(46,125,50,0.25)', backgroundColor:'rgba(76,175,80,0.06)', cursor:'pointer', transition:'all .15s ease', userSelect:'none' } })
                          .hover(function(){ $(this).css({ backgroundColor:'#2e7d32', color:'#fff', transform:'translateY(-1px)' }); }, function(){ $(this).css({ backgroundColor:'rgba(76,175,80,0.06)', color:'#1b5e20', transform:'none' }); });
                        var $checkbox = $('<input>', { type:'checkbox', id: colId, checked: column.visible(), css:{ width:'18px', height:'18px', accentColor:'#2e7d32', cursor:'pointer' } })
                          .on('change', function(ev){ ev.stopPropagation(); column.visible(this.checked); });
                        var $text = $('<span>', { text: title, css:{ flexGrow:1, fontSize:'13px' } });
                        $wrap.append($checkbox).append($text); $dropdown.append($wrap);
                    });
                    $('body').append($dropdown);
                    var hideTimeout; function scheduleHide(){ hideTimeout = setTimeout(removeDropdown, 300); } function cancelHide(){ if (hideTimeout){ clearTimeout(hideTimeout); hideTimeout=null; } } function removeDropdown(){ $(document).off('mousedown.dtGreenColvis'); $dropdown.remove(); }
                    $dropdown.on('mouseenter', cancelHide).on('mouseleave', scheduleHide); $btn.on('mouseenter', cancelHide).on('mouseleave', scheduleHide);
                    $(document).on('mousedown.dtGreenColvis', function(evt){ if (!$(evt.target).closest('.dt-green-colvis-dropdown').length && !$(evt.target).closest(node).length){ removeDropdown(); } });
                }
            },

            {
                extend: 'pdf',
                text: '<i class="fas fa-file-pdf"></i> Export PDF',
                className: 'btn-sm',
                exportOptions: {
                    columns: ':visible'
                }
            },
      
        ],
                        buttons: [
            {
                extend: 'csv',
                text: '<i class="fa fa-file-csv"></i> Export to Csv',
                className: 'btn-sm',
                exportOptions: {
                    columns: ':visible'
                }
            },
            {
                extend: 'excel',
                text: '<i class="fas fa-file-excel"></i> Export to Excel',
                className: 'btn-sm',
                exportOptions: {
                    columns: ':visible'
                }
            },
            {
            extend: 'print',
                text: '<i class="fas fa-print"></i> Print',
                                    exportOptions: {
                        columns: ':visible'
                    },
                className: 'btn-sm',
                customize: function (win) {
                    var appliedFilters = '';


                    if (appliedFilters) {
                        appliedFilters = '<div style="text-align: center;">' +
                        '<img src="{{ asset('uploads/business_logos/' . $businessdata->logo) }}" style="max-width: 150px; max-height: 150px;" />' +
                        '<h2 class="text-center mb-3">{{ $businessdata->name }}</h2>' +
                        '<h3 class="mb-3">All Sales</h3>' +
                        '<div style="text-align: left;">' +
                        appliedFilters +
                        '</div>' +
                        '</div>';
                    } else {
                        appliedFilters = '<div style="text-align: center;">' +
                                            '<img src="{{ asset('uploads/business_logos/' . $businessdata->logo) }}" style="max-width: 150px; max-height: 150px;" />' +
                                            '<h2 class="text-center mb-3">{{ $businessdata->name }}</h2>' +
                                            '<h3 class="mb-3">Profit / Loss Report</h3>' +
                                            '</div>';
                    }


                    $(win.document.body).css('font-size', '10pt');
                    $(win.document.body).find('h1, h2').hide();
                    $(win.document.body).find('table').addClass('compact').css('font-size', 'inherit');

                    $(win.document.body).prepend(appliedFilters);

                    var lastTable = $(win.document.body).find('table:last');      
                    
                    lastTable.after(
                        '<div style="text-align: right; margin-top: 40px;">' +
                                    '<p><strong>Authorized Signatory:</strong> ' +' ----------- '+ '</p>');
                }
            },


            {
                text: '<i class="fas fa-columns"></i> Column Visibility',
                className: 'btn-sm',
                action: function (e, dt, node, config) {
                    e.preventDefault();
                    $('.dt-green-colvis-dropdown').remove();
                    var $btn = $(node);
                    var btnOffset = $btn.offset();
                    var btnHeight = $btn.outerHeight();
                    var $dropdown = $('<div>', { class: 'dt-green-colvis-dropdown', css: { position:'absolute', top: btnOffset.top + btnHeight + 6, left: btnOffset.left, minWidth:'240px', maxWidth:'320px', maxHeight:'360px', overflowY:'auto', zIndex:2000, background:'linear-gradient(180deg, #e8f8ec 0%, #c9f0d4 100%)', border:'1px solid #2e7d32', borderRadius:'10px', boxShadow:'0 10px 30px rgba(46,125,50,0.25)', padding:'10px' }});
                    var $title = $('<div>', { text:'Toggle columns', css:{ color:'#1b5e20', fontWeight:700, fontSize:'14px', margin:'4px 8px 10px 8px' } });
                    $dropdown.append($title);
                    dt.columns().every(function (idx) {
                        var column = this; var header = $(column.header()); var title = header.text() || ('Column ' + (idx + 1));
                        if (header.hasClass('no-hide') || header.hasClass('no-export')) { return; }
                        var colId = 'dt-colvis-' + dt.table().node().id + '-' + idx + '-' + Date.now();
                        var $wrap = $('<label>', { for: colId, css:{ display:'flex', alignItems:'center', gap:'8px', padding:'8px 10px', margin:'6px 6px', borderRadius:'8px', border:'1px solid rgba(46,125,50,0.25)', backgroundColor:'rgba(76,175,80,0.06)', cursor:'pointer', transition:'all .15s ease', userSelect:'none' } })
                          .hover(function(){ $(this).css({ backgroundColor:'#2e7d32', color:'#fff', transform:'translateY(-1px)' }); }, function(){ $(this).css({ backgroundColor:'rgba(76,175,80,0.06)', color:'#1b5e20', transform:'none' }); });
                        var $checkbox = $('<input>', { type:'checkbox', id: colId, checked: column.visible(), css:{ width:'18px', height:'18px', accentColor:'#2e7d32', cursor:'pointer' } })
                          .on('change', function(ev){ ev.stopPropagation(); column.visible(this.checked); });
                        var $text = $('<span>', { text: title, css:{ flexGrow:1, fontSize:'13px' } });
                        $wrap.append($checkbox).append($text); $dropdown.append($wrap);
                    });
                    $('body').append($dropdown);
                    var hideTimeout; function scheduleHide(){ hideTimeout = setTimeout(removeDropdown, 300); } function cancelHide(){ if (hideTimeout){ clearTimeout(hideTimeout); hideTimeout=null; } } function removeDropdown(){ $(document).off('mousedown.dtGreenColvis'); $dropdown.remove(); }
                    $dropdown.on('mouseenter', cancelHide).on('mouseleave', scheduleHide); $btn.on('mouseenter', cancelHide).on('mouseleave', scheduleHide);
                    $(document).on('mousedown.dtGreenColvis', function(evt){ if (!$(evt.target).closest('.dt-green-colvis-dropdown').length && !$(evt.target).closest(node).length){ removeDropdown(); } });
                }
            },

            {
                extend: 'pdf',
                text: '<i class="fas fa-file-pdf"></i> Export PDF',
                className: 'btn-sm',
                exportOptions: {
                    columns: ':visible'
                }
            },
      
        ],
                        footerCallback: function ( row, data, start, end, display ) {
                            var total_profit = 0;
                            for (var r in data){
                                total_profit += $(data[r].gross_profit).data('orig-value') ? 
                                parseFloat($(data[r].gross_profit).data('orig-value')) : 0;
                            }

                            $('#profit_by_date_table .footer_total').html(__currency_trans_from_en(total_profit));
                        },
                    });
                } else {
                    profit_by_date_datatable.ajax.reload();
                }
            } else if (target == '#profit_by_customer') {
                if(typeof profit_by_customers_table == 'undefined') {
                    profit_by_customers_table = $('#profit_by_customer_table').DataTable({
                        processing: true,
                        serverSide: true,
                        "ajax": {
                            "url": "/reports/get-profit/customer",
                            "data": function ( d ) {
                                d.start_date = $('#profit_loss_date_filter')
                                    .data('daterangepicker')
                                    .startDate.format('YYYY-MM-DD');
                                d.end_date = $('#profit_loss_date_filter')
                                    .data('daterangepicker')
                                    .endDate.format('YYYY-MM-DD');
                                d.location_id = $('#profit_loss_location_filter').val();
                            }
                        },
                        columns: [
                            { data: 'customer', name: 'CU.name'  },
                            { data: 'gross_profit', "searchable": false},
                        ],
                        buttons: [
            {
                extend: 'csv',
                text: '<i class="fa fa-file-csv"></i> Export to Csv',
                className: 'btn-sm',
                exportOptions: {
                    columns: ':visible'
                }
            },
            {
                extend: 'excel',
                text: '<i class="fas fa-file-excel"></i> Export to Excel',
                className: 'btn-sm',
                exportOptions: {
                    columns: ':visible'
                }
            },
            {
            extend: 'print',
                text: '<i class="fas fa-print"></i> Print',
                                    exportOptions: {
                        columns: ':visible'
                    },
                className: 'btn-sm',
                customize: function (win) {
                    var appliedFilters = '';


                    if (appliedFilters) {
                        appliedFilters = '<div style="text-align: center;">' +
                        '<img src="{{ asset('uploads/business_logos/' . $businessdata->logo) }}" style="max-width: 150px; max-height: 150px;" />' +
                        '<h2 class="text-center mb-3">{{ $businessdata->name }}</h2>' +
                        '<h3 class="mb-3">All Sales</h3>' +
                        '<div style="text-align: left;">' +
                        appliedFilters +
                        '</div>' +
                        '</div>';
                    } else {
                        appliedFilters = '<div style="text-align: center;">' +
                                            '<img src="{{ asset('uploads/business_logos/' . $businessdata->logo) }}" style="max-width: 150px; max-height: 150px;" />' +
                                            '<h2 class="text-center mb-3">{{ $businessdata->name }}</h2>' +
                                            '<h3 class="mb-3">Profit / Loss Report</h3>' +
                                            '</div>';
                    }


                    $(win.document.body).css('font-size', '10pt');
                    $(win.document.body).find('h1, h2').hide();
                    $(win.document.body).find('table').addClass('compact').css('font-size', 'inherit');

                    $(win.document.body).prepend(appliedFilters);

                    var lastTable = $(win.document.body).find('table:last');      
                    
                    lastTable.after(
                        '<div style="text-align: right; margin-top: 40px;">' +
                                    '<p><strong>Authorized Signatory:</strong> ' +' ----------- '+ '</p>');
                }
            },


            {
                text: '<i class="fas fa-columns"></i> Column Visibility',
                className: 'btn-sm',
                action: function (e, dt, node, config) {
                    e.preventDefault();
                    $('.dt-green-colvis-dropdown').remove();
                    var $btn = $(node);
                    var btnOffset = $btn.offset();
                    var btnHeight = $btn.outerHeight();
                    var $dropdown = $('<div>', { class: 'dt-green-colvis-dropdown', css: { position:'absolute', top: btnOffset.top + btnHeight + 6, left: btnOffset.left, minWidth:'240px', maxWidth:'320px', maxHeight:'360px', overflowY:'auto', zIndex:2000, background:'linear-gradient(180deg, #e8f8ec 0%, #c9f0d4 100%)', border:'1px solid #2e7d32', borderRadius:'10px', boxShadow:'0 10px 30px rgba(46,125,50,0.25)', padding:'10px' }});
                    var $title = $('<div>', { text:'Toggle columns', css:{ color:'#1b5e20', fontWeight:700, fontSize:'14px', margin:'4px 8px 10px 8px' } });
                    $dropdown.append($title);
                    dt.columns().every(function (idx) {
                        var column = this; var header = $(column.header()); var title = header.text() || ('Column ' + (idx + 1));
                        if (header.hasClass('no-hide') || header.hasClass('no-export')) { return; }
                        var colId = 'dt-colvis-' + dt.table().node().id + '-' + idx + '-' + Date.now();
                        var $wrap = $('<label>', { for: colId, css:{ display:'flex', alignItems:'center', gap:'8px', padding:'8px 10px', margin:'6px 6px', borderRadius:'8px', border:'1px solid rgba(46,125,50,0.25)', backgroundColor:'rgba(76,175,80,0.06)', cursor:'pointer', transition:'all .15s ease', userSelect:'none' } })
                          .hover(function(){ $(this).css({ backgroundColor:'#2e7d32', color:'#fff', transform:'translateY(-1px)' }); }, function(){ $(this).css({ backgroundColor:'rgba(76,175,80,0.06)', color:'#1b5e20', transform:'none' }); });
                        var $checkbox = $('<input>', { type:'checkbox', id: colId, checked: column.visible(), css:{ width:'18px', height:'18px', accentColor:'#2e7d32', cursor:'pointer' } })
                          .on('change', function(ev){ ev.stopPropagation(); column.visible(this.checked); });
                        var $text = $('<span>', { text: title, css:{ flexGrow:1, fontSize:'13px' } });
                        $wrap.append($checkbox).append($text); $dropdown.append($wrap);
                    });
                    $('body').append($dropdown);
                    var hideTimeout; function scheduleHide(){ hideTimeout = setTimeout(removeDropdown, 300); } function cancelHide(){ if (hideTimeout){ clearTimeout(hideTimeout); hideTimeout=null; } } function removeDropdown(){ $(document).off('mousedown.dtGreenColvis'); $dropdown.remove(); }
                    $dropdown.on('mouseenter', cancelHide).on('mouseleave', scheduleHide); $btn.on('mouseenter', cancelHide).on('mouseleave', scheduleHide);
                    $(document).on('mousedown.dtGreenColvis', function(evt){ if (!$(evt.target).closest('.dt-green-colvis-dropdown').length && !$(evt.target).closest(node).length){ removeDropdown(); } });
                }
            },

            {
                extend: 'pdf',
                text: '<i class="fas fa-file-pdf"></i> Export PDF',
                className: 'btn-sm',
                exportOptions: {
                    columns: ':visible'
                }
            },
      
        ],
                        footerCallback: function ( row, data, start, end, display ) {
                            var total_profit = 0;
                            for (var r in data){
                                total_profit += $(data[r].gross_profit).data('orig-value') ? 
                                parseFloat($(data[r].gross_profit).data('orig-value')) : 0;
                            }

                            $('#profit_by_customer_table .footer_total').html(__currency_trans_from_en(total_profit));
                        },
                    });
                } else {
                    profit_by_customers_table.ajax.reload();
                }
            } else if (target == '#profit_by_day') {
                var start_date = $('#profit_loss_date_filter')
                                    .data('daterangepicker')
                                    .startDate.format('YYYY-MM-DD');

                var end_date = $('#profit_loss_date_filter')
                                    .data('daterangepicker')
                                    .endDate.format('YYYY-MM-DD');
                var location_id = $('#profit_loss_location_filter').val();

                var url = '/reports/get-profit/day?start_date=' + start_date + '&end_date=' + end_date + '&location_id=' + location_id;
                $.ajax({
                        url: url,
                        dataType: 'html',
                        success: function(result) {
                           $('#profit_by_day').html(result); 
                            profit_by_days_table = $('#profit_by_day_table').DataTable({
                                    "searching": false,
                                    'paging': false,
                                    'ordering': false,
                            });

                            var total_profit = sum_table_col($('#profit_by_day_table'), 'gross-profit');
                           $('#profit_by_day_table .footer_total').text(total_profit);
                            __currency_convert_recursively($('#profit_by_day_table'));
                        },
                    });
            } else if (target == '#profit_by_products') {
                profit_by_products_table.ajax.reload();
            }
        });

        $(document).on('change', '#sell_list_filter_payment_status, #created_by, #sales_cmsn_agnt, #service_staffs, #shipping_status, #sell_list_filter_source, #payment_method',  function() {
            profit_by_invoice_datatable.ajax.reload();
    });
    });
</script>

@endsection