@extends('layout.app')
@section('content')
    <div class="col-md-12 col-lg-12">
        <div class="card crm-list-card">
            <div class="card-header crm-list-header">
                <h3 class="card-title"><i class="fas fa-exchange-alt"></i> 6.4 Lịch sử nhập, xuất kho</h3>
                {{-- Mở modal #add_new (history_depot/_form) để tạo phiếu nhập / xuất kho --}}
                <a class="btn btn-primary" href="javascript:void(0)" data-toggle="modal" data-target="#add_new"><i class="fa fa-plus-circle"></i> Tạo mới</a>
            </div>
            {!! Form::open(array('url' => url()->current(), 'method' => 'get', 'id'=> 'gridForm','role'=>'form')) !!}
            {{-- Form #gridForm submit bằng AJAX (layout/_script.blade.php) -> nạp lại #registration-form --}}
            <div class="crm-list-toolbar">
                @if(empty($checkRole))
                    <div class="crm-list-toolbar__filter">
                        {!! Form::select('branch_id', $deposts, null, array('class' => 'form-control square','placeholder'=>'--Chọn kho--')) !!}
                    </div>
                @endif
                <div class="crm-list-toolbar__filter">
                    {!! Form::select('status', $status, null, array('class' => 'form-control square','placeholder'=>'--Nghiệp vụ kho--')) !!}
                </div>
                <div class="crm-list-toolbar__filter">
                    {!! Form::select('product_id', $products, null, array('class' => 'form-control square select2','data-placeholder'=>'--Chọn sản phẩm--')) !!}
                </div>
                <div class="crm-list-toolbar__filter crm-list-toolbar__action">
                    <button type="submit" class="btn btn-primary"><i class="fas fa-search"></i> Tìm kiếm
                    </button>
                </div>
            </div>
            {{ Form::close() }}
            @include('history_depot.ajax')
            @include('history_depot._form')
            {{--@include('backend.history_depot.import')--}}
        </div>
    </div>
    <script>

        // $("#gridForm").submit(function (e, page) {
        //     console.log('aaaa');
        //
        //     $.get($(this).attr('action'), $(this).serialize(), function (data) {
        //         console.log(data,'aaaa');
        //         $('.table-responsive').html(data);
        //     })
        // })

        $('document').ready(function () {
            $('#depot_id').change(function () {
                $('.list-product').html('');
                let html = '';
                $.ajax({
                    url:'/ajax/product-depot/' + $(this).val(),
                    success:function (data) {
                        html = '<option value="">--Chọn sản phẩm--</option>';
                        let product_id = $(document).find('.products')

                        if(data.product.length > 0){
                            data.product.forEach(function (item) {
                                html += `
                                <option value="`+item.id+`">`+item.name+`</option>
                            `
                            })

                        } else {
                            html = '';
                        }
                        product_id.html(html)
                    }

                })
            })

            $('#product_id').change(function () {
                let id = $(this).val();
                if (!id) return false;
                var text = $(this).find(":selected").text();
                var html = `<tr>
                <input type="hidden" name="product[]" value="` + id + `">
                <td><span id="">` + text + `</span></td>
                <td style="width: 30%;">
                    <input type="text" maxlength="5" class="form-control text-center txt-dotted" name="quantity[]">
                </td>
            </tr>`;
                $('.list-product').append(html);
            })
        })

        $().ready(function () {
            $("#validateForm").validate({
                rules: {
                    depot_id: 'required',
                    status: 'required',
                    note: 'required',
                    // product_id: 'required',
                },
                messages: {
                    depot_id: "Vui lòng chọn kho !",
                    status: "Vui lòng chọn nghiệp vụ !",
                    note: "Vui lòng nhập ghi chú !"
                    // code: "Vui lòng nhập mã !"
                }
            })
        });
        $(document).on('change', '.type, .name', function () {
            $('#gridForm').submit();
        });
    </script>
@endsection