@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">
                    <h3>Vending machine - {{ $vending_machine->name }}</h3>
                </div>
                <div class="clearfix"></div>
            </div>

            <div class="row">

                <div class="col-xs-6">
                    <div class="x_panel">
                        <div class="x_title">
                            <h4>Detail</h4>
                        </div>
                        <div class="x_content">
                            <form class="form-horizontal" id="form-detail">
                                <input type="hidden" value="{{ $vending_machine->id }}" name="id" />

                                <div class="form-group">
                                    <label class="control-label col-sm-2">Code :</label>
                                    <div class="col-sm-10">
                                        <p class="form-control-static">{{ $vending_machine->code }}</p>
                                    </div>
                                </div>                                

                                <div class="form-group">
                                    <label class="control-label col-sm-2">Name :</label>
                                    <div class="col-sm-10">
                                        <input type="text" class="form-control" value="{{ $vending_machine->name }}" name="name">
                                    </div>
                                </div>  

                                <div class="form-group">
                                    <label class="control-label col-sm-2">Location :</label>
                                    <div class="col-sm-10">
                                        <input type="text" class="form-control" value="{{ $vending_machine->location }}" name="location">
                                    </div>
                                </div>

                                <div class="form-group">
                                    <label class="control-label col-sm-2">Address :</label>
                                    <div class="col-sm-10">
                                        <textarea class="form-control" name="address">{{ $vending_machine->address }}</textarea>
                                    </div>
                                </div>

                                <div class="form-group">
                                    <label class="control-label col-sm-2">Province :</label>
                                    <div class="col-sm-10">
                                        <select class="form-control" name="province">
                                            <option value="">Select province</option>
                                            @foreach($provinces as $province)
                                                <option value="{{ $province->id }}" @if($province->id == $vending_machine->id_province) selected @endif>{{ $province->name }}</option>
                                            @endforeach
                                        </select>
                                    </div>
                                </div>

                                <div class="form-group">
                                    <label class="control-label col-sm-2">Status :</label>
                                    <div class="col-sm-10">
                                        <select class="form-control" name="status">
                                            <option value="">Select status</option>
                                            <option value="1" @if($vending_machine->status == '1') selected @endif>Active</option>
                                            <option value="0" @if($vending_machine->status == '2') selected @endif>Nonactive</option>
                                        </select>
                                    </div>
                                </div>

                                <div class="form-group">                                            
                                    <div class="col-sm-8 col-sm-offset-2">
                                        <button class="btn btn-default"><i class="fa fa-save" aria-hidden="true"></i> Save</button>
                                    </div>
                                </div>
                            </form>
                        </div>
                    </div>        
                </div>

                <div class="col-xs-6">
                    <div class="row">
                        <div class="col-xs-12">
                            <div class="x_panel">
                                <div class="x_title">
                                    <h4>Summary</h4>
                                </div>
                                <div class="x_content">
                                    <table class="table table-bordered table-striped">
                                        <thead>
                                            <tr>
                                                <th class="text-center">SKU</th>
                                                <th class="text-center">Stock</th>
                                            </tr>
                                        </thead>
                                        <tbody>
                                            @forelse($active_stocks as $active_stock)
                                                <tr>
                                                    <td>
                                                        {{ $active_stock->sku->sku_code }}<br>
                                                        {{ $active_stock->sku->product_name }}
                                                    </td>
                                                    <td class="text-center">{{ $active_stock->count_sku }}</td>
                                                </tr>
                                            @empty
                                                <tr>
                                                    <td colspan="2" class="text-center">No data</td>
                                                </tr>
                                            @endforelse
                                        </tbody>
                                    </table>
                                </div>
                            </div>
                        </div>
                    </div>
                </div>

                <div class="col-xs-12">
                    <div class="x_panel">
                        <div class="x_title">
                            <h4>Filter</h4>
                        </div>
                        <div class="x_content">
                            <form class="form-horizontal" method="get">
                                <div class="form-group">
                                    <label class="control-label col-sm-2">Status :</label>
                                    <div class="col-sm-10">
                                        <select class="form-control" name="status">
                                            <option value="all" @if($request["status"] == "all") selected @endif>All status</option>
                                            @foreach(\App\Models\Vending_machine_detail_model::STATUS as $status)
                                                <option value="{{ $status["id"] }}" @if($request["status"] == $status["id"]) selected @endif>{{ $status["value"] }}</option>
                                            @endforeach
                                        </select>
                                    </div>
                                </div>

                                <div class="form-group">                                            
                                    <div class="col-sm-8 col-sm-offset-2">
                                        <button class="btn btn-default"><i class="fa fa-search" aria-hidden="true"></i> Search</button>
                                    </div>
                                </div>
                            </form>
                        </div>
                    </div>
                </div>
                <div class="col-xs-12">
                    <div class="x_panel">
                        <div class="row x_title">
                            <div class="col-sm-6">
                                <h2>Stock</h2>
                            </div>
                            <div class="col-sm-6">
                                <div class="text-right">
                                    <a href="{{ route('download_vm_detail', ['id'=>$vending_machine->id, 'status'=>$request['status']]) }}" target="_blank" class="btn btn-default btn-sm"><i class="fa fa-download" aria-hidden="true"></i> Download</a>
                                    <a href="{{ route('vm_stock_add', ['id'=>$vending_machine->id]) }}" target="_blank" class="btn btn-default btn-sm"><i class="fa fa-plus" aria-hidden="true"></i> Add stock</a>
                                </div>
                            </div>
                            <div class="clearfix"></div>
                        </div>
                        <div class="x_content">                            
                            <table id="table_list_stok" class="table table-bordered table-striped">
                                <thead>
                                    <tr>
                                        <th></th>
                                        <th class="text-center">ID</th>
                                        <th>SKU</th>
                                        <th class="text-center">Certificate</th>
                                        <th class="text-center">Created date</th>
                                        <th class="text-center">Selling date</th>
                                        <th class="text-center">Transaction</th>
                                        <th></th>
                                    </tr>
                                </thead>
                                <tbody>
                                    @forelse($vending_machine_details as $vending_machine_detail)
                                        @php
                                            if($vending_machine_detail->status == (\App\Models\Vending_machine_detail_model::STATUS)["ACTIVE"]["id"]) $class_text = "text-muted";
                                            else if($vending_machine_detail->status == (\App\Models\Vending_machine_detail_model::STATUS)["SOLD"]["id"]) $class_text = "text-success";
                                            else if($vending_machine_detail->status == (\App\Models\Vending_machine_detail_model::STATUS)["DISABLED"]["id"]) $class_text = "text-danger";
                                        @endphp
                                        <tr>
                                            <td class="text-center"><i class="fa fa-circle {{ $class_text }}" aria-hidden="true"></i></td>
                                            <td class="text-center">{{ $vending_machine_detail->id }}</td>
                                            <td>
                                                {{ $vending_machine_detail->sku->sku_code }}<br>
                                                {{ $vending_machine_detail->sku->product_name }}
                                            </td>                                           
                                            <td class="text-center">{{ $vending_machine_detail->nomor_sertifikat }}</td>
                                            <td class="text-center">{{ $vending_machine_detail->created_at }}</td>
                                            <td class="text-center">{{ $vending_machine_detail->selling_date }}</td>
                                            <td class="text-center">
                                                @if(!empty($vending_machine_detail->tukar_qrcode[0]))
                                                    <a href="{{ route('inquiry_trx', ['code'=>@$vending_machine_detail->tukar_qrcode[0]->tukar_payment->transaksi->code]) }}" target="_blank">{{ @$vending_machine_detail->tukar_qrcode[0]->tukar_payment->transaksi->code }}</a>
                                                @endif
                                            </td>
                                            <td class="text-center">
                                                @if($vending_machine_detail->status == (\App\Models\Vending_machine_detail_model::STATUS)["DISABLED"]["id"])
                                                    <button class="btn btn-default btn-xs btn-remove" data-id="{{ $vending_machine_detail->id }}"><i class="fa fa-upload" aria-hidden="true"></i> Takeout</button>
                                                @endif
                                                @if($vending_machine_detail->status != (\App\Models\Vending_machine_detail_model::STATUS)["SOLD"]["id"])
                                                    <button class="btn btn-default btn-xs btn-changestatus" data-id="{{ $vending_machine_detail->id }}"><i class="fa fa-refresh" aria-hidden="true"></i> Change status</button> 
                                                @endif
                                            </td>
                                        </tr>
                                    @empty
                                        <tr>
                                            <td colspan="8" class="text-center">No data</td>
                                        </tr>
                                    @endforelse
                                </tbody>
                            </table>
                            <p><b>Total Data : {{ $vending_machine_details->total() }}</b></p> 
                            <div style="text-align:center">{{ $vending_machine_details->appends(array_except(\Request::query(), 'page'))->links() }}</div>

                            <div style="text-align:center">
                                <span style="margin-right: 15px;"><i class="fa fa-circle text-success" aria-hidden="true"></i> {{ (\App\Models\Vending_machine_detail_model::STATUS)["SOLD"]["value"] }}</span>
                                <span style="margin-right: 15px;"><i class="fa fa-circle text-muted" aria-hidden="true"></i> {{ (\App\Models\Vending_machine_detail_model::STATUS)["ACTIVE"]["value"] }}</span>
                                <span><i class="fa fa-circle text-danger" aria-hidden="true"></i> {{ (\App\Models\Vending_machine_detail_model::STATUS)["DISABLED"]["value"] }}</span>
                            </div>
                        </div>
                    </div>
                </div>
            </div>
        </div>
        @include('includes.footer')
    </div>
