@extends('layouts.app')
@section('title', __('lang_v1.serial_report'))

@section('content')

<!-- Content Header (Page header) -->
<section class="content-header">
    <h1>{{ __('lang_v1.serial_report')}}</h1>
</section>

<!-- Main content -->
<section class="content">
    <div class="row">
        <div class="col-md-12">
            @component('components.filters', ['title' => __('report.filters')])
              {!! Form::open(['url' => action([\App\Http\Controllers\ReportController::class, 'getSerialReport']), 'method' => 'get', 'id' => 'serial_report_filter_form' ]) !!}
                
                <div class="col-md-3">
                    <div class="form-group">
                        {!! Form::label('location_id',  __('purchase.business_location') . ':') !!}
                        {!! Form::select('location_id', $business_locations, null, ['class' => 'form-control select2', 'style' => 'width:100%']); !!}
                    </div>
                </div>

                <div class="col-md-3">
                    <div class="form-group">
                        {!! Form::label('category_id', __('category.category') . ':') !!}
                        {!! Form::select('category', $categories, null, ['placeholder' => __('messages.all'), 'class' => 'form-control select2', 'style' => 'width:100%', 'id' => 'category_id']); !!}
                    </div>
                </div>

                <div class="col-md-3">
                    <div class="form-group">
                        {!! Form::label('sub_category_id', __('product.sub_category') . ':') !!}
                        {!! Form::select('sub_category', array(), null, ['placeholder' => __('messages.all'), 'class' => 'form-control select2', 'style' => 'width:100%', 'id' => 'sub_category_id']); !!}
                    </div>
                </div>

                <div class="col-md-3">
                    <div class="form-group">
                        {!! Form::label('brand', __('product.brand') . ':') !!}
                        {!! Form::select('brand', $brands, null, ['placeholder' => __('messages.all'), 'class' => 'form-control select2', 'style' => 'width:100%']); !!}
                    </div>
                </div>

                <div class="col-md-3">
                    <div class="form-group">
                        {!! Form::label('unit',__('product.unit') . ':') !!}
                        {!! Form::select('unit', $units, null, ['placeholder' => __('messages.all'), 'class' => 'form-control select2', 'style' => 'width:100%']); !!}
                    </div>
                </div>

                <div class="col-md-3">
                    <div class="form-group">
                        {!! Form::label('serial_number', __('lang_v1.serial_number') . ':') !!}
                        {!! Form::text('serial_number', null, ['class' => 'form-control', 'placeholder' => __('lang_v1.serial_number')]); !!}
                    </div>
                </div>

                <div class="col-md-3">
                    <div class="form-group">
                        {!! Form::label('supplier_id', __('report.supplier') . ':') !!}
                        {!! Form::select('supplier_id', $suppliers, null, ['placeholder' => __('messages.all'), 'class' => 'form-control select2', 'style' => 'width:100%']); !!}
                    </div>
                </div>

                <div class="col-md-3">
                    <div class="form-group">
                        {!! Form::label('customer_id', __('report.customer') . ':') !!}
                        {!! Form::select('customer_id', $customers, null, ['placeholder' => __('messages.all'), 'class' => 'form-control select2', 'style' => 'width:100%']); !!}
                    </div>
                </div>

                 <div class="col-md-3">
                    <div class="form-group">
                        {!! Form::label('status', __('sale.status') . ':') !!}
                        {!! Form::select('status', ['in_stock' => __('lang_v1.in_stock'), 'sold' => __('lang_v1.sold'), 'returned' => __('lang_v1.returned')], null, ['placeholder' => __('messages.all'), 'class' => 'form-control select2', 'style' => 'width:100%']); !!}
                    </div>
                </div>
                
                <div class="col-md-3">
                    <div class="form-group">
                         {!! Form::label('serial_report_date_range', __('report.date_range') . ':') !!}
                        {!! Form::text('date_range', null, ['placeholder' => __('lang_v1.select_a_date_range'), 'class' => 'form-control', 'id' => 'serial_report_date_range', 'readonly']); !!}
                    </div>
                </div>


                {!! Form::close() !!}
            @endcomponent
        </div>
    </div>
    <div class="row">
        <div class="col-md-12">
            @component('components.widget', ['class' => 'box-primary'])
            <div class="table-responsive">
                <table class="table table-bordered table-striped" id="serial_report_table">
                    <thead>
                        <tr>
                            <th>@lang('business.product')</th>
                            <th>@lang('lang_v1.serial_number')</th>
                            <th>@lang('purchase.purchase_details')</th>
                            <th>Stock Details</th>
                            <th>@lang('sale.sale') Details</th>
                            <th>Warranty Details</th>
                            <th>Action</th>
                             <th>Status</th>
                             <th>Profit</th>
                        </tr>
                    </thead>
                </table>
            </div>
            @endcomponent
        </div>
    </div>
    </div>
