@extends('layouts.app')

@section('pageTitle', $department->name)

@section('content')

    <div class="row app-block mb-4">
        @include('dashboard.documents.fragments.menu')
        <div class="col-md-9 app-content">
            <div class="app-content-overlay"></div>
            @include('dashboard.documents.fragments.filters')

            <p>{{$department->name}} documents</p>
            <div class="row">
                @foreach($documents as $document)
                        <div class="col-xl-3 col-lg-4 col-md-6 col-sm-12">
                            <div class="card app-file-list">
                                <div class="app-file-icon">
                                    <i class="fa fa-file-text-o text-primary"></i>
                                    <div class="dropdown position-absolute top-0 right-0 mr-3">
                                        <a href="#" class="btn btn-outline-light btn-sm" data-toggle="dropdown">
                                            <i class="fa fa-ellipsis-h"></i>
                                        </a>
                                        <div class="dropdown-menu dropdown-menu-right">
                                            <a href="{{ route("dashboard.documents.edit", ["id" => $document->id]) }}" class="dropdown-item">View Details</a>
                                            <a href="#" class="dropdown-item">Share</a>
                                            <a href="#" class="dropdown-item">Download</a>
                                            <a href="#" class="dropdown-item">Move to</a>
                                            <a href="#" class="dropdown-item">Delete</a>
                                        </div>
                                    </div>
                                </div>
                                <div class="p-2 small">
                                    <div>{{$document->name}} - {{$document->arch_id}}</div>
                                    <div class="text-muted">{{$document->description}}</div>
                                    <div class="text-muted">1.2MB</div>
                                </div>
                            </div>
                        </div>
                    @endforeach


            </div>
        </div>

        @endsection

        @section('script')

            <script>
                $(function () {
                    $(document).on('click', '.file-upload-btn', function () {
                        $('form#file-upload input[type="file"]').trigger('click');
                    });

                    $(document).on('click', '.app-sidebar-menu-button', function () {
                        $('.app-block .app-sidebar, .app-content-overlay').addClass('show');
                        // $('.app-block .app-sidebar .app-sidebar-menu').niceScroll().resize();
                        return false;
                    });

                    $(document).on('click', '.app-content-overlay', function () {
                        $('.app-block .app-sidebar, .app-content-overlay').removeClass('show');
                        return false;
                    });
                });
            </script>

@endsection