@extends('layouts.index', ['titulo' => 'Drive', 'mostrarBuscador' => true, 'nombre_titulo' => 'Drive'])

@section('btns')
    @canany(['archivos.crear'])
        <!--begin::Menu wrapper-->
        {{-- <div>
            <!--begin::Toggle-->
            <button type="button" class="btn btn-secondary rotate" data-kt-menu-trigger="click" data-kt-menu-placement="bottom-start"
                data-kt-menu-offset="30px, 30px">
                <i class="fas fa-plus text-dark fs-1"></i>
            </button>
            <!--end::Toggle-->

            <!--begin::Menu-->
            <div class="menu menu-sub menu-sub-dropdown menu-column menu-rounded menu-gray-800 menu-state-bg-light-primary fw-semibold w-auto min-w-200 mw-300px"
                data-kt-menu="true">
                <!--begin::Menu item-->
                <div class="menu-item px-3">
                    <div class="menu-content fs-6 text-gray-900 fw-bold px-3 py-4">Acciones</div>
                </div>
                <!--end::Menu item-->

                <!--begin::Menu separator-->
                <div class="separator mb-3 opacity-75"></div>
                <!--end::Menu separator-->

                <!--begin::Menu item-->
                <div class="menu-item px-3">
                    <a href="#" class="menu-link px-3 btnCrearArchivo" data-tipo="1">
                        Documentos de Google
                    </a>
                </div>
                <!--end::Menu item-->

                <!--begin::Menu item-->
                <div class="menu-item px-3 btnCrearArchivo" data-tipo="2">
                    <a href="#" class="menu-link px-3">
                        Hojas de cálculo de Google
                    </a>
                </div>
                <!--end::Menu item-->

                <!--begin::Menu item-->
                <div class="menu-item px-3">
                    <a href="#" class="menu-link px-3 btnCrearArchivo" data-tipo="3">
                        Presentaciones de Google
                    </a>
                </div>
                <!--end::Menu item-->

                <!--begin::Menu item-->
                <div class="menu-item px-3">
                    <a href="#" class="menu-link px-3 btnCrearArchivo" data-tipo="4">
                        Formularios de Google
                    </a>
                </div>
                <!--end::Menu item-->
            </div>
            <!--end::Menu-->
        </div> --}}
        <!--end::Dropdown wrapper-->
        <a href="#" class="btn  btn-archivo d-flex flex-center ms-3 px-4 py-3" data-bs-toggle="modal"
            data-bs-target="#modalCargarArchivo">
            <i class="las la-cloud-upload-alt icono-color fs-4">
                <span class="path1"></span>
                <span class="path2"></span>
                <span class="path3"></span>
            </i>
            <span>Cargar Archivo</span>
        </a>
    @endcanany
@endsection

@section('content')
    <div class="mb-4">
        <div class="seccionBe"></div>
    </div>
    <div class="seccionArchivos"></div>
@endsection

@section('modal')
    @component('google.drive.crear-carpeta')
    @endcomponent
    @component('google.drive.cargar')
    @endcomponent
    @component('google.drive.mover')
    @endcomponent
@endsection

@section('scripts')
    <script src="{{ mix('js/drive/principal.js') }}"></script>
@endsection