
<div class="row">
    <div class="col-md-6" >
        <div class="row">
            <div class="col-lg-12 col-xs-12 col-sm-12">
                <div class="portlet box blue-steel">
                    <div class="portlet-title">
                        <div class="caption">
                           Thông tin nhà
                        </div>
                    </div>
                    <div class="portlet-body" style="height: 450px">
                        <div class="row">
                            <div class="col-lg-3 col-md-3 col-sm-6 col-xs-12">
                                <a class="dashboard-stat dashboard-stat-v2 blue" href="{{ url('admin2/hostel/list') }}">
                                    <div class="visual">
                                        <i class="fa fa-comments"></i>
                                    </div>
                                    <div class="details">
                                        <div class="number">
                                            <span id="balance_before" data-counter="counterup" data-value="{{ $numberHostels }}">{{ $numberHostels }}</span>
                                        </div>
                                        <div class="desc"> Số nhà</div>
                                    </div>
                                </a>
                            </div>
                            <div class="col-lg-3 col-md-3 col-sm-6 col-xs-12">
                                <a class="dashboard-stat dashboard-stat-v2 green-meadow" href="#">
                                    <div class="visual">
                                        <i class="fa fa-bar-chart-o"></i>
                                    </div>
                                    <div class="details">
                                        <div class="number">
                                            <span id="total_collect" data-counter="counterup" data-value="{{ $numberRooms }}">{{ $numberRooms }}</span>
                                        </div>
                                        <div class="desc"> Số phòng/giường</div>
                                    </div>
                                </a>
                            </div>
                            <div class="col-lg-3 col-md-3 col-sm-6 col-xs-12">
                                <a class="dashboard-stat dashboard-stat-v2 red" id="btn-near-empty-rooms" href="#rooms" data-toggle="modal">
                                    <div class="visual">
                                        <i class="fa fa-bar-chart-o"></i>
                                    </div>
                                    <div class="details">
                                        <div class="number">
                                            <span id="total_collect" data-counter="counterup" data-value="{{ $numberRoomsNearEmpty }}">{{ $numberRoomsNearEmpty }}</span>
                                        </div>
                                        <div class="desc"> Phòng/Giường sắp trống</div>
                                    </div>
                                </a>
                            </div>
                            <div class="col-lg-3 col-md-3 col-sm-6 col-xs-12">
                                <a class="dashboard-stat dashboard-stat-v2 green" id="btn-empty-rooms" href="#rooms" data-toggle="modal">
                                    <div class="visual">
                                        <i class="fa fa-shopping-cart"></i>
                                    </div>
                                    <div class="details">
                                        <div class="number">
                                            <span id="total_spend" data-counter="counterup" data-value="{{ $emptyRooms }}">{{ $emptyRooms }}</span>
                                        </div>
                                        <div class="desc"> Chỗ/Giường trống</div>
                                    </div>
                                </a>
                            </div>
                        </div>
                        <div id="pie" class="CSSAnimationChart" style="height: 300px!important;"></div>

                    </div>
                </div>
            </div>

        </div>
    </div>
    <div class="col-md-6">
        <div class="row">
            <div class="col-lg-12 col-xs-12 col-sm-12">
                <div class="portlet box  yellow-lemon ">
                    <div class="portlet-title">
                        <div class="caption">
                           Thống kê
                        </div>
                    </div>
                    <div class="portlet-body" style="height: 450px">
                        <div id="chart" class="CSSAnimationChart" style="height: 400px!important;"></div>
                    </div>
                </div>
            </div>

        </div>

    </div>
