@if($type == \App\Models\CollectSpend::COLLECT)
    @php $name = 'thu' @endphp
@else
    @php $name = 'chi' @endphp
@endif

<style>
    .dashboard-stat2 {
        border: 1px solid #e7ecf1;
    }
</style>

@if($type == \App\Models\CollectSpend::COLLECT)
    <div class="col-lg-3 col-md-3 col-sm-3 col-xs-6">
        <div class="dashboard-stat2 ">
            <div class="display">
                <div class="number">
                    <h3 class="font-green-haze">
                        <span data-counter="counterup"
                              data-value="{{ number_format($sum, 0, '.', '.') }}">{{ number_format($sum, 0, '.', '.') }}{{\App\Components\Functions::moneyUnit()}}</span>
                    </h3>
                    <small>TỔNG THU</small>
                </div>
            </div>
            <div class="progress-info">
                <div class="progress">
                                            <span style="width: 100%;"
                                                  class="progress-bar progress-bar-success green-haze">
                                                <span class="sr-only">100%</span>
                                            </span>
                </div>
                <div class="status">
                    <div class="status-number"> 100%</div>
                </div>
            </div>
        </div>
    </div>
    @php
        $other = $sum - $deposit - $service - $roomPrice;
           if($sum == 0)
       {
       $sum = 1;
       $deposit = 0;
       $service = 0;
       $roomPrice = 0;
       $other = 0;
       }
    @endphp
    <div class="col-lg-3 col-md-3 col-sm-3 col-xs-6">
        <div class="dashboard-stat2 ">
            <div class="display">
                <div class="number">
                    <h3 class="font-blue-sharp">
                        <span data-counter="counterup"
                              data-value="{{ number_format($roomPrice, 0, '.', '.') }}">{{ number_format($roomPrice, 0, '.', '.') }}{{\App\Components\Functions::moneyUnit()}}</span>
                    </h3>
                    <small>Tổng thu tiền nhà</small>
                </div>
            </div>
            <div class="progress-info">
                <div class="progress">
                                            <span style="width: {{ round($roomPrice / $sum * 100, 2) }}%;"
                                                  class="progress-bar progress-bar-success blue-sharp">
                                                <span class="sr-only">{{ round($roomPrice / $sum * 100, 2) }}%</span>
                                            </span>
                </div>
                <div class="status">
                    <div class="status-number"> {{ round($roomPrice / $sum * 100, 2) }}%</div>
                </div>
            </div>
        </div>
    </div>

    <div class="col-lg-3 col-md-3 col-sm-3 col-xs-6">
        <div class="dashboard-stat2 ">
            <div class="display">
                <div class="number">
                    <h3 class="font-red-haze">
                        <span data-counter="counterup"
                              data-value="{{ number_format($deposit, 0, '.', '.') }}">{{ number_format($deposit, 0, '.', '.') }}{{\App\Components\Functions::moneyUnit()}}</span>
                    </h3>
                    <small>TỔNG THU TIỀN CỌC</small>
                </div>

            </div>
            <div class="progress-info">
                <div class="progress">
                                            <span style="width: {{ round($deposit / $sum * 100, 2) }}%;"
                                                  class="progress-bar progress-bar-success red-haze">
                                                <span class="sr-only">{{ round($deposit / $sum * 100, 2) }}%</span>
                                            </span>
                </div>
                <div class="status">
                    <div class="status-number"> {{ round($deposit / $sum * 100, 2) }}%</div>
                </div>
            </div>
        </div>
    </div>
    <div class="col-lg-3 col-md-3 col-sm-3 col-xs-6">
        <div class="dashboard-stat2 ">
            <div class="display">
                <div class="number">
                    <h3 class="font-purple-soft">
                        <span data-counter="counterup" data-value="{{ number_format($service, 0, '.', '.') }}">{{ number_format($service, 0, '.', '.') }}{{\App\Components\Functions::moneyUnit()}}</span>
                    </h3>
                    <small>TỔNG THU DỊCH VỤ</small>
                </div>

            </div>
            <div class="progress-info">
                <div class="progress">
                                            <span style="width: {{ round($service / $sum * 100, 2) }}%;" class="progress-bar progress-bar-success purple-soft">
                                                <span class="sr-only">{{ round($service / $sum * 100, 2) }}%</span>
                                            </span>
                </div>
                <div class="status">
                    <div class="status-number"> {{ round($service / $sum * 100, 2) }}% </div>
                </div>
            </div>
        </div>
    </div>
    {{--<div class="col-lg-4 col-md-4 col-sm-4 col-xs-6">--}}
        {{--<div class="dashboard-stat2 ">--}}
            {{--<div class="display">--}}
                {{--<div class="number">--}}
                    {{--<h3 class="font-green-sharp">--}}
                        {{--<span data-counter="counterup"--}}
                              {{--data-value="{{ number_format($other, 0, '.', '.') }}">{{ number_format($other, 0, '.', '.') }}{{\App\Components\Functions::moneyUnit()}}</span>--}}
                    {{--</h3>--}}
                    {{--<small>Tổng thu khác</small>--}}
                {{--</div>--}}
            {{--</div>--}}
            {{--<div class="progress-info">--}}
                {{--<div class="progress">--}}
                                            {{--<span style="width: {{ round(($other) / $sum * 100, 2) }}%;"--}}
                                                  {{--class="progress-bar progress-bar-success green-sharp">--}}
                                                {{--<span class="sr-only">{{ round(($other) / $sum * 100, 2) }}%</span>--}}
                                            {{--</span>--}}
                {{--</div>--}}
                {{--<div class="status">--}}
                    {{--<div class="status-number"> {{ round(($other) / $sum * 100, 2) }}%</div>--}}
                {{--</div>--}}
            {{--</div>--}}
        {{--</div>--}}
    {{--</div>--}}

