@extends('layouts.layout')

@section('body_class', 'nav-md')

@section('body_content')
    <div class="container body">
        <div class="main_container">
            @include('includes.sidebar')
            <div class="right_col" role="main">
                <div class="page-title">
                    <div class="title_left">
                        <div class="row">
                            <div class="col-xs-6 col-sm-6 col-md-6">
                                <h2 class="title-dashboard text-left">
                                    <h3><i class="fa fa-file-text"></i> Report Mutasi Harga COGS</h3>
                                </h2>
                            </div>
                            <div class="clearfix"></div>
                        </div>
                    </div>
                </div>
                <style>
                    .bottom-align {
                        vertical-align: bottom;
                    }
                </style>

                <div class="row">
                    <div class="col-xs-12 col-sm-12">
                        <div class="x_title">
                            Filter
                        </div>
                        <div class="x_content">
                            <form action="{{ route('stock/report_price_cogs_mutation') }}" method="GET" class="form-horizontal" id="form-search">
                                <div class="col-xs-12 col-sm-12">
                                    <div class="form-group">
                                        <label class="col-xs-12 col-sm-4 control-label">Date From</label>
                                        <div class="col-xs-8 col-sm-4">
                                            <input type="date" name="date_from" value="{{ $request['date_from'] }}" class="form-control">
                                          
                                        </div>
                                    </div>
                                    <div class="form-group">
                                        <label class="col-xs-12 col-sm-4 control-label">Date To</label>
                                        <div class="col-xs-8 col-sm-4">
                                            <input type="date" name="date_to" value="{{ $request['date_to'] }}" class="form-control">
                                        </div>
                                    </div>

                                    <div class="form-group">
                                        <label class="col-xs-12 col-sm-4 control-label">Brand Emas</label>
                                        <div class="col-xs-8 col-sm-4">
                                            <select name="brand" id="brand" class="form-control">
                                                <option value="">-- Pilih Brand --</option>
                                                @foreach ($brands as $data)
                                                    <option value="{{ $data->brand }}"
                                                        @if (request()->brand == $data->brand) selected @endif>
                                                        {{ $data->brand }}</option>
                                                @endforeach
                                            </select>
                                        </div>
                                    </div>

                                    <div class="form-group">
                                        <label class="col-xs-12 col-sm-4 control-label">Pecahan</label>
                                        <div class="col-xs-8 col-sm-4">
                                            <select name="fragment" id="fragment" class="form-control">
                                                <option value="">-- Pilih Pecahan --</option>
                                            </select>
                                        </div>
                                    </div>

                                    <div class="form-group" style="margin-top:20px">
                                        <div class="col-xs-12 col-sm-12 text-center">
                                            <button type="submit" class="btn btn-primary btn-search"><i
                                                    class="fa fa-search"></i> Search</button>
                                        </div>
                                    </div>
                                </div>
                            </form>
                        </div>

                    </div>

                    <div class="row">
                        <div class="col-xs-12 col-sm-12">
                            <div class="x_panel">
                                <div class="x_content">
                                    <table id="table" class="table table-bordered table-striped table-hover">
                                        <thead>
                                            <tr>
                                                <th>Trx Date</th>
                                                <th>Trx Number</th>
                                                <th>Keterangan</th>
                                                <th>Certificate</th>
                                                <th>Brand</th>
                                                <th>Item</th>
                                                <th>Type</th>
                                                <th class="text-right">price</th>
                                                <th class="text-right">Qty</th>
                                                <th class="text-right">Avarage Price</th>
                                                <th class="text-right">Stock Qty</th>
                                            </tr>
                                        </thead>

                                        @forelse ($sp_call as $row)
                                             <tr>
                                                <td>{{ $row->transaction_date }}</td>
                                                <td>{{ $row->transaction_number }}</td>
                                                <td>{{ $row->keterangan }}</td>
                                                <td>{{ $row->certificate }}</td>
                                                <td>{{ $row->brand_emas }}</td>
                                                <td>{{ $row->item_code  }} Gram</td>
                                                <td>{{ $row->type }}</td>
                                                <td class="text-right">{{ number_format($row->price,2) }}</td>
                                                <td class="text-right">{{ $row->quantity }}</td>
                                                <td class="text-right">{{ $row->avg_price }}</td>
                                                <td class="text-right">{{ $row->stock_qty }}</td>
                                                
                                            </tr>
                                        @empty
                                            <tr>
                                                <td colspan="15" class="text-center">Data not found !</td>
                                            </tr>
                                        @endforelse
                                    </table>
                                </div>
                            </div>
                        </div>
                    </div>
                </div>
            </div>
        </div>
    </div>
@endsection

@section('scripts')
    <script>
        $(document).ready(function() {

            $('#brand').on('change', function() {
                updateItemDropdown($(this).val());
            });


            @if($request['brand']) 
                updateItemDropdown('{{ $request['brand'] }}');
            @endif
        });

        function updateItemDropdown(brandId) {
            $('#fragment').empty();
            $('#fragment').append('<option>Loading ...</option>');
            $.ajax({
                url: '{{ url("select_brand_emas") }}/' + brandId,
                type: "GET",
                dataType: "json",
                success: function(data) {
                    if (data) {
                        $('#fragment').empty();
                        $('#fragment').append('<option value="">-- Pilih Pecahan --</option>');
                        $.each(data, function(key, emas) {
                            let choosed = '';
                            if(emas.pecahan == '{{ $request["fragment"] }}') {
                                choosed = 'selected';
                            }
                            $('#fragment').append('<option value="' +
                                emas.pecahan + " Gram " + '" '+choosed+'>' + emas.pecahan + " Gram " +
                                '</option>');
                        });
                    } else {
                        $('#fragment').empty();
                    }
                }
            });
        }
    </script>
@endsection