@extends('admin.layout.master')
@section('title', __('obs.order'))
@section('custom_style')
    @include('inventory.blade_styles.posting_blade_css')
@endsection
@section('content')
    <div id="order_list_blade" class="cl-card card">
        <div class="card-header d-flex justify-content-between align-items-center">
            <h4 class="card-title m-0">{{__('obs.order')}}</h4>
        </div>
        <div class="card-body">
            <div class="row">
                {{-- <div class="col-xl-2 col-md-3 col-sm-4 col-6">
                    <label for="tran_type" class="form-label cl-form-label">{{__('obs.type')}}</label>
                    <select class="select_2 form-select cl-form-select" name="tran_type" id="tran_type"
                        NsModelBind="dataObj.tran_type">
                        <option value="3">{{__('obs.order')}}</option>
                        <option value="4">{{__('obs.orders_return')}}</option>
                    </select>
                </div> --}}
                <div class="col-xl-2 col-md-3 col-sm-4 col-6">
                    <label for="order_no" class="form-label cl-form-label">{{__('obs.order_no')}}</label>
                    <input type="text" id="order_no" name="order_no" class="form-control cl-form-control" NsModelBind="dataObj.order_no">
                </div>

                <div class="col-xl-2 col-md-3 col-sm-4 col-6">
                    <label for="party_id" class="form-label cl-form-label">{{__('obs.customer')}}</label>
                    @include('v2.inventory.global.party_live_dd', [
                        'type' => 2,
                        'binder' => 'dataObj.party_id',
                        'allow_clear'=> true,
                        'skip_add_new'=> 1,
                        'id'=> 'customer_id',
                        'name'=> 'customer_id',
                    ])
                </div>

                <div class="col-xl-2 col-md-3 col-sm-4 col-6">
                    <label for="delivery_status" class="form-label cl-form-label">{{__('obs.order_status')}}</label>
                    <select class="select_2 form-select cl-form-select" NsModelBind="dataObj.delivery_status" name="delivery_status" id="delivery_status">
                        {{-- <option value="">ALL</option> --}}
                        <option value="0">{{__('obs.pending')}}</option>
                        <option value="2">{{__('obs.delivered')}}</option>
                        <option value="1"> {{__('obs.rejected')}}</option>
                    </select>
                </div>

                <div class="col-xl-2 col-md-3 col-sm-4 col-6">
                    <label for="date_from" class="form-label cl-form-label">{{__('obs.date_from')}}</label>
                    <input type="text" id="date_from" name="date_from" NsModelBind="dataObj.date_from"
                        class="form-control date-picker cl-form-control" value="{{ date('d-m-Y') }}" />
                </div>
                <div class="col-xl-2 col-md-3 col-sm-4 col-6">
                    <label for="date_to" class="form-label cl-form-label">{{__('obs.date_to')}}</label>
                    <input type="text" id="date_to" name="date_to" NsModelBind="dataObj.date_to"
                        class="form-control date-picker cl-form-control" value="{{ date('d-m-Y') }}" />
                </div>
                <div class="col text-center mt-2">
                    {{-- <label for="" class="d-block">&nbsp;</label> --}}
                    <button type="button" class="btn btn-coral cl-btn" onclick="getOrderInvoices()">{{__('obs.filter')}}</button>
                </div>
            </div>
            
            {{-- <button type="button" class="btn btn-primary" onclick="gotoPaymentReceive()">Receive</button> --}}
            <div class="cl-table-container mt-3" id="div_tbl" style="max-height: calc(100vh - 190px);">
                <table class="table mb-0 rounded-2 cl-bg-gray-100 cl-table table-bordered">
                    <thead>
                        <th>#</th>
                        <th>{{__('obs.order_no')}}</th>
                        <th>{{__('obs.date')}}</th>
                        <th>{{__('obs.customer_name')}}</th>
                        <th>{{__('obs.delivery_status')}}</th>
                        <th>{{__('obs.approval_status')}}</th>
                        <th>{{__('obs.action')}}</th>
                    </thead>
                </table>
            </div>
        </div>
    </div>
@endsection
@section('script')
    <script>
        dataObj = {
            tran_type: 14,
            party_id: null,
            order_no: '',
            delivery_status: 0,
            date_from: date_picker_instances[0].element.value,
            date_to: date_picker_instances[1].element.value
        }

        $(document).ready(function() { });

        const getOrderInvoices = () => {
            ajaxCallV2('/inventory/order/list', 'GET', dataObj, (html) => {
                $('#div_tbl').html(html);
                $('#order_table').dataTable({
                    // "order": [[1, 'asc']], // sort by 2nd column initially
                    // "columnDefs": [
                    //     { "orderable": false, "targets": 0 } // disable sorting on first column (index 0)
                    // ],
                    drawCallback: function () {
                        var api = this.api();
                        $('#net_total').html(parseFloat(api.column(4, {page:'current'} ).data().sum()).toFixed(2));
                    }
                });
                reInitializeFixedCellTable();
                $('#loader').hide();
            });
        }

        const rejectOrder = (id) => {
            if (confirm('Are you sure, want to Reject this?')) {
                ajaxCallV2('/inventory/order/reject', 'POST', {id: id}, (res) => getOrderInvoices());
            }
        }
    </script>
@endsection