@extends('backend.admin.layouts.app')
@section('content')
    <div class="content-wrapper">

        <section class="content">
            <div class="container-fluid">


                <div class="row">
                    <div class="col-md-12">
                        <!-- Button trigger modal -->


                        @can('Products create')
                            <a href="{{ route('product.create',request()->vendor_id) }}" class="btn btn-primary mt-2">
                                Add New
                            </a>
                        @endcan
                        <div class="card mt-2">
                            <div class="card-header">
                                <h3 class="card-title"><strong>{{ isset($shop) ? $shop->name . ' /' : '' }}</strong>
                                    Products - <a href="javascript:history.back()" class="btn btn-dark btn-xs"> <span
                                            class="fa fa-arrow-left"></span> Go Back</a></h3>
                            </div>

                            <!-- /.card-header -->
                            <div class="card-body">
                                <div class="row justify-content-end">

                                    <!-- <div class="col">

                                            <input type="text" class="form-control rounded-0"   placeholder="Search" name="search" value="{{ request()->input('search') }}">

                                            <button type="button" id="filterButton" class="btn btn-primary rounded-0"><span class="fa fa-filter"></span> Filter</button>
                                            <a href="{{ route('products') }}"  class="btn btn-warning rounded-0">Clear</a>


                                    </div> -->

                                </div>
                                <table id="example1" class="table table-bordered table-striped dataTable dtr-inline"
                                    role="grid" aria-describedby="example1_info">
                                    <thead>
                                        <tr role="row">
                                            <th>#</th>
                                            <th>Image</th>
                                            <th>Name</th>
                                            <th>Category/Sub Category</th>
                                            <th>Purchase Price</th>
                                            <th>Sale Price</th>
                                            <th>Discount</th>
                                            <th>Stock</th>
                                            <th>Country</th>
                                            @isset($vendor)
                                                <th>Vendor/Shop</th>
                                            @endisset
                                            <th>Action</th>

                                        </tr>
                                    </thead>
                                    <tbody>
                                        @foreach ($products as $key => $row)
                                            <tr>
                                                <td>{{ $key + 1 }}</td>
                                                <td>
                                                    @if (file_exists(public_path() . '/uploads/products/' . $row->image))
                                                        <img class="rounded" width="90" height="90"
                                                            src="{{ asset('uploads/products') . '/' . $row->image }}"
                                                            alt="">
                                                    @else
                                                        <img class="rounded" width="90" height="90"
                                                            src="{{ asset('noimage.png') }}" alt="">
                                                    @endif

                                                </td>
                                                <td>{{ $row->name }}</td>
                                                @php
                                                    $category = App\Models\Category::where('id', $row->category_id)
                                                        ->where('parent_id', '!=', null)
                                                        ->first();
                                                    $m_category = App\Models\Category::orderBy('id', 'desc')
                                                        ->where(['id' => $category->parent_id])
                                                        ->first();

                                                @endphp
                                                <td>{{ $m_category->name }} / {{ $category->name }}</td>
                                                <td>{{ $row->purchase_price }}</td>
                                                <td>{{ $row->sale_price }}</td>
                                                <td>{{ $row->discount }}%</td>
                                                <td>
                                                    <strong>{{ $row->stock }}</strong>
                                                    <div>
                                                        <button class="btn btn-xs btn-light" data-toggle="modal"
                                                            data-target="#updatStock{{ $row->id }}">Add more</button>
                                                    </div>
                                                </td>
                                                <td class="text-capitalize">
                                                    {{ !empty($row->country->name) ? $row->country->name : '-' }}
                                                </td>
                                                @isset($vendor)
                                                    <td><span class="text-danger">Shop deleted</span>                                                    </td>
                                                @endisset
                                                <td>
                                                    @can('Product view')
                                                        <a href="{{ route('products.view',$row->id) }}" class="btn btn-sm btn-success"
                                                            data-placement="bottom" data-toggle="tooltip"
                                                            data-original-title="View"><span
                                                                class="fa fa-eye"></span></a>
                                                    @endcan
                                                    @can('Products edit')
                                                        <a href="{{ route('product.edit',$row->id) }}" class="btn btn-sm btn-warning edit-category"
                                                              data-toggle="tooltip"
                                                            data-original-title="Edit"><span
                                                                class="fa fa-edit"></span></a>
                                                    @endcan
                                                    @can('Products delete')
                                                        <a onclick="return confirm('are you sure?')"
                                                            href="{{ route('products.delete', $row->id) }}"
                                                            class="btn btn-sm btn-danger" data-placement="bottom"
                                                            data-toggle="tooltip" data-original-title="Delete"><span
                                                                class="fa fa-trash"></span></a>
                                                    @endcan
                                                </td>
                                            </tr>
                                            <div class="modal fade" id="updatStock{{ $row->id }}" tabindex="-1"
                                                role="dialog" aria-labelledby="exampleModalLabel" aria-hidden="true">
                                                <div class="modal-dialog" role="document">
                                                    <div class="modal-content">
                                                        <div class="modal-header">
                                                            <h5 class="modal-title" id="exampleModalLabel">Update Stock
                                                            </h5>
                                                            <button type="button" class="close" data-dismiss="modal"
                                                                aria-label="Close">
                                                                <span aria-hidden="true">&times;</span>
                                                            </button>
                                                        </div>
                                                        <form id="add_form" method="post"
                                                            action="{{ route('update.stock') }}">
                                                            <input type="hidden" name="id"
                                                                value="{{ $row->id }}">
                                                            <div class="modal-body">
                                                                @csrf

                                                                <div class="row">
                                                                    <div class="col-md-4">

                                                                        <div class="form-group">
                                                                            <label for="">Existing Stock</label>
                                                                            <input type="text"
                                                                                value="{{ $row->stock }}"
                                                                                placeholder="Existing Stock"
                                                                                name="old_stock" readonly
                                                                                class="form-control">
                                                                        </div>
                                                                    </div>

                                                                    <div class="col-md-8">

                                                                        <div class="form-group">
                                                                            <label for="name">Add</label>

                                                                            <input type="number" placeholder="Add More"
                                                                                required name="new_stock"
                                                                                class="form-control">
                                                                            <small>if you want to decrease, put the -ve
                                                                                value(i.e -5)</small>
                                                                        </div>
                                                                    </div>


                                                                </div>


                                                            </div>
                                                            <div class="modal-footer">
                                                                <button type="button" class="btn btn-secondary"
                                                                    data-dismiss="modal">Close</button>
                                                                <button type="submit"
                                                                    class="btn btn-primary btn_save">Save</button>
                                                            </div>
                                                        </form>
                                                    </div>
                                                </div>
                                            </div>

                                        @endforeach

                                    </tbody>

                                </table>
                                <div class="row justify-content-end">

                                    {{-- {{ $products->appends(['search' => request()->query('search')])->links('pagination::bootstrap-4') }} --}}


                                </div>
                            </div>
                            <!-- /.card-body -->
                        </div>
                    </div>
                </div>

            </div>
        </section>
        <!-- /.content -->
    </div>

    <script>
        $('#category').on('change', function() {
            var categoryId = $(this).val();
            if (categoryId) {
                $.ajax({
                    url: '{{ route('subcategories.byCategory') }}',
                    method: 'GET',
                    data: {
                        parent_id: categoryId
                    },
                    success: function(data) {
                        console.log(data)
                        $('#subcategory').empty().append(
                            '<option value="">Select Subcategory</option>');
                        $.each(data, function(key, subcategory) {
                            $('#subcategory').append('<option value="' + subcategory.id + '">' +
                                subcategory.name + '</option>');
                        });
                    }
                });
            } else {
                $('#subcategory').empty().append('<option value="">Select Subcategory</option>');
            }
        });

        $('#category1').on('change', function() {
            var categoryId = $(this).val();
            if (categoryId) {
                $.ajax({
                    url: '{{ route('subcategories.byCategory') }}',
                    method: 'GET',
                    data: {
                        parent_id: categoryId
                    },
                    success: function(data) {
                        console.log(data)
                        $('#subcategory1').empty().append(
                            '<option value="">Select Subcategory</option>');
                        $.each(data, function(key, subcategory) {
                            $('#subcategory1').append('<option value="' + subcategory.id +
                                '">' + subcategory.name + '</option>');
                        });
                    }
                });
            } else {
                $('#subcategory1').empty().append('<option value="">Select Subcategory</option>');
            }
        });

        $("#filterButton").click(function() {
        // Submit the form when the button is clicked
        $('#searchForm').submit();
    });
    </script>
@endsection