@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.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 pt-2">
            <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-3 col-12 flex-wrap pr-0 mb-2">
                            <label for="tran_type">{{__('obs.type')}}</label>
                            <select class="select_2 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-3 col-12 flex-wrap pr-0 mb-2">
                            <label for="pay_status">{{__('obs.paid')}} {{__('obs.status')}}</label>
                            <select class="select_clr form-control" style="width: 100%" name="pay_status" id="pay_status">
                                {{-- <option value=" ">{{__('obs.all')}}</option> --}}
                                <option value=""></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-3 col-12 flex-wrap pr-0 mb-2">
                            <label for="party_id">{{__('obs.vendor')}}</label>
                            <select class="select_2 @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-3 col-12 flex-wrap pr-0 mb-2">
                            <label for="cost_center_id">{{__('obs.cost')}} {{__('obs.center')}}</label>
                            <select class="select_clr form-control" style="width: 100%" name="cost_center_id" id="cost_center_id">
                                <option value=""></option>
                                @foreach ($cost_centers as $cost)
                                    <option value='{{ $cost->id }}'>{{ $cost->name }}</option>
                                @endforeach
                            </select>
                        </div>
                        <div class="col-md-3 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="serial_no">{{__('obs.serial')}} {{__('obs.no')}}</label>
                            <input type="text" class="form-control" name="serial_no" id="serial_no">
                        </div>
                        <div class="col-md-2 col-12 flex-wrap pr-0 mb-2">
                            <label for="date_from">{{__('obs.date')}} {{__('obs.from')}}</label>
                            <input type="text" class="form-control date_picker" 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>
                            <input type="text" class="form-control date_picker" 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">
                            <label for=""></label>
                            <button class="btn btn-sm btn-outline-info font-weight-bold d-flex" style="margin-top: -9px;" 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('inventory.product.purchase.vat_posting_modal')
            <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>
    </script>
    <script type="text/javascript" src="{{ asset('inventory/blade_js/common.js') }}"></script>
    <script type="text/javascript">
        const store_setting = @json(store_info());
        const warehouse_setting = @json(warehouse_info());
        const setting = @json(getDefaultSettings(3));
        var pro_setting = @JSON($pro_setting);

        $(document).ready(function() {
            $('.select_2').select2();
            select2('select_clr');
            $('#filter_form').on('submit', function(event) {
                event.preventDefault();
                $('#div_tbl').html('');
                var d = $('#filter_form').serializeArray();
                ajaxCallWithFormData('/purchase-invoice/filter', 'POST', new FormData(this), setTableData);
            });
            vat_additional['type'] = 1;
            vatInvoiceLiveSearch('vat_ref_invoice');
        });

        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">Ref. Inv</th>
                        <th class="text-center">Invoice Date</th>
                        <th class="text-center">By</th>
                        <th class="text-center">Vendor Name</th>
                        <th class="text-center">Inv Amount</th>
                        <th class="text-center">Pay Status</th>
                        <th class="text-center">Status</th>
                        <th class="text-center">ACTION</th>
                        <th class="text-center">Approval Status</th>
                    </tr>
                </thead>
            <tbody id="tbl_body">`;
            let i = 0;
            for (const row of data.data) {
                str +=`<tr>
                    <td>  ${Number(++i)}</td>
                    <td> ${row.invoice_no}</td>
                    <td>${row.ref_invoice??''}</td>
                    <td>${row.parent_inv?row.parent_inv.invoice_no:''}</td>
                    <td class="custom-td" style="padding-right: 0.45rem;"> ${(GetFormattedDate(row.date, 'dmy his'))}</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"> ${(parseFloat(row.net_total)).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">`;
                    // <td class="text-center"><a href="/storage/${row.attachment}" target="_blank" class="badge badge-dark badge-hover font-weight-bold" style="font-size: 12px">View</a></td>
                    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' : '?tran_type='+row.transaction_type+(row.ref_invoice_id?'&ref_invoice_id='+row.ref_invoice_id:''))}" 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>`;
                    }
                    if(warehouse_setting.is_using_vat == 1) {
                        if(row.vat_invoice){
                            str += `<span class="badge badge-dark">Posted To VAT</span>`;
                        }else{
                            str += `<button onclick="postToVatModalShow(${row.id},${row.transaction_type})" id="postToVat${row.id}" class="btn-xs btn-warning btn-hover ml-1 postToVat" title="Post To VAT">Post To VAT</button>`;
                        }
                    }
                    str +=`</div></td>
                    <td class="text-center" id="approval_input${row.id}">
                        ${data.approvals[row.id]??(row.approve_status == 1 ? '<span class="badge badge-success">Approved</span>' : '')}
                    </td>
                </tr>`;
            }
            $('#div_tbl').html(str + '</tbody> <tfoot><tr> <td colspan="7" class="text-right">Total Net</td> <td class="text-right" id="total"></td> <td colspan="4"></td> </tr></tfoot> </table>');
            await $('#tbl').DataTable({
                drawCallback: function () {
                    var api = this.api();
                    $('#total').html(
                        parseFloat(api.column( 7, {page:'current'} ).data().sum()).toFixed(2)
                    );
                }
            });
            $('select[name="tbl_length"]').append(`<option value="250">250</option><option value="500">500</option>`);
            $('#loader').hide();
        }

        function postToVatModalShow(invoice_id,type){
            if(type == 1){
                $('#ref_invoice_div').hide();
                $('#vat_purchase_type_div').show();
                $('#vat_local_or_import_div').show();
            }
            if(type == 2){
                $('#ref_invoice_div').show();
                $('#vat_purchase_type_div').hide();
                $('#vat_local_or_import_div').hide();
            }

            $('#vat_store_invoice_id').val(invoice_id);
            $('#vat_store_invoice_type').val(type);
            $('.postToVat').attr('disabled', true);
            $(`#postToVat${invoice_id}`).text('VAT Posting');
            $('#postToVAT').modal('show');
        }

        function postToVAT(){
            Swal.fire({
            title: "Posting To VAT",
            html: "Please Wait",
                didOpen: () => {
                    Swal.showLoading()
                }
            });
            let id = $('#vat_store_invoice_id').val();
            let type = $('#vat_local_or_import').val();
            let purchase_type = $('#vat_purchase_type').val();
            let vat_ref_invoice = $('#vat_ref_invoice').val();

            if($('#vat_store_invoice_type').val() == 1){ // purchase
                vat_ref_invoice = null;
            }else{ // return
                type = purchase_type = null;
            }
            let data = {
                id:id,
                type:type,
                purchase_type:purchase_type,
                vat_ref_invoice:vat_ref_invoice
            };
            ajaxCall('/purevat/inv-to-vat-posting', "POST", data, function(res){
                if(res.status != 1){
                    $('#postToVAT').modal('hide');
                    $('#filter').click();
                    callSweetAlert('warning', 'Opps!!', res.msg, 0);
                }else{
                    $('#filter').click();
                    $('#postToVAT').modal('hide');
                    callSweetAlert('success', res.msg, 'Want To Print Invoice', 1, function(){
                        window.open(res.redirect, '_blank');
                    });
                }
            });
        }

        function postToVATModalClose(){
            let id = $('#vat_store_invoice_id').val();
            $(`#postToVat${id}`).text('Post To VAT');
            $('.postToVat').attr('disabled', false);
        }
    </script>
@endsection