</div>
@endsection


@section('scripts')
<script type="text/javascript">
    function submit_form() {
        var $form = $('#form-detail');
        $form.find('.loading').removeClass('hidden');
        $form.find('.submit').addClass('hidden');

        $.ajax({
            url: '{{ $vending_machine->id }}/update',
            method: "POST",
            headers: { 'X-CSRF-TOKEN': $('meta[name="csrf-token"]').attr('content') },
            data: $form.serialize(),
            success: function(response) {
                alert('Data saved');
                location.reload();
            },
            error: function(response) {
                var response = response.responseJSON;
                alert(response.error);
                $form.find('.loading').addClass('hidden');
                $form.find('.submit').removeClass('hidden');
            }
        });
        return false;
    }
    function stock_remove() {
        $(this).addClass("hidden");

        var id = $(this).data("id");

        $.ajax({
            url: '{{ $vending_machine->id }}/stock_remove',
            method: "POST",
            headers: { 'X-CSRF-TOKEN': $('meta[name="csrf-token"]').attr('content') },
            data: { "id" : id },
            success: function(response) {
                alert('Data saved');
                location.reload();
            },
            error: function(response) {
                var response = response.responseJSON;
                alert(response.error);
                $form.find('.loading').addClass('hidden');
                $form.find('.submit').removeClass('hidden');
            }
        });
        return false;
    }
    function stock_change_status() {
        $(this).addClass("hidden");

        var id = $(this).data("id");

        $.ajax({
            url: '{{ $vending_machine->id }}/stock_change_status',
            method: "POST",
            headers: { 'X-CSRF-TOKEN': $('meta[name="csrf-token"]').attr('content') },
            data: { "id" : id },
            success: function(response) {
                alert('Data saved');
                location.reload();
            },
            error: function(response) {
                var response = response.responseJSON;
                alert(response.error);
                $form.find('.loading').addClass('hidden');
                $form.find('.submit').removeClass('hidden');
            }
        });
        return false;   
    }
    $(document).ready(function() {            
        $('#form-detail').on('submit', submit_form);
        $('#table_list_stok').find(".btn-changestatus").on('click', stock_change_status);
        $('#table_list_stok').find(".btn-remove").on('click', stock_remove);
    });
</script>
@endsection