<div class="col-md-12">    
    <div class="panel panel-white">
        <div class="panel-heading clearfix">
            <h4 class="panel-title "> <?php echo $title;?></h4>
            <div class="row">
                <div class=" col-md-2" >
                    <label><?php print CommonLanguage::getMessage('Date'); ?></label>
                    <input id="From_To_Date" type="text" class="form-control full-width" name="From_To_Date" >
                </div> 
                <div class="  col-md-2 " >
                    <label><?php print CommonLanguage::getMessage('branch'); ?></label>
                    <input class="branch_id full-width" id="branch_id" name="branch_id" type="hidden"  />
                </div>
                <div class="col-md-2">
                    <label><?php print CommonLanguage::getMessage('type'); ?></label>
                    <select id="type" class="full-width" data-init-plugin="select2">
                        <option value="inv"><?php echo CommonLanguage::getMessage('invoice') ?></option>
                        <option value="pur"><?php echo CommonLanguage::getMessage('purchase') ?></option>
                        <option value="rin"><?php echo CommonLanguage::getMessage('customer_return') ?></option>
                        <option value="rpr"><?php echo CommonLanguage::getMessage('vendor_return') ?></option>
                    </select>
                </div>
                <div class="  col-md-2 " >
                    <label id='person_title'><?php print CommonLanguage::getMessage('choose_customer'); ?></label>
                    <input class="search_person full-width" id="search_person" name="search_person" type="hidden"  />
                </div>
                <div class="col-md-2 sales_man_div">
                    <label><?php  echo CommonLanguage::getMessage('salesman');?></label>
                    <input type="hidden" name="sales_man_id" id="sales_man_id" class="full-width"/>
                </div>
                <div class="  col-md-2  " >
                    <label><?php print CommonLanguage::getMessage('foreign'); ?></label>
                    <select id="foreign" class="full-width" data-init-plugin="select2">
                        <option value="both"><?php echo CommonLanguage::getMessage('both')?></option>
                        <option value="0"><?php echo CommonLanguage::getMessage('local')?></option>
                        <option value="1"><?php echo CommonLanguage::getMessage('foreign')?></option>
                    </select>
                </div>
            </div>
        </div>
        <div class="panel-body">
            <div class="row">
                <div class="col-md-12 table-responsive" id="MyTable" >
                    <table class="table table-bordered inventory" id="tableWithSearch" >
                        <thead>
                            <tr>
                                <th class="text-center" style="width:5%" >#</th>
                                <th class="text-center" style="width:10%" ><?php print CommonLanguage::getMessage('Name'); ?></th>
                                <th class="text-center" style="width:10%" ><?php print CommonLanguage::getMessage('Date'); ?></th>
                                <th class="text-center" style="width:10%" ><?php print CommonLanguage::getMessage('due_date'); ?></th>
                                <th class="text-center" style="width:10%" ><?php print CommonLanguage::getMessage('vat'); ?></th>
                                <th class="text-center" style="width:10%" ><?php print CommonLanguage::getMessage('subtotal'); ?></th>
                                <th class="text-center" style="width:10%" ><?php print CommonLanguage::getMessage('total'); ?></th>
                            </tr>
                        </thead>
                        <tbody>
                        </tbody>
                        <tfoot>
                            <th></th><th></th><th></th><th></th>
                            <th><span id='vat'></span>&nbsp;<span><?php echo smc_session()['local_currency_symbol'] ?></span></th>
                            <th><span id='subtotal'></span>&nbsp;<span><?php echo smc_session()['local_currency_symbol'] ?></span></th>
                            <th><span id='nettotal'></span>&nbsp;<span><?php echo smc_session()['local_currency_symbol'] ?></span></th>
                        </tfoot>
                    </table>
                </div>
            </div>
        </div>
    </div>
</div>
<script>
    var is_actual = <?php echo $is_actual ? "true" : "false"; ?>,
        title = <?php echo json_encode(CommonLanguage::getMessage('list')); ?>,
            search_customer = <?php echo json_encode(CommonLanguage::getMessage('choose_customer')); ?>,
                search_supplier = <?php echo json_encode(CommonLanguage::getMessage('choose_supplier')); ?>;
                var today = <?php echo json_encode($today) ?>;
                $(function () {
                    build_select2($('#sales_man_id'), 'xhr/employeeSearch');
                    build_select2($("#search_person"), "xhr/customerSearch");
                    build_select2($("#branch_id"), "xhr/CommonSearch?col_id=branch_id&col_name=branch_name&table=tbl_organization_branches");     
                    ChangeTable();
                    $("input[name=From_To_Date]").daterangepicker({
                    }, function (start, end, label) {
                        window.startDate = start.format("YYYY-MM-DD"),
                            window.endDate = end.format("YYYY-MM-DD")
                        ChangeTable();
                    });
                    $("#type").on("change", function () {
                        $("#search_person").val("").attr("data-select-name", "")
                        if ($(this).val() == 'inv' || $(this).val() == 'rin') {
                            $("#person_title").html(search_customer)
                            build_select2($("#search_person"), "xhr/customerSearch")
                        } else {
                            $("#person_title").html(search_supplier)
                            build_select2($("#search_person"), "xhr/supplierSearch")
                        }
                        $(this).val() == 'pur' ? $('.sales_man_div').addClass('hidden') : $('.sales_man_div').removeClass('hidden');
                        ChangeTable()
                    })
                    $("#search_person,#foreign,#sales_man_id,#branch_id").on("change", function () {
                        ChangeTable()
                    });
                });
    function ChangeTable() {
        var Date = {
            type: $("#type").val(),
            is_actual: is_actual ? 1 : 0,
            person: $("#search_person").val(),
            Date_From: window.startDate ? window.startDate : today,
            Date_To: window.endDate ? window.endDate : today,
            foreign:$("#foreign").val(),
            sales_man_id:$("#sales_man_id").val(),
            branch_id:$("#branch_id").val(),

        };
        $.ajax({
            url: "InventoryAjax/movement_control_total",
            data: Date,
            dataType: 'JSON',
            complete: function (v1, v2) {
                if (v2 == 'success') {
                    var data = v1.responseJSON;
                    //                    console.log(data)
                    RebuildDataTable(title, [0, 1, 2, 3, 4, 5, 6], "InventoryAjax/movement_control", Date, '', [], {
                        initComplete: function (settings, json) {
                            $("#vat").html(AddCommas(parseFloat(data['vat']).toFixed(3)))
                            $("#nettotal").html(AddCommas(parseFloat(data['net_total']).toFixed(3)))
                            $("#subtotal").html(AddCommas(parseFloat(data['subtotal']).toFixed(3)))
                        }
                    })
                }
            }
        })
    }
</script>