</div>
<div class="row">
    <div class="col-md-6" id="stat-payment">
        <div class="row">
            <div class="col-lg-12 col-xs-12 col-sm-12">
                <div class="portlet box red-flamingo ">
                    <div class="portlet-title">
                        <div class="caption">
                            Theo dõi thanh toán
                        </div>
                    </div>
                    <div class="portlet-body" style="height: auto">
                        <div class="row">
                            <div class="col-md-3">
                                <div class="form-group">
                                    <label>Tháng</label>
                                    <select class="form-control" name="month" id="month-m">
                                        @for($i = 1; $i <= 12; $i++)
                                            <option @if(\Carbon\Carbon::now()->month == $i) selected=""
                                                    @endif value="{{ $i }}">Tháng {{ $i }}</option>
                                        @endfor
                                    </select>
                                </div>
                            </div>

                            <div class="col-md-3">
                                <div class="form-group">
                                    <label>Năm</label>
                                    <select class="form-control" name="year" id="year-m">
                                        @for($i = 2017; $i <= Carbon\Carbon::now()->year + 1; $i++)
                                            <option @if(\Carbon\Carbon::now()->year == $i) selected=""
                                                    @endif value="{{ $i }}">Năm {{ $i }}</option>
                                        @endfor
                                    </select>
                                </div>
                            </div>
                            <div class="col-md-12" id="stat-payment-data">

                                <div class="table-scrollable">
                                    <table class="table table-bordered table-hover">
                                        <thead>
                                        <tr>
                                            <th> Nội dung </th>
                                            <th> Số hóa đơn </th>
                                            <th> Số tiền </th>
                                        </tr>
                                        </thead>
                                        <tbody>
                                        <tr>
                                            <td> Tổng số hóa đơn đã thanh toán </td>
                                            <td> <a href="#paids" @if($hostelId) data-hostel="{{ $hostelId }}" @else data-hostel="" @endif data-toggle="modal" class="paids" data-type="paid"> {{ $paids }}</a> </td>
                                            <td> {{ number_format($paidAmount, 0, '.', '.') }} {{\App\Components\Functions::moneyUnit()}} </td>
                                        </tr>
                                        <tr>
                                            <td> Tổng số hóa đơn chưa thanh toán hết</td>
                                            <td> <a href="#paids" data-toggle="modal" data-type="not-paid"
                                                    @if($hostelId) data-hostel="{{ $hostelId }}" @else data-hostel="" @endif
                                                    class="paids" >{{ $unpaids }}</a> </td>
                                            <td> {{ number_format($unpaidAmount, 0, '.', '.') }} {{\App\Components\Functions::moneyUnit()}} </td>
                                        </tr>
                                        </tbody>
                                    </table>
                                </div>

                                {{--<p>Tổng số hóa đơn đã thanh toán: <a href="#paids" @if($hostelId) data-hostel="{{ $hostelId }}" @else data-hostel="" @endif data-toggle="modal" class="paids" data-type="paid" style="font-size: 20px"> {{ $paids }}</a> - {{ number_format($paidAmount, 0, '.', '.') }}đ </p>--}}
                                {{--<p>Tổng số hóa đơn chưa thanh toán hết: <a href="#paids" data-toggle="modal" data-type="not-paid"--}}
                                {{--@if($hostelId) data-hostel="{{ $hostelId }}" @else data-hostel="" @endif--}}
                                {{--class="paids" style="font-size: 20px">{{ $unpaids }}</a>--}}
                                {{--- {{ number_format($unpaidAmount, 0, '.', '.') }}đ</p>--}}
                            </div>

                        </div>
                    </div>
                </div>
            </div>

        </div>
    </div>
    <div class="col-md-6">
        <div class="row">
            <div class="col-lg-12 col-xs-12 col-sm-12">
                <div class="portlet box blue-steel ">
                    <div class="portlet-title">
                        <div class="caption">
                           Theo dõi hợp đồng
                        </div>
                    </div>
                    <div class="portlet-body" style="height: 230px">
                        <div class="row">
                            <div class="col-md-12">

                                <div class="table-scrollable">
                                    <table class="table table-bordered table-hover">
                                        <thead>
                                        <tr>
                                            <th> Nội dung </th>
                                            <th> Số HĐ </th>
                                        </tr>
                                        </thead>
                                        <tbody>
                                        <tr>
                                            <td> Số hợp đồng hết hạn trong vòng 30 ngày </td>
                                            <td><a href="#contracts" data-toggle="modal"
                                                   class="contracts-end" data-type="30" @if($hostelId) data-hostel="{{ $hostelId }}" @else data-hostel="" @endif> {{ $numberContracts30 }} </a></td>
                                        </tr>
                                        <tr>
                                            <td> Số hợp đồng hết hạn trong vòng 60 ngày </td>
                                            <td><a href="#contracts" data-toggle="modal"
                                                   class="contracts-end" data-type="60" @if($hostelId) data-hostel="{{ $hostelId }}" @else data-hostel="" @endif> {{ $numberContracts60 }} </a></td>
                                        </tr>
                                        <tr>
                                            <td> Số hợp đồng hết hạn trong vòng 90 ngày </td>
                                            <td><a href="#contracts" data-toggle="modal"
                                                   class="contracts-end" data-type="90" @if($hostelId) data-hostel="{{ $hostelId }}" @else data-hostel="" @endif> {{ $numberContracts90 }} </a></td>
                                        </tr>
                                        </tbody>
                                    </table>
                                </div>
                            </div>
                        </div>
                    </div>
                </div>
            </div>

        </div>
    </div>
