@extends('layouts.admin')
@section('title','Dashboard')
@section('content')
    <div class="content-wrapper">
        <div class="content-header">
            <div class="container-fluid">
                <div class="mb-2 row">
                    <div class="col-sm-12">
                        <h1 class="m-0 text-dark">Dashboard</h1>
                    </div>
                    <div class="col-sm-12">
                        <ol class="breadcrumb">
                            <li class="breadcrumb-item text-warning">
                                <a href="{{url('/home')}}">Home</a>
                            </li>
                            <li class="breadcrumb-item active">Dashboard</li>
                        </ol>
                    </div>
                </div>
            </div>
        </div>
        <section class="content">
            <div class="container-fluid">
                <div class="row">
                    <div class="col-md-3 col-sm-6 col-12">
                        <div class="bg-white shadow-sm info-box">
                        <span class="info-box-icon bg-purple elevation-1" style="border-radius: 50%;">
                            <i class="fas fa-sliders-h"></i>
                        </span>
                            <div class="info-box-content">
                                <span class="info-box-text">Sliders</span>
                                <span class="float-right info-box-number">
                                <h4 id="infoNo"><strong>{{$slider}}</strong></h4>
                            </span>
                            </div>
                        </div>
                    </div>
                    <div class="col-md-3 col-sm-6 col-12">
                        <div class="bg-white shadow-sm info-box">
                        <span class="info-box-icon bg-info elevation-1" style="border-radius: 50%;">
                            <i class="fa fa-motorcycle"></i>
                        </span>
                            <div class="info-box-content">
                                <span class="info-box-text">Bikes and Kits</span>
                                <span class="float-right info-box-number">
                                <h4 id="infoNo"><strong>{{$bike}}</strong></h4>
                            </span>
                            </div>
                        </div>
                    </div>
                    <div class="col-md-3 col-sm-6 col-12">
                        <div class="bg-white shadow-sm info-box">
                        <span class="info-box-icon bg-success elevation-1" style="border-radius: 50%;">
                            <i class="fa fa-users"></i>
                        </span>
                            <div class="info-box-content">
                                <span class="info-box-text">Users</span>
                                <span class="float-right info-box-number">
                                <h4 id="infoNo"><strong>{{$user}}</strong></h4>
                            </span>
                            </div>
                        </div>
                    </div>
                    <div class="col-md-3 col-sm-6 col-12">
                        <div class="bg-white shadow-sm info-box">
                        <span class="info-box-icon bg-warning elevation-1" style="border-radius: 50%;">
                            <i class="fa fa-check"></i>
                        </span>
                            <div class="info-box-content">
                                <span class="info-box-text">Itineraries</span>
                                <span class="float-right info-box-number">
                                <h4 id="infoNo"><strong>{{$itineraries}}</strong></h4>
                            </span>
                            </div>
                        </div>
                    </div>
                </div>
                <div class="row">
                    <div class="col-md-6">
                        <div class="card">
                            <div class="card-header">
                                <h5 class="card-title">Update Password</h5>
                            </div>
                            <form method="post" class="form-horizontal" action="{{url('/user/updatePassword')}}">
                                @csrf
                                <div class="card-body">
                                    <div class="form-group">
                                        <label class="col-form-label" for="oldPass">Old Password</label>
                                        <input type="password" name="oldPass" id="oldPass" class="form-control"
                                               >
                                    </div>
                                    <div class="form-group">
                                        <label class="col-form-label" for="password">New Password</label>
                                        <input type="password" name="password" id="password" class="form-control"
                                               >
                                    </div>
                                    <div class="form-group">
                                        <label class="col-form-label" for="password_confirmation">Confirm
                                            Password</label>
                                        <input type="password" name="password_confirmation" id="password_confirmation"
                                               class="form-control" >
                                    </div>
                                </div>
                                <div class="card-footer">
                                    <button type="submit" class="btn btn-success btn-sm">
                                        Update Password
                                    </button>
                                </div>
                            </form>
                        </div>
                    </div>
                    <div class="col-md-6">
                        <div class="card">
                            <div class="card-header">
                                <h5 class="card-title">Recent Activities</h5>
                            </div>
                            <div class="card-body">
                                <table class="table table-bordered">
                                    <thead>
                                    <tr>
                                        <th>#</th>
                                        <th>Activity</th>
                                    </tr>
                                    </thead>
                                    <tbody>
                                                                        @foreach($activities  as $activity)
                                        <tr>
                                            <th>{{$count++}}</th>
                                            <th>{{$activity->activity}}</th>
                                        </tr>
                                    @endforeach
                                    </tbody>
                                </table>
                                {{$activities->links()}}
                            </div>
                        </div>
                    </div>
                </div>
                <div class="row">
                    <div class="col-md-6">
                        <div class="card">
                            <div class="card-header">
                                <h5 class="card-title">Gallery</h5>
                            </div>
                            <div class="card-body">
                                <table class="table table-bordered" id="example2">
                                    <thead>
                                    <tr>
                                        <th>#</th>
                                        <th>Image</th>
                                        <th>Caption</th>
                                    </tr>
                                    </thead>
                                    <tbody>
                                                                        @foreach($galleries as $gallery)
                                        <tr>
                                            <td>{{$count++}}</td>
                                            <td>
                                                <img src="{{asset('')}}public/storage/{{$gallery->image}}" height="20" width="20">
                                            </td>
                                            <td>{{$gallery->caption}}</td>
                                        </tr>
                                    @endforeach
                                    </tbody>
                                </table>
                            </div>
                        </div>
                    </div>
                    <div class="col-md-6">
                        <div class="card">
                            <div class="card-header">
                                <h5 class="card-title">Bikes</h5>
                            </div>
                            <div class="card-body">
                                <table class="table table-bordered" id="example1">
                                    <thead>
                                        <tr>
                                            <th>#</th>
                                            <th>Title</th>
                                            <th>Content</th>
                                        </tr>
                                    </thead>
                                    <tbody>
                                                                        @foreach($bikes as $bike)
                                        <tr>
                                            <td>{{$count++}}</td>
                                            <td>{{$bike->title}}</td>
                                            <td>{!! substr(($bike->content),0,100) !!}</td>
                                        </tr>
                                        @endforeach
                                    </tbody>
                                </table>
                            </div>
                        </div>
                    </div>
                </div>
            </div>
        </section>
    </div>
@endsection