<x-adminheader title="Products" /> <!-- partial --> <div class="main-panel"> <div class="content-wrapper"> <div class="row"> <div class="col-md-12 grid-margin"> <div class="row"> <div class="col-12 col-xl-8 mb-4 mb-xl-0"> <h3 class="font-weight-bold">Welcome Aamir</h3> <h6 class="font-weight-normal mb-0">All systems are running smoothly! </h6> </div> <div class="col-12 col-xl-4"> <div class="justify-content-end d-flex"> <div class="dropdown flex-md-grow-1 flex-xl-grow-0"> <button class="btn btn-sm btn-light bg-white dropdown-toggle" type="button" id="dropdownMenuDate2" data-toggle="dropdown" aria-haspopup="true" aria-expanded="true"> <i class="mdi mdi-calendar"></i> Today (10 Jan 2021) </button> <div class="dropdown-menu dropdown-menu-right" aria-labelledby="dropdownMenuDate2"> <a class="dropdown-item" href="#">January - March</a> <a class="dropdown-item" href="#">March - June</a> <a class="dropdown-item" href="#">June - August</a> <a class="dropdown-item" href="#">August - November</a> </div> </div> </div> </div> </div> </div> </div> <div class="row"> <div class="col-md-12 grid-margin stretch-card"> <div class="card"> <div class="card-body"> <!-- Button to Open the Modal --> <button type="button" class="btn btn-primary float-right" data-toggle="modal" data-target="#myModal"> Add New </button> <!-- The Modal --> <div class="modal" id="myModal"> <div class="modal-dialog"> <div class="modal-content"> <!-- Modal Header --> <div class="modal-header"> <h4 class="modal-title"> Add New Product</h4> <button type="button" class="close" data-dismiss="modal">×</button> </div> <!-- Modal body --> <div class="modal-body"> <form class="needs-validation" action="{{ route('addNewProduct') }}" method="POST" enctype="multipart/form-data" novalidate> @csrf <div class="form-group"> <label for="name">Name</label> <input type="text" class="form-control" id="name" name="name" required> <div class="invalid-feedback">Please enter your name.</div> @error('name') <div class="alert alert-danger">{{ $message }}</div> @enderror </div> <div class="form-group"> <label for="file">Picture</label> <input type="file" class="form-control" id="file" name="file" required> <div class="invalid-feedback">Please upload a picture.</div> @error('file') <div class="alert alert-danger">{{ $message }}</div> @enderror </div> <div class="form-group"> <label for="description">Description</label> <textarea class="form-control" id="description" name="description" required></textarea> <div class="invalid-feedback">Please enter a description.</div> @error('description') <div class="alert alert-danger">{{ $message }}</div> @enderror </div> <div class="form-group"> <label for="price">Price</label> <input type="number" class="form-control" id="price" name="price" required> <div class="invalid-feedback">Please enter the price.</div> @error('price') <div class="alert alert-danger">{{ $message }}</div> @enderror </div> <div class="form-group"> <label for="quantity">Quantity</label> <input type="number" class="form-control" id="quantity" name="quantity" required> <div class="invalid-feedback">Please enter the quantity.</div> @error('quantity') <div class="alert alert-danger">{{ $message }}</div> @enderror </div> <div class="form-group"> <label for="category">Category</label> <select class="form-control" id="category" name="category" required> <option value="">Select Category</option> <option value="accessories">Accessories</option> <option value="clothing">Clothing</option> <option value="shoes">Shoes</option> </select> <div class="invalid-feedback">Please select a category.</div> @error('category') <div class="alert alert-danger">{{ $message }}</div> @enderror </div> <div class="form-group"> <label for="type">Type</label> <select class="form-control" id="type" name="type" required> <option value="">Select Type</option> <option value="best-sellers">Best Sellers</option> <option value="new-arrivals">New Arrivals</option> <option value="sale">Sale</option> </select> <div class="invalid-feedback">Please select a type.</div> @error('type') <div class="alert alert-danger">{{ $message }}</div> @enderror </div> <button type="submit" class="btn btn-primary">Submit</button> </form> </div> <!-- Modal footer --> <div class="modal-footer"> <button type="button" class="btn btn-danger" data-dismiss="modal">Close</button> </div> </div> </div> </div> <p class="card-title mb-0">Top Products</p> <div class="table-responsive"> <table class="table table-striped table-bordered" id="product-table"> <thead> <tr> <th>ID</th> <th>Name</th> <th>Picture</th> {{-- <th>Description</th> --}} <th>Price</th> <th>Quantity</th> <th>Category</th> <th>Type</th> <th>Actions</th> </tr> </thead> <tbody> @php $i = 0; @endphp @foreach ($products as $item) @php $i++; @endphp <tr> <td>{{ $item->id }}</td> <td>{{ $item->name }}</td> <td><img src="{{ URL::asset('uploads/products/' . $item->picture) }}" alt="" width="100px"></td> {{-- <td>{{ $item->description }}</td> --}} <td>Nrs.{{ $item->price }}</td> <td>{{ $item->quantity }}</td> <td>{{ $item->category }}</td> <td>{{ $item->type }}</td> <td> {{-- update --}} <!-- Button to Open the Modal --> <button type="button" class="btn btn-success" data-toggle="modal" data-target="#updateModal{{ $i }}"> Edit </button> <!-- The Modal --> <div class="modal" id="updateModal{{ $i }}"> <div class="modal-dialog"> <div class="modal-content"> <!-- Modal Header --> <div class="modal-header"> <h4 class="modal-title"> Edit Product</h4> <button type="button" class="close" data-dismiss="modal">×</button> </div> <!-- Modal body --> <div class="modal-body"> <form class="needs-validation" action="{{ route('updateProduct') }}" method="POST" enctype="multipart/form-data" novalidate> @csrf <div class="form-group"> <label for="name">Name</label> <input type="text" value="{{ $item->name }}" class="form-control" id="name" name="name" required> <div class="invalid-feedback">Please enter your name.</div> @error('name') <div class="alert alert-danger"> {{ $message }}</div> @enderror </div> <div class="form-group"> <label for="file">Picture</label> <input type="file" value="{{ $item->picture }}" class="form-control" id="file" name="file" required> <div class="invalid-feedback">Please upload a picture.</div> @error('file') <div class="alert alert-danger"> {{ $message }}</div> @enderror </div> <div class="form-group"> <label for="description">Description</label> <textarea class="form-control" value="{{ $item->description }}" id="description" name="description" required>{{ $item->description }}</textarea> <div class="invalid-feedback">Please enter description.</div> @error('description') <div class="alert alert-danger"> {{ $message }}</div> @enderror </div> <div class="form-group"> <label for="price">Price</label> <input type="number" class="form-control" value="{{ $item->price }}" id="price" name="price" required> <div class="invalid-feedback">Please enter the price.</div> @error('price') <div class="alert alert-danger"> {{ $message }}</div> @enderror </div> <div class="form-group"> <label for="quantity">Quantity</label> <input type="number" class="form-control" value="{{ $item->quantity }}" id="quantity" name="quantity" required> <div class="invalid-feedback">Please enter the quantity.</div> @error('quantity') <div class="alert alert-danger"> {{ $message }}</div> @enderror </div> <div class="form-group"> <label for="category">Category</label> <select class="form-control" id="category" name="category" required> <option value=" {{ $item->category }}"> {{ $item->category }} </option> <option value="accessories">Accessories </option> <option value="clothing">Clothing</option> <option value="shoes">Shoes</option> </select> <div class="invalid-feedback">Please select a category.</div> @error('category') <div class="alert alert-danger"> {{ $message }}</div> @enderror </div> <div class="form-group"> <label for="type">Type</label> <select class="form-control" id="type" name="type" required> <option value=" {{ $item->type }}"> {{ $item->type }}</option> <option value="best-sellers">Best Sellers </option> <option value="new-arrivals">New Arrivals </option> <option value="sale">Sale</option> </select> <div class="invalid-feedback">Please select a type.</div> @error('type') <div class="alert alert-danger"> {{ $message }}</div> @enderror </div> <input type="hidden" name="id" id="id" value="{{ $item->id }}"> <button type="submit" class="btn btn-success">Save Changes</button> </form> </div> <!-- Modal footer --> <div class="modal-footer"> <button type="button" class="btn btn-danger" data-dismiss="modal">Close</button> </div> </div> </div> </div> <a href="{{ route('deleteProduct', $item->id) }}" class="btn btn-danger">Delete</a> </td> @endforeach </tr> </tbody> </table> {{-- <div class="d-flex justify-content-center mt-3"> {{ $products->links() }} </div> --}} </div> </div> </div> </div> </div> </div> <!-- content-wrapper ends --> <x-adminfooter />