@extends('backend.layout.masterlayout')
@section('content')
    @include('backend.partial.sidebar')
    @include('backend.partial.topbar')
    <!--page-wrapper-->
    <div class="page-wrapper">
        <!--page-content-wrapper-->
        <div class="page-content-wrapper">
            <div class="page-content">
                <div class="row">
                    <div class="col-md-12">
                        <div class="card radius-15">
                            <div class="card-body" style="padding: 2rem 2rem;">
                                <div class="row">
                                    <div class="col-md-4">
                                        <h6 class="mb-0 text-primary font-weight-bold">
                                            {{ formatBytes($calculate_dirsize) }} <span class="float-end text-secondary">50
                                                GB</span></h6>
                                        <p class="mb-0 mt-2"><span class="text-secondary">Used</span><span
                                                class="float-end text-primary">Upgrade</span>
                                        </p>
                                        <div class="progress mt-3" style="height:7px;">
                                            <div class="progress-bar" role="progressbar" style="width: 15%"
                                                aria-valuenow="15" aria-valuemin="0" aria-valuemax="100">
                                            </div>
                                            <div class="progress-bar bg-warning" role="progressbar" style="width: 30%"
                                                aria-valuenow="30" aria-valuemin="0" aria-valuemax="100"></div>
                                            <div class="progress-bar bg-danger" role="progressbar" style="width: 20%"
                                                aria-valuenow="20" aria-valuemin="0" aria-valuemax="100"></div>
                                        </div>
                                    </div>
                                    <div class="col-md-4">
                                        <div class="d-flex align-items-center">
                                            <div class="fm-file-box bg-light-primary text-primary"><i
                                                    class='bx bx-image'></i>
                                            </div>
                                            <div class="flex-grow-1 ms-2">
                                                <h6 class="mb-0" style="font-size:.9rem;">Images</h6>
                                                <p class="mb-0 text-secondary">1,756 files</p>
                                            </div>
                                            <h6 class="text-primary mb-0" style="font-size:.8rem;">15.3 GB
                                            </h6>
                                        </div>
                                    </div>
                                    <div class="col-md-4">
                                        <div class="d-flex align-items-center">
                                            <div class="fm-file-box bg-light-success text-success"><i
                                                    class='bx bxs-file-doc'></i>
                                            </div>
                                            <div class="flex-grow-1 ms-2">
                                                <h6 class="mb-0" style="font-size:.9rem;">Documents</h6>
                                                <p class="mb-0 text-secondary">123 files</p>
                                            </div>
                                            <h6 class="text-primary mb-0" style="font-size:.8rem;">256 MB
                                            </h6>
                                        </div>
                                    </div>
                                    <div class="col-md-4">
                                        <div class="d-flex align-items-center mt-3">
                                            <div class="fm-file-box bg-light-danger text-danger"><i class='bx bx-video'></i>
                                            </div>
                                            <div class="flex-grow-1 ms-2">
                                                <h6 class="mb-0" style="font-size:.9rem;">Media Files</h6>
                                                <p class="mb-0 text-secondary">24 files</p>
                                            </div>
                                            <h6 class="text-primary mb-0" style="font-size:.8rem;">3.4 GB
                                            </h6>
                                        </div>
                                    </div>
                                    <div class="col-md-4">
                                        <div class="d-flex align-items-center mt-3">
                                            <div class="fm-file-box bg-light-warning text-warning"><i
                                                    class='bx bx-image'></i>
                                            </div>
                                            <div class="flex-grow-1 ms-2">
                                                <h6 class="mb-0" style="font-size:.9rem;">Other Files</h6>
                                                <p class="mb-0 text-secondary">458 files</p>
                                            </div>
                                            <h6 class="text-primary mb-0" style="font-size:.8rem;">3 GB</h6>
                                        </div>
                                    </div>
                                    <div class="col-md-4">
                                        <div class="d-flex align-items-center mt-3">
                                            <div class="fm-file-box bg-light-info text-info"><i class='bx bx-image'></i>
                                            </div>
                                            <div class="flex-grow-1 ms-2">
                                                <h6 class="mb-0" style="font-size:.9rem;">Unknown Files
                                                </h6>
                                                <p class="mb-0 text-secondary">57 files</p>
                                            </div>
                                            <h6 class="text-primary mb-0" style="font-size:.8rem;">178 GB
                                            </h6>
                                        </div>
                                    </div>
                                </div>
                            </div>
                        </div>
                    </div>
                    <div class="col-md-12">
                        <div class="card radius-15">
                            <div class="card-body" style="padding: 2rem 2rem;">
                                <div class="row">
                                    <div class="col-md-12 align-items-center">
                                        <ul class="nav nav-pills">
                                            <li class="nav-item">
                                                <a class="nav-link active" data-bs-toggle="tab"
                                                    href="#uploadsdir">
                                                    <span class="p-tab-name"><i class="bx bx-archive"></i>
                                                        Uploads</span>
                                                    <i class="bx bx-archive font-24 d-sm-none"></i>
                                                </a>
                                            </li>
                                            <li class="nav-item">
                                                <a class="nav-link" data-bs-toggle="tab" href="#themeassets">
                                                    <span class="p-tab-name"><i class="bx bx-archive"></i>
                                                        Theme Assets</span>
                                                    <i class="bx bx-archive font-24 d-sm-none"></i>
                                                </a>
                                            </li>
                                            <li class="nav-item">
                                                <a class="nav-link" data-bs-toggle="tab" href="#none">
                                                    <span class="p-tab-name"><i class="bx bx-archive"></i>
                                                        None</span>
                                                    <i class="bx bx-archive font-24 d-sm-none"></i>
                                                </a>
                                            </li>
                                        </ul>
                                        <div class="tab-content mt-3">
                                            <div class="tab-pane fade show active" id="uploadsdir">
                                                <div class="card shadow-none border mb-0 radius-15">
                                                    <div class="card-body">
                                                        <div class="table-responsive">
                                                            <table class="table table-striped table-bordered"
                                                                style="width:100%">
                                                                <thead class="thead-primary">
                                                                    <tr>
                                                                        <th>Name <i
                                                                                class='bx bx-up-arrow-alt ms-2'></i>
                                                                        </th>
                                                                        <th>Type</th>
                                                                        <th>Size</th>
                                                                        <th>Last Modified</th>
                                                                        <th></th>
                                                                    </tr>
                                                                </thead>
                                                                <tbody>
                                                                    @foreach ($uploads_dirs as $key => $uploaddir)
                                                                        @if ($key > 1)
                                                                            @php
                                                                                $extension = pathinfo(
                                                                                    $uploaddir,
                                                                                    PATHINFO_EXTENSION,
                                                                                );

                                                                                $image_extensions = array('jpg', 'JPG', 'png' ,'PNG' ,'jpeg' ,'JPEG','webp', 'WEBP', 'gif', 'GIF');
                                                                                if ($extension) {
                                                                                    if(in_array($extension, $image_extensions))
                                                                                    {
                                                                                        $iconclass = '<img src="'.URL::To('uploads/').'/'.$uploaddir.'" style="width: 30px;"/>';
                                                                                    }
                                                                                    else {
                                                                                        $iconclass =
                                                                                        "<i class='bx bxs-file me-2 font-24 text-secondary'></i>";
                                                                                    }
                                                                                } else {
                                                                                    $iconclass =
                                                                                        "<i class='bx bxs-folder me-2 font-24 text-secondary'></i>";
                                                                                }
                                                                            @endphp
                                                                            <tr>
                                                                                <td>
                                                                                    <div
                                                                                        class="d-flex align-items-center">
                                                                                        <div>
                                                                                            {!! $iconclass !!}
                                                                                        </div>
                                                                                        <div
                                                                                            class="font-weight-bold text-secondary">
                                                                                            {{ $uploaddir }}
                                                                                        </div>
                                                                                    </div>
                                                                                </td>
                                                                                <td>File Folder</td>
                                                                                <td>23 MB</td>
                                                                                <td>Jun 12, 2019</td>
                                                                                <td><i
                                                                                        class='bx bx-dots-horizontal-rounded font-24'></i>
                                                                                </td>
                                                                            </tr>
                                                                        @endif
                                                                    @endforeach

                                                                </tbody>
                                                            </table>
                                                        </div>
                                                    </div>
                                                </div>
                                            </div>
                                            <div class="tab-pane fade" id="themeassets">
                                                <div class="card shadow-none border mb-0 radius-15">
                                                    <div class="card-body">
                                                    </div>
                                                </div>
                                            </div>
                                            <div class="tab-pane fade" id="none">
                                                <div class="card shadow-none border mb-0 radius-15">
                                                    <div class="card-body">
                                                        <div class="row justify-content-center pt-5 pb-5">
                                                            <h2 class="section__title text-center"
                                                                style="color: #a2a3a5;"><i
                                                                    class="bx bx-archive"
                                                                    style="font-size:4rem;color: #a2a3a5;"></i>
                                                                <br />
                                                                {{ $basedata->businesstitle }} Drive
                                                            </h2>
                                                        </div>
                                                    </div>
                                                </div>
                                            </div>
                                        </div>
                                    </div>
                                </div>
                            </div>
                        </div>
                    </div>
                </div>

            </div>
        </div>
        <!--end page-content-wrapper-->
    </div>
    <!--end page-wrapper-->
    <!--start overlay-->
    <div class="overlay toggle-btn-mobile"></div>
    <!--end overlay-->
    <!--Start Back To Top Button-->
    <a href="javaScript:;" class="back-to-top"><i class='bx bxs-up-arrow-alt'></i></a> @include('backend.partial.dashboard_footer')
@endsection
@section('script')
    <script>
        jQuery(function($) {
            $('#golink').click(function() {
                return false;
            }).dblclick(function() {
                window.location = this.href;
                return false;
            });
        });
    </script>
@endsection