@extends('admin.layout.master')
@section('title','PURCHASE')
@section('custom_style')
    <style>
        .table {
            border: 1px solid black;
        }
        .table th,
        .table td {
            padding: 0rem;
            padding-left: 0.35rem;
            padding-right: 0.35rem;
            border: 1px solid black;
        }
        .table td {
            color: black;
        }
        .table th {
            background: var(--tableHeader);
            padding: 5px !important;
            color: white !important;
        }
        .custom-td {
            white-space:pre-wrap;
            word-wrap:break-word;
        }
    </style>
@endsection
@section ('content')
    <div class="card sina-card">
        <div class="card-header card-header-s d-flex flex-wrap align-items-center">
            <h4 class="col-6 pl-0">{{__('obs.purchase')}} {{__('obs.test')}} {{__('obs.list')}}</h4>
            <div  class="col-6 d-flex justify-content-end">
                @if(checkAuthPermission('purchase.create'))
                <a href="{{route('purchase.create')}}" class="btn-sina-title-add d-flex align-items-center" type="button" name="button">
                    <div class="col pl-0 pr-2">
                        <i class="fas fa-plus-circle"></i>
                    </div>
                    <div class="">  {{__('obs.add')}} {{__('obs.new')}} </div>
                </a>
                @endif
            </div>
        </div>
        <div class="card-body">
            <form method="post" name="filter_form" id="filter_form">
                @csrf
                <input type="hidden" name="index" id="index" value="1">
                {{-- <div class="row mb-1"> --}}
                    <div class="d-flex flex-wrap justify-content-center">
                        <div class="col-md-2 col-12 flex-wrap pr-0 mb-2">
                            <label for="tran_type">{{__('obs.type')}}</label>
                            <select class="select2 form-control" style="width: 100%" name="tran_type" id="tran_type">
                                <option value="1">{{__('obs.purchase')}}</option>
                                <option value="2">{{__('obs.purchase')}} {{__('obs.return')}}</option>
                                <option value="13">{{__('obs.opening')}}</option>
                            </select>
                        </div>
                        <div class="col-md-2 col-12 flex-wrap pr-0 mb-2">
                            <label for="pay_status">{{__('obs.paid')}} {{__('obs.status')}}</label>
                            <select class="select2 form-control" style="width: 100%" name="pay_status" id="pay_status">
                                <option value=" ">{{__('obs.all')}}</option>
                                <option value="0">{{__('obs.unpaid')}}</option>
                                <option value="1">{{__('obs.partial')}} {{__('obs.paid')}}</option>
                                <option value="2">{{__('obs.paid')}}</option>
                            </select>
                        </div>
                        <div class="col-md-2 col-12 flex-wrap pr-0 mb-2">
                            <label for="party_id">{{__('obs.vendor')}}</label>
                            <select class="select2 @error('party_id') is-invalid @enderror form-control" style="width: 100%" name="party_id" id="party_id">
                                <option value=" ">-- Select --</option>
                                @foreach ($vendors as $vendor)
                                    <option value='{{ $vendor->id }}'>
                                        {{ $vendor->name_eng . ' - ' . $vendor->code }}
                                    </option>
                                @endforeach
                            </select>
                        </div>
                        <div class="col-md-2 col-12 flex-wrap pr-0 mb-2">
                            <label for="inv_no">{{__('obs.invoice')}} {{__('obs.no')}}</label>
                            <input type="text" class="form-control" name="inv_no" id="inv_no">
                        </div>
                        <div class="col-md-2 col-12 flex-wrap pr-0 mb-2">
                            <label for="date_from">{{__('obs.date')}} {{__('obs.from')}}</label>
                            {!!getDateInput('date_from','date_from',Request()->date_from)!!}
                            {{-- <input type="text" class="form-control date_picker_report" name="date_from" id="date_from" value="{{ date('d-m-Y') }}"> --}}
                        </div>
                        <div class="col-md-2 col-12 flex-wrap pr-0 ">
                            <label for="date_to">{{__('obs.date')}} {{__('obs.to')}}</label>
                            {!!getDateInput('date_to','date_to',Request()->date_to)!!}
                            {{-- <input type="text" class="form-control date_picker_report" name="date_to" id="date_to" value="{{ date('d-m-Y') }}"> --}}
                        </div>
                        <div class="col-md-1 col-1 flex-wrap pr-0 text-center pt-2">
                            <button class="btn btn-sm btn-outline-info font-weight-bold d-flex" name="filter" id="filter"><svg xmlns="http://www.w3.org/2000/svg" width="16" height="16" fill="currentColor" class="bi bi-filter pt-1" viewBox="0 0 16 16">
                                <path d="M6 10.5a.5.5 0 0 1 .5-.5h3a.5.5 0 0 1 0 1h-3a.5.5 0 0 1-.5-.5zm-2-3a.5.5 0 0 1 .5-.5h7a.5.5 0 0 1 0 1h-7a.5.5 0 0 1-.5-.5zm-2-3a.5.5 0 0 1 .5-.5h11a.5.5 0 0 1 0 1h-11a.5.5 0 0 1-.5-.5z"/>
                            </svg>&nbsp;{{__('obs.filter')}}</button>
                        </div>
                    </div>
                {{-- </div> --}}
            </form>
            <hr>
            @include('admin.global.loader')
            <div class="table-responsive"  id="div_tbl">
                <table class="table Dtable table-striped table-bordered dataTable no-footer" id="tbl">
                    <thead class="">
                        <tr>
                            <th>#</th>
                            <th>{{__('obs.invoice')}} {{__('obs.no')}}</th>
                            <th>{{__('obs.invoice')}} {{__('obs.date')}}</th>
                            <th>{{__('obs.vendor')}} {{__('obs.name')}}</th>
                            <th>{{__('obs.inv')}} {{__('obs.amount')}}</th>
                            <th>{{__('obs.pay')}} {{__('obs.status')}}</th>
                            <th>{{__('obs.attach')}}</th>
                            <th>{{__('obs.approval')}} {{__('obs.status')}}</th>
                            <th>{{__('obs.status')}}</th>
                            <th>{{__('obs.action')}}</th>
                        </tr>
                    </thead>
                    <tbody id="tbl_body">
                    </tbody>
                </table>
            </div> 
        </div>
    </div>