</div>
<div class="row">
    <div class="col-md-6">
        <div class="row">
            <div class="col-lg-12 col-xs-12 col-sm-12">
                <div class="portlet box yellow-lemon ">
                    <div class="portlet-title">
                        <div class="caption">
                           Theo dõi khách thuê
                        </div>
                    </div>
                    <div class="portlet-body" style="height: 230px">
                        <div class="row">
                            <div class="col-md-12">

                                <div class="table-scrollable">
                                    <table class="table table-bordered table-hover">
                                        <thead>
                                        <tr>
                                            <th> Nội dung </th>
                                            <th> Số khách </th>
                                        </tr>
                                        </thead>
                                        <tbody>
                                        <tr>
                                            <td> Tổng số khách thuê đăng ký trên hệ thống </td>
                                            <td>{{ $numberRenters }}</td>
                                        </tr>
                                        <tr>
                                            <td> Số khách thuê chưa khai báo tạm trú tạm vắng </td>
                                            <td> {{ $rentersNotDeclareResidence }}</td>
                                        </tr>
                                        <tr>
                                            <td> Yêu cầu gia hạn tạm trú tạm vắng trong 30 ngày </td>
                                            <td> {{ $rentersResidenceWarning }}</td>
                                        </tr>
                                        </tbody>
                                    </table>
                                </div>
                            </div>
                        </div>
                    </div>
                </div>
            </div>

        </div>
    </div>
    <div class="col-md-6">
        <div class="row">
            <div class="col-lg-12 col-xs-12 col-sm-12 search-page search-content-1" >
                <div class="portlet box red-flamingo ">
                    <div class="portlet-title ">
                        <div class="caption col-md-12">
                           Sự cố
                            <a href="#add-report-break" data-toggle="modal" class="btn btn-success btn-add-report-break" style="float: right;">Thêm sự cố</a>
                        </div>

                    </div>
                    <div class="portlet-body" style="height: 230px">
                        <div class="row">
                            <div class="col-md-12">

                                <div class="table-scrollable">
                                    <table class="table table-bordered table-hover">
                                        <thead>
                                        <tr>
                                            <th> Nội dung </th>
                                            <th> Số sự cố </th>
                                        </tr>
                                        </thead>
                                        <tbody>
                                        <tr>
                                            <td> Sự cố mới </td>
                                            <td><a href="#report_break" data-toggle="modal"
                                                   class="report-break-list" data-status="{{\App\Models\ReportBreak::NOT_PROCESS}}" @if($hostelId) data-hostel="{{ $hostelId }}" @else data-hostel="" @endif> {{ $newReportBreak }} </a></td>
                                        </tr>
                                        <tr>
                                            <td> Sự cố đang xử lý </td>
                                            <td><a href="#report_break" data-toggle="modal"
                                                   class="report-break-list" data-status="{{\App\Models\ReportBreak::PROCESSING}}" @if($hostelId) data-hostel="{{ $hostelId }}" @else data-hostel="" @endif> {{ $processingReportBreak }} </a></td>
                                        </tr>
                                        <tr>
                                            <td> Sự cố đã hoàn thành </td>
                                            <td><a href="#report_break" data-toggle="modal"
                                                   class="report-break-list" data-status="{{\App\Models\ReportBreak::PROCESSED}}" @if($hostelId) data-hostel="{{ $hostelId }}" @else data-hostel="" @endif> {{ $prosessedReportBreak }} </a></td>
                                        </tr>
                                        </tbody>
                                    </table>
                                </div>
                            </div>
                        </div>
                    </div>
                    {{--<div class="portlet-body " style="height: auto">--}}
                        {{--<div class="row ">--}}
                            {{--<div class="col-md-12">--}}
                                {{--<div class="search-container ">--}}
                                    {{--@php $blogs = \App\Models\Blog::publish()->orderBy('id', 'desc')->take(6)->get() @endphp--}}
                                    {{--<ul class="slk">--}}
                                        {{--@foreach($blogs as $blog)--}}
                                        {{--<li class="search-item clearfix" style="border-bottom: none !important;">--}}
                                            {{--<a target="_blank" href="{{ url('blog/'.str_slug($blog->title).'-'.$blog->id) }}">--}}
                                                {{--<img src="{{ $blog->image_url }}" style="height: 125px; width: 125px">--}}
                                            {{--</a>--}}
                                            {{--<div class="search-content">--}}
                                                {{--<h4 class="search-title" style="font-size: 16px">--}}
                                                    {{--<a target="_blank" href="{{ url('blog/'.str_slug($blog->title).'-'.$blog->id) }}">{{ $blog->title }}</a>--}}
                                                {{--</h4>--}}
                                                {{--<p class="search-desc"> {{ \Illuminate\Support\Str::words(strip_tags(preg_replace("/&nbsp;/",'',html_entity_decode($blog->content))), 60) }} </p>--}}
                                            {{--</div>--}}
                                        {{--</li>--}}
                                            {{--@endforeach--}}
                                    {{--</ul>--}}
                                {{--</div>--}}
                            {{--</div>--}}
                        {{--</div>--}}
                    {{--</div>--}}
                </div>
            </div>

        </div>
    </div>
</div>
<script>

    var pieChart = {!! $pieChart !!}

        @if(isset($hostel))
    var chartRevenue = {!! json_encode(\App\Components\Functions::getIncomeMonthByHostel($hostel)) !!}
    @else
    var chartRevenue = {!! json_encode(\App\Components\Functions::getIncomeMonthByOwner()) !!}
        @endif
</script>