@extends('layouts.admin')
@section('header_style')
    <link href="{{asset('assets/plugins/datatables/datatables.min.css')}}" rel="stylesheet" type="text/css"/>
    <link href="{{asset('assets/plugins/datatables/plugins/bootstrap/datatables.bootstrap.css')}}" rel="stylesheet"      type="text/css"/>
    <link href="{{asset('assets/plugins/bootstrap-datepicker/css/bootstrap-datepicker3.min.css')}}" rel="stylesheet"      type="text/css"/>
    <style type="text/css">
        td { 
            font-size: 14px !important; 
        }
    </style>
@endsection
@section('content')     


<style type="text/css">
    .img-wrapper {
        background-color: #3fa94c;
    }
.setting {
    font-size: 20px;
    border-bottom: 2px solid black;
}

.box-wrapper {
    width: 180px;
    height: 250px;
    padding: 15px;
    margin-right: 50px;
    float: left;
}

.img-wrapper {
    width: 180px;
    height: 180px;
    background-color: #27699f;
    padding: 15px;
    border-radius: 10px !important;
    box-shadow: 0px 1px 14px 2px rgba(0, 0, 0, 0.11);
    float: left;
}

.img-wrapper a:hover {
    background-color: #3fa94c;
}

.txt-wrapper {
    width: 180px;
    height: 60px;
    padding-top: 15px;
    float: left;
}

.box-wrapper p {
    margin: 0px;
}

.img-wrapper img {
    margin-top: 20px;
}

.text-wrapper {
    margin-top: 4px !important;
    font-size: 20px;
    color: #083b62;
    height: 20px;
}    
</style>
<div style="zoom:80%;">
    <div class="page-content-body-wrapper no-padding">
        <div class="page-content-body no-padding">
            <div class="portlet light" style="height: 100%;">
                <div class="portlet-body no-padding" style="height: 100%; background: #3fa94c;">
                    <div class="row" style="height: 100%;margin-right: 0px;">
                        <div class="col-md-12" style="padding-left: 4%;padding-right: 10%; margin-top: 30px;">
                            @if( auth()->user()->role_id == '2')
                            
                            @else
                                <div class="box-wrapper">
                                    <div class="img-wrapper" style="background-color: #f6f6f6">
                                        <a href="{{ route('report.bookingreport') }}">
                                            <p class="text-center">
                                                <img height="100px" width="100px" src="{{ asset('assets/img/sales.png') }}">
                                            </p>
                                        </a>
                                    </div>
                                    <div class="txt-wrapper">
                                        <a href="{{ route('report.bookingreport') }}">
                                            <p class="text-center bold text-wrapper">
                                                <span>SALES REPORT</span>
                                            </p>
                                        </a>
                                    </div>
                                </div>
                            @endif                       
                            <div class="box-wrapper">
                                <div class="img-wrapper" style="background-color: #f6f6f6">
                                    <a href="{{ route('report.cancelreport') }}">
                                        <p class="text-center">
                                            <img height="100px" width="100px" src="{{ asset('assets/img/success.png') }}">
                                        </p>
                                    </a>
                                </div>
                                <div class="txt-wrapper">
                                    <a href="{{ route('report.cancelreport') }}">
                                        <p class="text-center bold text-wrapper">
                                            <span style="white-space: nowrap;">BOOKING REPORT</span>
                                        </p>
                                    </a>
                                </div>
                            </div>
                        </div>
                    </div>
                </div>
            </div>
        </div>
    </div>
</div>
     
@endsection
@section('footer_script')
    <script src="{{asset('assets/scripts/datatable.js' )}}" type="text/javascript"></script>
    <script src="{{asset('assets/plugins/datatables/datatables.min.js' )}}" type="text/javascript"></script>
    <script src="{{asset('assets/plugins/datatables/plugins/bootstrap/datatables.bootstrap.js' )}}"
            type="text/javascript"></script>
    <script src="{{asset('assets/plugins/jquery-validation/js/jquery.validate.min.js') }}"
            type="text/javascript"></script>
    <script src="{{asset('assets/plugins/jquery-validation/js/additional-methods.min.js') }}"
            type="text/javascript"></script>
    <script src="{{asset('assets/plugins/bootstrap-datepicker/js/bootstrap-datepicker.min.js' )}}"
            type="text/javascript"></script>
    <script src="{{asset('assets/scripts/pages/setting/audit.js') }}" type="text/javascript"></script> 
@endsection