@extends('layouts.master')
@extends('sidebar.dashboard')

@section('content')

<!-- BEGIN: Content-->

<!-- Dashboard Ecommerce Starts -->
<section id="dashboard-ecommerce">
    <div class="row match-height">
        <!-- Medal Card -->
        <div class="col-xl-4 col-md-6 col-12">
            <div class="card card-congratulation-medal">
                <div class="card-body">
                    <h5>WELCOME GVK ONE!</h5>
                    <p class="card-text font-small-3">Customized Dashboard</p>
                    <h3 class="mb-75 mt-2 pt-50">
                        <a href="#">₹48.9k</a>
                    </h3>
                    <button type="button" class="btn btn-primary">View Sales</button>
                    <img src="{{URL::to('app-assets/images/illustration/gvk.png')}}" style="left: 206px;top: 46px;width: 232px;" class="congratulation-medal" alt="Medal Pic" />
                </div>
            </div>
        </div>
        <!--/ Medal Card -->

        <!-- Statistics Card -->
        <div class="col-xl-8 col-md-6 col-12">
            <div class="card card-statistics">
                <div class="card-header">
                    <h4 class="card-title">Statistics</h4>
                    <div class="d-flex align-items-center">
                        <p class="card-text font-small-2 me-25 mb-0">Updated 1 month ago</p>
                    </div>
                </div>
                <div class="card-body statistics-body">
                    <div class="row">
                        <div class="col-xl-3 col-sm-6 col-12 mb-2 mb-xl-0">
                            <div class="d-flex flex-row">
                                <div class="avatar bg-light-primary me-2">
                                    <div class="avatar-content">
                                        <i data-feather="trending-up" class="avatar-icon"></i>
                                    </div>
                                </div>
                                <div class="my-auto">
                                    <h4 class="fw-bolder mb-0">230k</h4>
                                    <p class="card-text font-small-3 mb-0">Sales</p>
                                </div>
                            </div>
                        </div>
                        <div class="col-xl-3 col-sm-6 col-12 mb-2 mb-xl-0">
                            <div class="d-flex flex-row">
                                <div class="avatar bg-light-info me-2">
                                    <div class="avatar-content">
                                        <i data-feather="user" class="avatar-icon"></i>
                                    </div>
                                </div>
                                <div class="my-auto">
                                    <h4 class="fw-bolder mb-0">8.549k</h4>
                                    <p class="card-text font-small-3 mb-0">Customers</p>
                                </div>
                            </div>
                        </div>
                        <div class="col-xl-3 col-sm-6 col-12 mb-2 mb-sm-0">
                            <div class="d-flex flex-row">
                                <div class="avatar bg-light-danger me-2">
                                    <div class="avatar-content">
                                        <i data-feather="box" class="avatar-icon"></i>
                                    </div>
                                </div>
                                <div class="my-auto">
                                    <h4 class="fw-bolder mb-0">1.423k</h4>
                                    <p class="card-text font-small-3 mb-0">Products</p>
                                </div>
                            </div>
                        </div>
                        <div class="col-xl-3 col-sm-6 col-12">
                            <div class="d-flex flex-row">
                                <div class="avatar bg-light-success me-2">
                                    <div class="avatar-content">
                                        <i data-feather="at-sign" class="avatar-icon"></i>
                                    </div>
                                </div>
                                <div class="my-auto">
                                    <h4 class="fw-bolder mb-0">₹9745</h4>
                                    <p class="card-text font-small-3 mb-0">Revenue</p>
                                </div>
                            </div>
                        </div>
                    </div>
                </div>
            </div>
        </div>
        <!--/ Statistics Card -->
    </div>

    <div class="row match-height">
        <div class="col-lg-4 col-12">
            <div class="row match-height">
                <!-- Bar Chart - Orders -->
                <div class="col-lg-6 col-md-3 col-6">
                    <div class="card">
                        <div class="card-body pb-50">
                            <h6>Orders</h6>
                            <h2 class="fw-bolder mb-1">2,76k</h2>
                            <div id="statistics-order-chart"></div>
                        </div>
                    </div>
                </div>
                <!--/ Bar Chart - Orders -->

                <!-- Line Chart - Profit -->
                <div class="col-lg-6 col-md-3 col-6">
                    <div class="card card-tiny-line-stats">
                        <div class="card-body pb-50">
                            <h6>Profit</h6>
                            <h2 class="fw-bolder mb-1">6,24k</h2>
                            <div id="statistics-profit-chart"></div>
                        </div>
                    </div>
                </div>
                <!--/ Line Chart - Profit -->

                <!-- Earnings Card -->
                <div class="col-lg-12 col-md-6 col-12">
                    <div class="card earnings-card">
                        <div class="card-body">
                            <div class="row">
                                <div class="col-6">
                                    <h4 class="card-title mb-1">Earnings</h4>
                                    <div class="font-small-2">This Month</div>
                                    <h5 class="mb-1">₹4055.56</h5>
                                    <p class="card-text text-muted font-small-2">
                                        <span class="fw-bolder">68.2%</span><span> more earnings than last month.</span>
                                    </p>
                                </div>
                                <div class="col-6">
                                    <div id="earnings-chart"></div>
                                </div>
                            </div>
                        </div>
                    </div>
                </div>
                <!--/ Earnings Card -->
            </div>
        </div>

        <!-- Revenue Report Card -->
        <div class="col-lg-8 col-12">
            <div class="card card-revenue-budget">
                <div class="row mx-0">
                    <div class="col-md-8 col-12 revenue-report-wrapper">
                        <div class="d-sm-flex justify-content-between align-items-center mb-3">
                            <h4 class="card-title mb-50 mb-sm-0">Sales Performance</h4>
                            <div class="d-flex align-items-center">
                                <div class="d-flex align-items-center me-2">
                                    <span class="bullet bullet-primary font-small-3 me-50 cursor-pointer"></span>
                                    <span>Earning</span>
                                </div>
                                <div class="d-flex align-items-center ms-75">
                                    <span class="bullet bullet-warning font-small-3 me-50 cursor-pointer"></span>
                                    <span>Expense</span>
                                </div>
                            </div>
                        </div>
                        <div id="revenue-report-chart"></div>
                    </div>
                    <div class="col-md-4 col-12 budget-wrapper">
                        <div class="btn-group">
                            <button type="button" class="btn btn-outline-primary btn-sm dropdown-toggle budget-dropdown" data-bs-toggle="dropdown" aria-haspopup="true" aria-expanded="false">
                                2020
                            </button>
                            <div class="dropdown-menu">
                                <a class="dropdown-item" href="#">2020</a>
                                <a class="dropdown-item" href="#">2019</a>
                                <a class="dropdown-item" href="#">2018</a>
                            </div>
                        </div>
                        <h2 class="mb-25">₹25,852</h2>
                        <div class="d-flex justify-content-center">
                            <span class="fw-bolder me-25">Budget:</span>
                            <span>56,800</span>
                        </div>
                        <div id="budget-chart"></div>
                        <button type="button" class="btn btn-primary">Increase Budget</button>
                    </div>
                </div>
            </div>
        </div>
        <!--/ Revenue Report Card -->
    </div>


    <div class="row match-height">
        <!-- Medal Card -->

        <!--/ Medal Card -->

        <!-- Statistics Card -->
        <div class="col-xl-12 col-md-12 col-12">
            <div class="card">
                <div class="card-header">
                    <div>
                        <h4 class="card-title">Weekly Sales</h4>
                        <span class="card-subtitle text-muted">Commercial networks and enterprises</span>
                    </div>
                </div>
                <div class="card-body">
                    <canvas class="line-chart-ex chartjs" data-height="450"></canvas>
                </div>
            </div>
        </div>
        <!--/ Statistics Card -->
    </div>


    <div class="row">
        <!-- Donut Chart Starts -->
        <div class="col-lg-4 col-12">
            <div class="card">
                <div class="card-header">
                    <h4 class="card-title">Growth Analysis</h4>
                </div>
                <div class="card-body">
                    <canvas class="doughnut-chart-ex chartjs" data-height="275"></canvas>
                    <div class="d-flex justify-content-between mt-3 mb-1">
                        <div class="d-flex align-items-center">
                            <i data-feather="activity" class="font-medium-2 text-primary"></i>
                            <span class="fw-bold ms-75 me-25">Q1</span>
                            <span>- 80%</span>
                        </div>
                        <div>
                            <span>2%</span>
                            <i data-feather="arrow-up" class="text-success"></i>
                        </div>
                    </div>
                    <div class="d-flex justify-content-between mb-1">
                        <div class="d-flex align-items-center">
                            <i data-feather="activity" class="font-medium-2 text-warning"></i>
                            <span class="fw-bold ms-75 me-25">Q2</span>
                            <span>- 10%</span>
                        </div>
                        <div>
                            <span>8%</span>
                            <i data-feather="arrow-up" class="text-success"></i>
                        </div>
                    </div>
                    <div class="d-flex justify-content-between">
                        <div class="d-flex align-items-center">
                            <i data-feather="activity" class="font-medium-2 text-success"></i>
                            <span class="fw-bold ms-75 me-25">Q3</span>
                            <span>- 10%</span>
                        </div>
                        <div>
                            <span>-5%</span>
                            <i data-feather="arrow-down" class="text-danger"></i>
                        </div>
                    </div>
                </div>
            </div>
        </div>
        <!-- Donut Chart Starts -->

        <!-- Scatter Chart Starts  -->
        <div class="col-lg-8 col-12">
            <div class="card">
                <div class="card-header d-flex justify-content-between align-items-baseline align-items-sm-center flex-sm-row flex-column">
                    <h4 class="card-title">Trading Density</h4>
                    <div class="btn-group mt-md-0 mt-1" role="group" aria-label="Basic radio toggle button group">
                        <input type="radio" class="btn-check" name="radio_options" id="radio_option1" autocomplete="off" checked />
                        <label class="btn btn-outline-primary" for="radio_option1">Daily</label>

                        <input type="radio" class="btn-check" name="radio_options" id="radio_option2" autocomplete="off" />
                        <label class="btn btn-outline-primary" for="radio_option2">Monthly</label>

                        <input type="radio" class="btn-check" name="radio_options" id="radio_option3" autocomplete="off" />
                        <label class="btn btn-outline-primary" for="radio_option3">Yearly</label>
                    </div>
                </div>
                <div class="card-body">
                    <canvas class="scatter-chart-ex chartjs" data-height="390"></canvas>
                </div>
            </div>
        </div>
        <!-- Scatter Chart Ends  -->
    </div>


    <div class="row">
        <!--Bar Chart Start -->
        <div class="col-xl-6 col-md-6 col-12">
            <div class="card">
                <div class="card-header d-flex justify-content-between align-items-sm-center align-items-start flex-sm-row flex-column">
                    <div class="header-left">
                        <h4 class="card-title">Sales Performance</h4>
                    </div>
                    <div class="header-right d-flex align-items-center mt-sm-0 mt-1">
                        <i data-feather="calendar"></i>
                        <input type="text" class="form-control flat-picker border-0 shadow-none bg-transparent pe-0" placeholder="YYYY-MM-DD" />
                    </div>
                </div>
                <div class="card-body">
                    <canvas class="bar-chart-ex chartjs" data-height="400"></canvas>
                </div>
            </div>
        </div>
        <!-- Bar Chart End -->

        <!-- Horizontal Bar Chart Start -->
        <div class="col-xl-6 col-md-6 col-12">
            <div class="card">
                <div class="
            card-header
            d-flex
            flex-sm-row flex-column
            justify-content-md-between
            align-items-start
            justify-content-start
          ">
                    <h4 class="card-title mb-sm-0 mb-1">Performance | MOM</h4>
                </div>
                <div class="card-body">
                    <div id="radialbar-chart" style="height: 410px"></div>
                </div>
            </div>
        </div>
        <!-- Horizontal Bar Chart End -->
    </div>



    <div class="row match-height">
        <div class="col-xl-12 col-md-12 col-12">
            <div class="card">
                <div class="card-header">
                    <div>
                        <h4 class="card-title">Sales Analysis</h4>

                    </div>
                </div>
                <div class="card-body">
                    <div class="col-lg-12 col-12">
                        <div class="card card-company-table">
                            <div class="card-body p-0">
                                <div class="table-responsive">
                                    <table class="table">
                                        <thead>
                                            <tr>
                                                <th>Company</th>
                                                <th>Category</th>
                                                <th>Views</th>
                                                <th>Revenue</th>
                                                <th>Sales</th>
                                            </tr>
                                        </thead>
                                        <tbody>
                                            <tr>
                                                <td>
                                                    <div class="d-flex align-items-center">
                                                        <div class="avatar rounded">
                                                            <div class="avatar-content">
                                                                <img src="{{URL::to('app-assets/images/icons/toolbox.svg')}}" alt="Toolbar svg" />
                                                            </div>
                                                        </div>
                                                        <div>
                                                            <div class="fw-bolder">Cock & Bull</div>
                                                            <div class="font-small-2 text-muted">meguc@ruj.io</div>
                                                        </div>
                                                    </div>
                                                </td>
                                                <td>
                                                    <div class="d-flex align-items-center">
                                                        <div class="avatar bg-light-primary me-1">
                                                            <div class="avatar-content">
                                                                <i data-feather="monitor" class="font-medium-3"></i>
                                                            </div>
                                                        </div>
                                                        <span>Food</span>
                                                    </div>
                                                </td>
                                                <td class="text-nowrap">
                                                    <div class="d-flex flex-column">
                                                        <span class="fw-bolder mb-25">23.4k</span>
                                                        <span class="font-small-2 text-muted">in 24 hours</span>
                                                    </div>
                                                </td>
                                                <td>₹891.2</td>
                                                <td>
                                                    <div class="d-flex align-items-center">
                                                        <span class="fw-bolder me-1">68%</span>
                                                        <i data-feather="trending-down" class="text-danger font-medium-1"></i>
                                                    </div>
                                                </td>
                                            </tr>
                                            <tr>
                                                <td>
                                                    <div class="d-flex align-items-center">
                                                        <div class="avatar rounded">
                                                            <div class="avatar-content">
                                                                <img src="{{URL::to('app-assets/images/icons/parachute.svg')}}" alt="Parachute svg" />
                                                            </div>
                                                        </div>
                                                        <div>
                                                            <div class="fw-bolder">Concu</div>
                                                            <div class="font-small-2 text-muted">vecav@hodzi.co.uk</div>
                                                        </div>
                                                    </div>
                                                </td>
                                                <td>
                                                    <div class="d-flex align-items-center">
                                                        <div class="avatar bg-light-success me-1">
                                                            <div class="avatar-content">
                                                                <i data-feather="coffee" class="font-medium-3"></i>
                                                            </div>
                                                        </div>
                                                        <span>Food</span>
                                                    </div>
                                                </td>
                                                <td class="text-nowrap">
                                                    <div class="d-flex flex-column">
                                                        <span class="fw-bolder mb-25">78k</span>
                                                        <span class="font-small-2 text-muted">in 2 days</span>
                                                    </div>
                                                </td>
                                                <td>₹668.51</td>
                                                <td>
                                                    <div class="d-flex align-items-center">
                                                        <span class="fw-bolder me-1">97%</span>
                                                        <i data-feather="trending-up" class="text-success font-medium-1"></i>
                                                    </div>
                                                </td>
                                            </tr>
                                            <tr>
                                                <td>
                                                    <div class="d-flex align-items-center">
                                                        <div class="avatar rounded">
                                                            <div class="avatar-content">
                                                                <img src="{{URL::to('app-assets/images/icons/brush.svg')}}" alt="Brush svg" />
                                                            </div>
                                                        </div>
                                                        <div>
                                                            <div class="fw-bolder">Third Wave</div>
                                                            <div class="font-small-2 text-muted">davcilse@is.gov</div>
                                                        </div>
                                                    </div>
                                                </td>
                                                <td>
                                                    <div class="d-flex align-items-center">
                                                        <div class="avatar bg-light-warning me-1">
                                                            <div class="avatar-content">
                                                                <i data-feather="watch" class="font-medium-3"></i>
                                                            </div>
                                                        </div>
                                                        <span>Food</span>
                                                    </div>
                                                </td>
                                                <td class="text-nowrap">
                                                    <div class="d-flex flex-column">
                                                        <span class="fw-bolder mb-25">162</span>
                                                        <span class="font-small-2 text-muted">in 5 days</span>
                                                    </div>
                                                </td>
                                                <td>₹522.29</td>
                                                <td>
                                                    <div class="d-flex align-items-center">
                                                        <span class="fw-bolder me-1">62%</span>
                                                        <i data-feather="trending-up" class="text-success font-medium-1"></i>
                                                    </div>
                                                </td>
                                            </tr>
                                            <tr>
                                                <td>
                                                    <div class="d-flex align-items-center">
                                                        <div class="avatar rounded">
                                                            <div class="avatar-content">
                                                                <img src="{{URL::to('app-assets/images/icons/haldiram.jpg')}}" style="width:45px" alt="Star svg" />
                                                            </div>
                                                        </div>
                                                        <div>
                                                            <div class="fw-bolder">Haldiram's</div>
                                                            <div class="font-small-2 text-muted">us@cuhil.gov</div>
                                                        </div>
                                                    </div>
                                                </td>
                                                <td>
                                                    <div class="d-flex align-items-center">
                                                        <div class="avatar bg-light-primary me-1">
                                                            <div class="avatar-content">
                                                                <i data-feather="monitor" class="font-medium-3"></i>
                                                            </div>
                                                        </div>
                                                        <span>Food</span>
                                                    </div>
                                                </td>
                                                <td class="text-nowrap">
                                                    <div class="d-flex flex-column">
                                                        <span class="fw-bolder mb-25">214</span>
                                                        <span class="font-small-2 text-muted">in 24 hours</span>
                                                    </div>
                                                </td>
                                                <td>₹291.01</td>
                                                <td>
                                                    <div class="d-flex align-items-center">
                                                        <span class="fw-bolder me-1">88%</span>
                                                        <i data-feather="trending-up" class="text-success font-medium-1"></i>
                                                    </div>
                                                </td>
                                            </tr>
                                            <tr>
                                                <td>
                                                    <div class="d-flex align-items-center">
                                                        <div class="avatar rounded">
                                                            <div class="avatar-content">
                                                                <img src="{{URL::to('app-assets/images/icons/mcdonald.png')}}" style="width: 45px;" alt="Book svg" />
                                                            </div>
                                                        </div>
                                                        <div>
                                                            <div class="fw-bolder">McDonald's</div>
                                                            <div class="font-small-2 text-muted">pudais@jife.com</div>
                                                        </div>
                                                    </div>
                                                </td>
                                                <td>
                                                    <div class="d-flex align-items-center">
                                                        <div class="avatar bg-light-success me-1">
                                                            <div class="avatar-content">
                                                                <i data-feather="coffee" class="font-medium-3"></i>
                                                            </div>
                                                        </div>
                                                        <span>Food</span>
                                                    </div>
                                                </td>
                                                <td class="text-nowrap">
                                                    <div class="d-flex flex-column">
                                                        <span class="fw-bolder mb-25">208</span>
                                                        <span class="font-small-2 text-muted">in 1 week</span>
                                                    </div>
                                                </td>
                                                <td>₹783.93</td>
                                                <td>
                                                    <div class="d-flex align-items-center">
                                                        <span class="fw-bolder me-1">16%</span>
                                                        <i data-feather="trending-down" class="text-danger font-medium-1"></i>
                                                    </div>
                                                </td>
                                            </tr>
                                            <tr>
                                                <td>
                                                    <div class="d-flex align-items-center">
                                                        <div class="avatar rounded">
                                                            <div class="avatar-content">
                                                                <img src="{{URL::to('app-assets/images/icons/kfc.png')}}" alt="Rocket svg" style="width:65px;" />
                                                            </div>
                                                        </div>
                                                        <div>
                                                            <div class="fw-bolder">KFC</div>
                                                            <div class="font-small-2 text-muted">bipri@cawiw.com</div>
                                                        </div>
                                                    </div>
                                                </td>
                                                <td>
                                                    <div class="d-flex align-items-center">
                                                        <div class="avatar bg-light-warning me-1">
                                                            <div class="avatar-content">
                                                                <i data-feather="watch" class="font-medium-3"></i>
                                                            </div>
                                                        </div>
                                                        <span>Food</span>
                                                    </div>
                                                </td>
                                                <td class="text-nowrap">
                                                    <div class="d-flex flex-column">
                                                        <span class="fw-bolder mb-25">990</span>
                                                        <span class="font-small-2 text-muted">in 1 month</span>
                                                    </div>
                                                </td>
                                                <td>₹780.05</td>
                                                <td>
                                                    <div class="d-flex align-items-center">
                                                        <span class="fw-bolder me-1">78%</span>
                                                        <i data-feather="trending-up" class="text-success font-medium-1"></i>
                                                    </div>
                                                </td>
                                            </tr>
                                            <tr>
                                                <td>
                                                    <div class="d-flex align-items-center">
                                                        <div class="avatar rounded">
                                                            <div class="avatar-content">
                                                                <img src="{{URL::to('app-assets/images/icons/speaker.svg')}}" alt="Speaker svg" />
                                                            </div>
                                                        </div>
                                                        <div>
                                                            <div class="fw-bolder">Waffle House</div>
                                                            <div class="font-small-2 text-muted">luk@izug.io</div>
                                                        </div>
                                                    </div>
                                                </td>
                                                <td>
                                                    <div class="d-flex align-items-center">
                                                        <div class="avatar bg-light-warning me-1">
                                                            <div class="avatar-content">
                                                                <i data-feather="watch" class="font-medium-3"></i>
                                                            </div>
                                                        </div>
                                                        <span>Food</span>
                                                    </div>
                                                </td>
                                                <td class="text-nowrap">
                                                    <div class="d-flex flex-column">
                                                        <span class="fw-bolder mb-25">12.9k</span>
                                                        <span class="font-small-2 text-muted">in 12 hours</span>
                                                    </div>
                                                </td>
                                                <td>₹531.49</td>
                                                <td>
                                                    <div class="d-flex align-items-center">
                                                        <span class="fw-bolder me-1">42%</span>
                                                        <i data-feather="trending-up" class="text-success font-medium-1"></i>
                                                    </div>
                                                </td>
                                            </tr>
                                        </tbody>
                                    </table>
                                </div>
                            </div>
                        </div>
                    </div>
                </div>
            </div>
        </div>
        <!-- Company Table Card -->

        <!--/ Company Table Card -->



        <!-- Developer Meetup Card -->

        <!--/ Developer Meetup Card -->

        <!-- Browser States Card -->

        <!--/ Browser States Card -->

        <!-- Goal Overview Card -->

        <!--/ Goal Overview Card -->

        <!-- Transaction Card -->

        <!--/ Transaction Card -->
    </div>
</section>
<!-- Dashboard Ecommerce ends -->


<!-- END: Content-->

@endsection