</section>
<!-- /.content -->

@endsection

@section('javascript')
    <script src="{{ asset('js/report.js?v=' . $asset_v) }}"></script>
    <script type="text/javascript">
        $(document).ready(function(){
            if($('#serial_report_date_range').length == 1){
                $('#serial_report_date_range').daterangepicker(
                    dateRangeSettings, 
                    function(start, end) {
                        $('#serial_report_date_range').val(
                            start.format(moment_date_format) + ' ~ ' + end.format(moment_date_format)
                        );
                        serial_report_table.ajax.reload();
                    }
                );
                $('#serial_report_date_range').on('cancel.daterangepicker', function(ev, picker) {
                    $('#serial_report_date_range').val('');
                    serial_report_table.ajax.reload();
                });
                $('#serial_report_date_range').val('');
            }

            serial_report_table = $('#serial_report_table').DataTable({
                processing: true,
                serverSide: true,
                ajax: {
                    url: '{{action([\App\Http\Controllers\ReportController::class, 'getSerialReport'])}}',
                    data: function(d) {
                        d.location_id = $('select[name="location_id"]').val();
                        d.category_id = $('select#category_id').val();
                        d.sub_category_id = $('select#sub_category_id').val();
                        d.brand_id = $('select[name="brand"]').val();
                        d.unit_id = $('select[name="unit"]').val();
                        d.serial_number = $('input[name="serial_number"]').val();
                        d.supplier_id = $('select[name="supplier_id"]').val();
                        d.customer_id = $('select[name="customer_id"]').val();
                         d.status = $('select[name="status"]').val();

                        var start = '';
                        var end = '';
                        if($('#serial_report_date_range').val()){
                            start = $('input#serial_report_date_range').data('daterangepicker').startDate.format('YYYY-MM-DD');
                            end = $('input#serial_report_date_range').data('daterangepicker').endDate.format('YYYY-MM-DD');
                        }
                        d.start_date = start;
                        d.end_date = end;
                    }
                },
                columns: [
                    { data: 'product_name', name: 'products.name' },
                    { data: 'serial_number', name: 'serial_numbers.serial_number' },
                    { data: 'purchase_info', name: 'purchase_t.ref_no', searchable: false },
                    { data: 'stock_info', name: 'bl.name', searchable: false},
                    { data: 'sale_info', name: 'sale_t.invoice_no', searchable: false },
                    { data: 'warranty_details', name: 'warranty_details', searchable: false, orderable: false },
                    { data: 'action', name: 'action', searchable: false, orderable: false },
                    { data: 'stock_status', name: 'serial_numbers.stock_status' },
                    { data: 'profit', name: 'profit', searchable: false, orderable: false },
                ],
                fnDrawCallback: function(oSettings) {
                    __currency_convert_recursively($('#serial_report_table'));
                },
            });

            $(document).on('change', '#serial_report_filter_form select, #serial_report_filter_form input', function() {
                serial_report_table.ajax.reload();
            });
        });
    </script>
@endsection