IMMREX7

@extends('schools.school_layout')
@section('content')
<div class="container-fluid">
    <div class="row clearfix">
        <div class="col-lg-3 col-md-6 col-sm-12 text-center">
            <div class="card tasks_report">
                <div class="body">
                    <i class="zmdi zmdi-account col-amber"  style="font-size: 30px;"></i>
                    <h4 class="m-b-0 m-t-10  number count-to" data-from="0" data-to="{{ $data['hostelite']}}" data-speed="1000"
                            data-fresh-interval="700">{{ $data['hostelite']}}</h4>
                            <span>Hostelites</span>
                    <small class="displayblock"><a href="/school/hostelites">View Details <i
                                class="zmdi zmdi-eye"></i></a></small>
                </div>
            </div>
        </div>
        <div class="col-lg-3 col-md-6 col-sm-12 text-center">
            <div class="card tasks_report">
                <div class="body">
                <i class="zmdi zmdi-layers col-blue"  style="font-size: 30px;"></i>
                    <h4 class="m-b-0 m-t-10  number count-to" data-from="0" data-to="{{ $data['rooms']}}" data-speed="1000"
                            data-fresh-interval="700">{{ $data['rooms']}}</h4>
                            <span>Rooms</span>
                    <small class="displayblock"><a href="/school/floor-rooms">View Details <i
                                class="zmdi zmdi-eye"></i></a></small>

                </div>
            </div>
        </div>
        <div class="col-lg-3 col-md-6 col-sm-12 text-center">
            <div class="card tasks_report">
                <div class="body">
                <i class="zmdi zmdi-dns col-red"  style="font-size: 30px;"></i>
                    <h4 class="m-b-0 m-t-10 number count-to" data-from="0" data-to="{{ $data['beds']}}" data-speed="1000"
                            data-fresh-interval="700">{{ $data['beds']}}</h4>
                            <span>Beds</span>
                    <small class="displayblock"><a href="/school/beds">View Details <i
                                class="zmdi zmdi-eye"></i></a></small>

                </div>
            </div>
        </div>
        <div class="col-lg-3 col-md-6 col-sm-12 text-center">
            <div class="card tasks_report">
                <div class="body">
                <i class="zmdi zmdi-assignment-check text-success"  style="font-size: 30px;"></i>
                    <h4 class="m-b-0 m-t-10 number count-to" data-from="0" data-to="{{ $data['assign']}}" data-speed="1000"
                            data-fresh-interval="700">{{ $data['assign']}}</h4>
                            <span>Bed Assigned</span>
                    <small class="displayblock"><a href="/hostelites/create">View Details <i
                                class="zmdi zmdi-eye"></i></a></small>

                </div>
            </div>
        </div>
        <div class="col-lg-3 col-md-6 col-sm-12">
            <div class="card">
                <div class="body text-center">
                    <i class="zmdi zmdi-dns text-info"  style="font-size: 30px;"></i>
                    <h4 class="m-b-0 m-t-10 number count-to" data-from="0" data-to="{{ $data['beds'] - $data['assign']}}" data-speed="1000"
                            data-fresh-interval="700">{{ $data['beds'] - $data['assign']}}</h4>
                            <span>Available Beds</span>
                    <small class="displayblock"><a href="/school/hostelites">View Details <i
                                class="zmdi zmdi-eye"></i></a></small>
                </div>
            </div>
        </div>
        <div class="col-lg-3 col-md-6 col-sm-12">
            <div class="card">
                <div class="body text-center">
                    <i class="zmdi zmdi-assignment-return text-warning" style="font-size: 30px;"></i>
                    <h4 class="m-b-0 m-t-10 number count-to" data-from="0" data-to="{{ $data['unapproved']}}" data-speed="1000"
                            data-fresh-interval="700">{{ $data['unapproved']}}</h4>
                    <span>Unapproved Leaves</span>
                    <small class="displayblock"><a href="/school/hostel-leaves">View Details <i
                                class="zmdi zmdi-eye"></i></a></small>
                </div>
            </div>
        </div>
    </div>
    <div class="row clearfix">
        <div class="col-lg-12">
            <h3>Payment Collections</h3>
        </div>
        <div class="col-lg-12">
            <div class="card">
                <ul class="row profile_state list-unstyled">
                    <li class="col-lg-3 col-md-3 col-6">
                        <div class="body">
                            <i class="zmdi zmdi-trending-up col-blue"></i>
                            <h4>₹{{$data['total']}}</h4>
                            <span>Total Collection</span>
                        </div>
                    </li>
                    <li class="col-lg-3 col-md-3 col-6">
                        <div class="body">
                            <i class="zmdi zmdi-trending-down col-red"></i>
                            <h4>₹{{$data['fee'] - $data['total']}}</h4>
                            <span>Payment Due</span>
                        </div>
                    </li>
                    <li class="col-lg-3 col-md-3 col-6">
                        <div class="body">
                            <i class="zmdi zmdi-trending-down col-red"></i>
                            <h4> @if($data['overdue'] >= 0) ₹{{$data['overdue']}} @else ₹0 @endif</h4>
                            <span>Payment Overdue</span>
                        </div>
                    </li>
                    <li class="col-lg-3 col-md-3 col-6">
                        <div class="body">
                            <i class="zmdi zmdi-trending-down col-red"></i>
                            <h4>₹{{$data['fine']}}</h4>
                            <span>Fine Collected</span>
                        </div>
                    </li>
                </ul>
            </div>
        </div>
    </div>
    <div class="row clearfix">
        <div class="col-lg-6 col-md-6">
            <div class="card">
                <div class="header">
                    <h2><strong>Bed Allotment Overiew</strong> </h2>
                    <ul class="header-dropdown">
                        <li class="remove">
                            <a role="button" class="boxs-close"><i class="zmdi zmdi-close"></i></a>
                        </li>
                    </ul>
                </div>
                <div class="body">
                    <ul class="country-state list-unstyled">
                        <li class="m-b-20">
                            <h6>{{$data['beds']}}</h6>
                            <small>Bed</small>
                            <div class="float-right">100%
                                <i class="fa fa-level-up text-success"></i>
                            </div>
                            <div class="progress">
                                <div class="progress-bar progress-bar-success" role="progressbar" aria-valuenow="50"
                                    aria-valuemin="0" aria-valuemax="100" style="width:100%;">
                                    <span class="sr-only">100% Complete</span>
                                </div>
                            </div>
                        </li>
                        @php $assignP = round(($data['assign'] / $data['beds']) * 100); @endphp
                        <li class="m-b-20">
                            <h6>{{$data['assign']}}</h6>
                            <small>Bed Assign</small>
                            <div class="float-right">{{$assignP}}%
                                <i class="fa fa-level-up text-success"></i>
                            </div>
                            <div class="progress">
                                <div class="progress-bar progress-bar-inverse" role="progressbar" aria-valuenow="50"
                                    aria-valuemin="0" aria-valuemax="100" style="width:{{$assignP}}%;">
                                    <span class="sr-only">{{$assignP}}% Complete</span>
                                </div>
                            </div>
                        </li>
                        <li class="m-b-20">
                            @php $unassignP = round (( ($data['beds'] -  $data['assign']) / $data['beds']) * 100); @endphp
                            <h6>{{$data['beds'] -  $data['assign']}}</h6>
                            <small>Available Bed</small>
                            <div class="float-right">{{$unassignP}}%
                                <i class="fa fa-level-down text-danger"></i>
                            </div>
                            <div class="progress">
                                <div class="progress-bar progress-bar-danger" role="progressbar" aria-valuenow="50"
                                    aria-valuemin="0" aria-valuemax="100" style="width:{{$unassignP}}%;">
                                    <span class="sr-only">{{$unassignP}}% Complete</span>
                                </div>
                            </div>
                        </li>
                    </ul>
                </div>
            </div>
        </div>
        <div class="col-lg-6 col-md-6">
            <div class="card">
                <div class="header">
                    <h2><strong>Grade</strong> Graph</h2>
                    <ul class="header-dropdown">
                        <li class="remove">
                            <a role="button" class="boxs-close"><i class="zmdi zmdi-close"></i></a>
                        </li>
                    </ul>
                </div>
                <div class="body">
                    <div id="m_donut_chart"></div>
                </div>
            </div>
        </div>


    </div>
    <div class="row clearfix">
        <div class="col-md-12">
            <div class="card">
                <div class="header">
                    <h2><strong>Student Event</strong> Calendar</h2>
                </div>
                <div class="body">
                    <div id="calendar"></div>
                </div>
            </div>
        </div>
    </div>