@else

    <div class="col-lg-4 col-md-4 col-sm-6 col-xs-12">
        <div class="dashboard-stat2 ">
            <div class="display">
                <div class="number">
                    <h3 class="font-red-haze">
                        <span data-counter="counterup"
                              data-value="{{ number_format($sum, 0, '.', '.') }}">{{ number_format($sum, 0, '.', '.') }}{{\App\Components\Functions::moneyUnit()}}</span>
                    </h3>
                    <small>TỔNG CHI</small>
                </div>

            </div>
            <div class="progress-info">
                <div class="progress">
                                            <span style="width: 100%;"
                                                  class="progress-bar progress-bar-success red-haze">
                                                <span class="sr-only">100%</span>
                                            </span>
                </div>
                <div class="status">
                    <div class="status-number"> 100%</div>
                </div>
            </div>
        </div>
    </div>
    @php
        $other = $sum - $deposit;
                if($sum == 0)
        {
        $sum = 1;
        $deposit = 0;
        $other = 0;
        }
    @endphp
    <div class="col-lg-4 col-md-4 col-sm-6 col-xs-12">
        <div class="dashboard-stat2 ">
            <div class="display">
                <div class="number">
                    <h3 class="font-purple">
                        <span data-counter="counterup"
                              data-value="{{ number_format($deposit, 0, '.', '.') }}">{{ number_format($deposit, 0, '.', '.') }}{{\App\Components\Functions::moneyUnit()}}</span>
                    </h3>
                    <small>TỔNG CHI CỌC</small>
                </div>

            </div>
            <div class="progress-info">
                <div class="progress">

                                            <span style="width: {{ round($deposit / $sum * 100, 2) }}%;"
                                                  class="progress-bar progress-bar-success purple">
                                                <span class="sr-only">{{ round($deposit / $sum * 100, 2) }}%</span>
                                            </span>
                </div>
                <div class="status">

                    <div class="status-number"> {{ round($deposit / $sum * 100, 2) }}%</div>
                </div>
            </div>
        </div>
    </div>

    <div class="col-lg-4 col-md-4 col-sm-6 col-xs-12">
        <div class="dashboard-stat2 ">
            <div class="display">
                <div class="number">
                    <h3 class="font-green-haze">
                        <span data-counter="counterup"
                              data-value="{{ number_format($other, 0, '.', '.') }}">{{ number_format($other, 0, '.', '.') }}{{\App\Components\Functions::moneyUnit()}}</span>
                    </h3>
                    <small>TỔNG CHI KHÁC</small>
                </div>

            </div>
            <div class="progress-info">
                <div class="progress">
                                            <span style="width: {{ round(($other) / $sum * 100, 2) }}%;"
                                                  class="progress-bar progress-bar-success green-haze">
                                                <span class="sr-only">{{ round(($other) / $sum * 100, 2) }}%</span>
                                            </span>
                </div>
                <div class="status">
                    <div class="status-number"> {{ round(($other) / $sum * 100, 2) }}%</div>
                </div>
            </div>
        </div>
    </div>


@endif