@endsection

@section('script')
    <script>
        const store_setting = @json(store_info());
        const setting = @json(getDefaultSettings(3));
        var pro_setting = @JSON($pro_setting)
    </script>
    <script type="text/javascript" src="{{ asset('inventory/blade_js/common.js') }}"></script>
    <script type="text/javascript">
        $(document).ready(function(){
            $('.select2').select2(); 
            $('#filter_form').on('submit', function(event) {
                event.preventDefault();
                $('#div_tbl').html('');
                var d = $('#filter_form').serializeArray();
                ajaxCallWithFormData('/purchase-invoice/filter-test', 'POST', new FormData(this), setTableData);
            });
        });

        const setTableData = async (data) => {
            let str = `<table class="table table-striped table-bordered dataTable no-footer" id="tbl">
                <thead class="">
                    <tr>
                        <th class="text-center">#</th>
                        <th class="text-center">Invoice No</th>
                        <th class="text-center">Ref. No</th>
                        <th class="text-center">Invoice Date</th>
                        <th class="text-center">Store</th>
                        <th class="text-center">By</th>
                        <th class="text-center">Vendor Name</th>
                        <th class="text-center">Com.(%)</th>
                        <th class="text-center">Inv Amount</th>
                        <th class="text-center">V. Amount</th>
                        <th class="text-center">Pay Status</th>
                        <th class="text-center">Status</th>
                        <th class="text-center">ACTION</th>
                        
                    </tr>
                </thead>
            <tbody id="tbl_body">`;
            let i = 0;
            for (const row of data) {
                let net = 0;
                let free_flag = 0;
                let dp_flag = 0;
                let dp_prob_pro_ids = '';
                for (const tran of row.transactions) { debugger
                    let price = tran.tp_price;
                    if(tran.quantity > 0 && tran.avg_price == 0 && tran.product.buy_price != 0 && !tran.is_free_or_gift) free_flag = 1;
                    tot = (parseFloat(price)*parseFloat(tran.quantity));
                    pro_net = parseFloat(tot-((tot*parseFloat(tran.dc_price))/100));
                    if(parseFloat(pro_net).toFixed(2) != parseFloat(tot-tran.manual_dc).toFixed(2)) {
                        console.log(parseFloat(pro_net).toFixed(2), parseFloat(tot-tran.manual_dc));
                        dp_flag = 1;
                        dp_prob_pro_ids += `<storng class="text-sm text-danger" title="${tran.product.name_eng}">${tran.product_id}</storng>, `;
                    }
                    net += pro_net;
                }
                str +=`<tr>
                    <td>  ${Number(++i)}</td> 
                    <td>(id- ${row.id}) ${row.invoice_no} ${row.updated_by?'<a href="/admin/log/index?model=App%5CModels%5CInventory%5CStoreInvoice&user_id=&inv_no='+row.invoice_no+'&date_from='+GetFormattedDate(row.date, 'dmy')+'&date_to='+GetFormattedDate(row.updated_at, 'dmy')+'" target="_blank" class="text-sm text-danger">EditeD</a>':''} <strong class="text-sm text-danger">${free_flag == 1 ? '(Free)' : ''}</strong>${dp_flag == 1 ? '<br>(DP-'+dp_prob_pro_ids+')' : ''}</td>
                    <td>${row.ref_invoice??''}</td>
                    <td class="custom-td" style="padding-right: 0.45rem;"> ${(GetFormattedDate(row.date, 'dmy his'))}</td> 
                    <td class="text-center">${row.warehouse.name_eng}</td>
                    <td> ${row.issued_by.name}</td>
                    <td class="custom-td"> ${(row.party != null ? row.party.name_eng : '')} ${ row.same_ref_inv ? '<br>(<a href="/sell-print?id='+row.same_ref_inv.id+'" target="_blank">'+row.same_ref_inv.party.name_eng+'</a>)' : '' }</td>
                    <td class="text-right text-${parseFloat(row.dc_percentage).toFixed(2) != parseFloat(row.party.commission).toFixed(2) ? 'danger' : ''}">${parseFloat(row.dc_percentage).toFixed(2)}</td>
                    <td class="text-right text-${parseFloat(net).toFixed(2) != parseFloat(row.net_total).toFixed(2) ? 'danger' : ''}"   title="${parseFloat(net).toFixed(2)}${'-'+net}">${parseFloat(row.net_total).toFixed(2)}</td>
                    <td class="text-right text-${parseFloat(row.voucher.transaction_amount).toFixed(2) != parseFloat(row.net_total).toFixed(2) ? 'danger' : ''}">${parseFloat(row.voucher.transaction_amount).toFixed(2)}</td>
                    <td  class="text-center"> <span class="badge badge-${(row.pay_status == 0 ? 'danger' : row.pay_status == 1 ? 'warning' : 'success')}"> ${(row.pay_status == 0 ? 'Unpaid' : row.pay_status == 1 ? 'Partial Paid' : 'Paid')}</span> </td>
                    <td class="text-center"> <span class="badge badge-${(row.status == 1 ? 'success' : 'danger')}"> ${(row.status == 1 ? 'Active' : 'Pending')}</span> </td> 
                    <td class="text-center"> <div class="form-group text-center mb-0">`;
                    if (!row.ref_type && (await GetFormattedDate(row.date) > store_setting.block_edit_inv)) {
                        if(row.status != 1 || ((row.transaction_type == 2 && permission_check('purchase-return.edit')) || row.transaction_type != 2 && (permission_check('purchase.edit')))) {
                            str +=`<a href="/purchase${(row.transaction_type==2?"-return":'')}/${row.id}/edit${(row.use_status == 4 ? '?is_dmg=1' : '')}" target="_blank" class="btn btn-hover text-primary p-0" title="Edit"><i class="fas fa-edit"></i></a>`;
                        } 
                    }
                    if(permission_check('purchase.print')) {
                        str +=`<a href="/purchase-print?id=${row.id}${(row.use_status == 4 ? '&is_dmg=1' : '')}" target="_blank" class="btn btn-hover text-info p-0 pl-1" title="Print"><i class="fas fa-print"></i></a>`;
                    } if(setting.print_view != 1) {
                        str += `<a target="_blank" href="/purchase-print?id=${row.id}/&is_pos_print=1" class="btn btn-hover text-info p-0 pl-1" title="POS"><i class="fas fa-vote-yea"></i></a>`;
                    }
                    str +=`</div></td>
                </tr>`;
            }
            $('#div_tbl').html(str + '</tbody> <tfoot><tr> <td colspan="8" class="text-right">Total Net</td> <td class="text-right" id="total"></td> <td colspan="4"></td> </tr></tfoot> </table>');
            $('#tbl').DataTable({
                drawCallback: function () {
                    var api = this.api();
                    $('#total').html(
                        parseFloat(api.column(8, {page:'current'} ).data().sum()).toFixed(2)
                    );
                }
            });
            $('#loader').hide();
        }
            

        function print(inv_id) { 
            var str = '';
            $.ajax({
                url: '/purchase/invoice-transaction/'+inv_id,
                method:"GET", 
                dataType:'JSON', 
                success: function (data) {
                    // alert("success");
                    console.log(data.invoice);
                    $.each(data.invoice.transaction, function(i, row){
                        // var t = i+1; 
                        str += '<tr>'+
                            '<td>'+ (i+1) +'</td>'+
                            '<td>'+row.product.name_eng+'</td>';
                        if(pro_setting.dual_unit != null) {
                            str += '<td class="text-center">'+(row.quantity/row.unit_qty)+'</td>'; 
                        }  
                        str += '<td>'+row.quantity+'</td>';
                        if(pro_setting.dual_unit != null) {
                            str += '<td class="text-center">'+(row.price*row.unit_qty)+'</td>'; 
                        } 
                        str += '<td>'+row.price+'</td>'+
                            '<td>'+row.dc_price+'</td>'+
                            '<td>'+parseFloat(row.avg_price * row.quantity).toFixed(2)+'</td>'+ 
                            '</tr>';
                    }); 
                    str+=  '<tr>'+
                    '    <td colspan="5"><strong>Discount:</strong></td>'+
                    '    <td>TK '+ parseFloat(data.invoice.dc_amount).toFixed(2) +'</td>'+
                    '</tr>'+
                    '<tr>'+
                    '    <td colspan="5"><strong>Other:</strong></td>'+
                    '    <td>TK '+ parseFloat(data.invoice.other_charge).toFixed(2) +'</td>'+
                    '</tr>'+
                    '<tr>'+
                    '    <td colspan="5"><strong>Sub Total:</strong></td>'+
                    '    <td>TK '+ parseFloat(parseFloat(data.invoice.net_total + data.invoice.other_charge)).toFixed(2) +'</td>'+
                    '</tr>';
                    
                    console.log(str);
                    $('#report_bdy').html(str); 
                    // $("#modal").modal('show');
                    $("#printThis").printThis();

                },
                error: function (data) {
                    alert('Something Went Wrong.!');
                    console.log(data);
                }
            });
        
        }
    </script>
@endsection