</div>
@stop
@section('script')
<script>
    @php $k =0;@endphp
    var stuObj = [];
    var msg = <?php echo json_encode($data['student_calendar']); ?>;
        Object.keys(msg).forEach(function (item) {
            var itemObj = [];
            itemObj["title"] = msg[item]["holidayName"];
            itemObj["start"] = msg[item]["fromDate"];
            itemObj["end"] = msg[item]["toDate"];
            if (itemObj["start"] == itemObj["end"]) {
                itemObj["className"] = "b-l b-2x b-amethyst";
            } else
                itemObj["className"] = "bg-cyan";

            stuObj.push(itemObj);
        });
        console.log(stuObj);
    $(function () {
        "use strict";
        MorrisDonutChart();
        $('.knob').knob({
            draw: function () {
                // "tron" case
                if (this.$.data('skin') == 'tron') {

                    var a = this.angle(this.cv)  // Angle
                        , sa = this.startAngle          // Previous start angle
                        , sat = this.startAngle         // Start angle
                        , ea                            // Previous end angle
                        , eat = sat + a                 // End angle
                        , r = true;

                    this.g.lineWidth = this.lineWidth;

                    this.o.cursor
                        && (sat = eat - 0.3)
                        && (eat = eat + 0.3);

                    if (this.o.displayPrevious) {
                        ea = this.startAngle + this.angle(this.value);
                        this.o.cursor
                            && (sa = ea - 0.3)
                            && (ea = ea + 0.3);
                        this.g.beginPath();
                        this.g.strokeStyle = this.previousColor;
                        this.g.arc(this.xy, this.xy, this.radius - this.lineWidth, sa, ea, false);
                        this.g.stroke();
                    }

                    this.g.beginPath();
                    this.g.strokeStyle = r ? this.o.fgColor : this.fgColor;
                    this.g.arc(this.xy, this.xy, this.radius - this.lineWidth, sat, eat, false);
                    this.g.stroke();

                    this.g.lineWidth = 2;
                    this.g.beginPath();
                    this.g.strokeStyle = this.o.fgColor;
                    this.g.arc(this.xy, this.xy, this.radius - this.lineWidth + 1 + this.lineWidth * 2 / 3, 0, 2 * Math.PI, false);
                    this.g.stroke();

                    return false;
                }
            }
        });
        $('#calendar').fullCalendar({
            header: {
                left: 'prev',
                center: 'title',
                right: 'next'
            },
            defaultDate: "{{\Carbon\Carbon::now()->format('Y-m-d')}}",
            editable: false,
            droppable: false,
            eventLimit: true, // allow "more" link when too many events
            events: stuObj
        });
    });


    // Morris donut chart
    function MorrisDonutChart() {
        Morris.Donut({
            element: 'm_donut_chart',
            data: [
                @foreach($classes as $var)
                {
                    label: "{{$var['className']}}",
                    value: {{$var['count']}},

                },
                @endforeach
            ],
            resize: true,
            colors: [
                '#ffd97f', '#fab2c0', '#80dad8', '#a1abb8',
                @foreach($classes as $var)
                <?php $k++;?>
                '{{rand_color($k)}}',
                @endforeach
            ]
        });
        $("#m_donut_chart tspan").css("font-size","13px");
        $( "#m_donut_chart" ).mouseover(function() {
            $("#m_donut_chart tspan").css("font-size","13px");
        });
    }
</script>
@stop