@extends('layouts.master')

@section('page-css')
@endsection
@section('content')
 <div class="subheader">
    <h1 class="subheader-title">
        Dashboard
    </h1>
</div>
        <?php
            $jumlah = json_decode(@$profile->data_jumlah);
        ?>

@if(@$dok->status == 1)
    <div class="card mb-2 bg-success-light text-success">
        <div class="card-body">
            <h4 class="fw-500"><i class="fal fa-info-circle"></i>&nbsp;Verifikasi Kuesioner Leveling</h4>
            <p>Kuesioner Anda telah di-approve dan dinyatakan valid. Silakan melanjutkan ke tahapan berikutnya.</p>
            <a href="{{ url('usulan/adiwiyata/kriteria') }}" class="btn btn-info">Pemenuhan Kriteria &nbsp; <i class="fal fa-arrow-right"></i></a>
        </div>
    </div>
@endif
<div class="row mb-2">
    <div class="col-md-6 mb-2">
        <div class="card h-100">
            <div class="card-body">
                <div id="container"></div>
            </div>
        </div>
    </div>
    
    <div class="col-md-6 mb-2">
        <div class="row">
            <div class="col-6 col-sm-12 col-xl-12 mb-2">
                <div class="card bg-primary-light border-left-primary text-primary">
                    <div class="card-body">
                        <div class="d-flex flex-row  justify-content-between align-items-center">
                            <div>
                                <span class="m-0 l-h-n fw-500">Total Sampah Organik</span> <br><br>
                                <h3 class="f20 fw-700 ">{{number_format(@$summary->organik)}} <span class="f12 fw-300">Kg</span> </h3>
                            </div>
                            <div>
                                <div class="p-2 bg-white rounded-circle">
                                    <i class="fal fa-recycle f16 text-primary"></i>
                                </div> 
                            </div>
                        </div>
                    </div>
                </div>
            </div>
            <div class="col-6 col-sm-12 col-xl-12 mb-2">
                <div class="card bg-warning-light border-left-warning text-warning">
                    <div class="card-body">
                        <div class="d-flex flex-row  justify-content-between align-items-center">
                            <div>
                                <span class="m-0 l-h-n fw-500">Total Sampah Anorganik</span> <br><br>
                                <h3 class="f20 fw-700 ">{{number_format(@$summary->anorganik)}} <span class="f12 fw-300">Kg</span> </h3>
                            </div>
                            <div>
                                <div class="p-2 bg-white rounded-circle">
                                    <i class="fal fa-recycle f16 text-warning"></i>
                                </div> 
                            </div>
                        </div>
                    </div>
                </div>
            </div>
        
            <div class="col-6 col-sm-12 col-xl-12 mb-2">
                <div class="card bg-info-light border-left-info text-info">
                    <div class="card-body">
                        <div class="d-flex flex-row  justify-content-between align-items-center">
                            <div>
                                <span class="m-0 l-h-n fw-500">Total Sampah B3</span> <br><br>
                                <h3 class="f20 fw-700 ">{{number_format(@$summary->b3)}} <span class="f12 fw-300">Kg</span> </h3>
                            </div>
                            <div>
                                <div class="p-2 bg-white rounded-circle">
                                    <i class="fal fa-recycle f16 text-info"></i>
                                </div> 
                            </div>
                        </div>
                    </div>
                </div>
            </div>
            <div class="col-6 col-sm-12 col-xl-12 mb-2">
                <div class="card bg-success-light border-left-success text-success">
                    <div class="card-body">
                        <div class="d-flex flex-row  justify-content-between align-items-center">
                            <div>
                                <span class="m-0 l-h-n fw-500">Total Sampah Minyak Jelantah</span> <br><br>
                                <h3 class="f20 fw-700 ">{{number_format(@$summary->minyak)}} <span class="f12 fw-300">Kg</span> </h3>
                            </div>
                            <div>
                                <div class="p-2 bg-white rounded-circle">
                                    <i class="fal fa-tint f16 text-success"></i>
                                </div> 
                            </div>
                        </div>
                    </div>
                </div>
            </div>
        </div>
    </div>

</div>

<div class="row mb-4">
    <div class="col-md-6 mb-2">
        <div class="card">
            <div class="card-body">
                <div class="d-flex gap-2">
                    <div class="d-flex justify-content-center align-items-center gap-3">
                        <img src="{{ asset('assets/school.jpg') }}" class="img-fluid" width="180" alt="">
                        <div class="d-flex flex-column">
                            <h3 class="fw-700">{{@$profile->sekolah->nama_sekolah}}</h3>
                            <div class="d-flex gap-1 align-items-start mb-2">
                                <span class="p-2 badge bg-primary text-white">{{session('tingkat_sekolah')}}</span>
                                <span class="p-2 badge bg-success text-white">{{session('status_sekolah')}}</span>
                                <h6 class="p-2 badge bg-warning text-white">Level {{@levelAdiwiyata(session('npsn'))}}</h6>
                            </div>
                            <h5 class="f14 text-primary">NPSN : {{@$profile->sekolah->npsn}}</h5>
                        </div>
                    </div>
                </div>
                <hr class="mt-0">
                <h6 class="fw-500">DATA SEKOLAH</h6>
                <div class="d-flex flex-column gap-2 mb-3">
                    <div class="d-flex justify-content-between align-items-center">
                        <span>Jumlah Siswa</span>
                        <span class="badge bg-success text-white fw-500">{{@$jumlah ? @$jumlah->jumlah_peserta_didik : 0}}</span>
                    </div>
                    <div class="d-flex justify-content-between align-items-center">
                        <span>Jumlah Guru</span>
                        <span class="badge bg-success text-white fw-500">{{@$jumlah ? @$jumlah->jumlah_tenaga_pendidik : 0}}</span>
                    </div>
                    <div class="d-flex justify-content-between align-items-center">
                        <span>Penghargaan Terakhir</span>
                        <span class="badge bg-success text-white fw-500">{{@getPenghargaanTerakhir(session('sekolah_id'))}}</span> 
                    </div>
                    <div class="d-flex justify-content-between align-items-center">
                        <span>Proses Usulan</span>
                        
                            @if(@$kuesioner->KuesionerId)
                                <span class="badge bg-success text-white fw-500">
                                    {!!@kuesionerLogStatus(@$kuesioner->KuesionerId,'plain')!!}
                                </span> 
                            @else
                                {!! StatusActivity(session('sekolah_id')) !!}
                            @endif
                        
                    </div>
                </div>

                <div class="d-flex flex-column gap-1">
                    <div>
                        <hr class="mt-0">
                        <h6 class="fw-500">ALAMAT</h6>
                        <p class="text-muted">{{session('alamat_sekolah')}}</p>
                    </div>
                    <div>
                        <hr class="mt-0">
                        <h6 class="fw-500">KONTAK</h6>
                        <div class="d-flex flex-row gap-3 justify-content-start mt-3">
                            <div>
                                <div class="p-3 bg-secondary rounded">
                                    <i class="fal fa-mobile f20"></i>  
                                </div>
                            </div>
                            <div class="d-flex flex-column align-items-left justify-content-center">
                                <span class="text-muted">{{session('kontak_person')}}</span>
                                <span class="text-muted">{{session('telp')}}</span>
                            </div>
                        </div>
                    </div>
                </div>
                
            </div>
        </div>
        
    </div>
    <div class="col-md-6 mb-2">
        <div class="card h-100">
            {{-- <div class="card-header bg-primary-light text-primary">
                <h5 class="fw-500 mb-0"><i class="fal fa-trophy"></i>&nbsp;Riwayat Usulan</h5>
            </div> --}}
            <div class="card-body">
                <div class="">
                    @if(@$kuesioner || (@$kuesioner->status == 1))
                        <?php
                            if(@$kuesioner->level == 0){
                                $textLevel = 'Kabupaten/Kota';
                            }elseif(@$kuesioner->level == 1){
                                $textLevel = 'Provinsi';
                            }elseif(@$kuesioner->level == 2){
                                $textLevel = 'Nasional';
                            }elseif(@$kuesioner->level == 3){
                                $textLevel = 'Mandiri';
                            }
                        ?>
                        <div class="alert bg-primary-light text-primary mb-3">
                            <i class="fal fa-info-circle"></i>   Sekolah diusulan untuk menjadi CSA (Calon Sekolah Adiwiyata) {{@$textLevel}}
                        </div>
                        <h5 class="fw-500 mb-3"><i class="fal fa-trophy"></i>&nbsp;Riwayat Usulan</h5>
                        <div class="d-flex flex-column gap-2">
                            <div class="d-flex justify-content-between">
                                <div>Status Usulan</div>
                                <div>{!! kuesionerLogStatus(@$kuesioner->KuesionerId) !!}</div>
                            </div>
                            <div class="d-flex justify-content-between">
                                <div>Penghargaan Terakhir</div>
                                <div>
                                    @if(@getPenghargaanTerakhir(session('sekolah_id')) == 'Belum Pernah')
                                        
                                        <?php
                                        if(@$sk->jenis_usulan == 0){
                                            $penghargaan = '<span class="badge bg-success text-white">Belum Pernah</span>';
                                        }elseif(@$sk->jenis_usulan == 1){
                                            $penghargaan = '<span class="badge bg-success text-white">Adiwiyata Kab/Kota</span>';
                                        }elseif(@$sk->jenis_usulan == 2){
                                            $penghargaan = '<span class="badge bg-success text-white">Adiwiyata Provinsi</span>';
                                        }elseif(@$sk->jenis_usulan == 3){
                                            $penghargaan = '<span class="badge bg-success text-white">Adiwiyata Nasional</span>';
                                        }elseif(@$sk->jenis_usulan == 4){
                                            $penghargaan = '<span class="badge bg-success text-white">Adiwiyata Mandiri</span>';
                                        }
                                        ?>
                                        {!!$penghargaan!!}
                                    @else
                                        {{@getPenghargaanTerakhir(session('sekolah_id'))}}
                                    @endif
                                </div>
                            </div>
                            <div class="d-flex justify-content-between">
                                <div>Tanggal Penetapan SK</div>
                                <div>{{@$sk ? @$sk->tanggal_penetapan : '-'}}</div>
                            </div>
                            <div class="d-flex justify-content-between">
                                <div>Lampiran SK</div>
                                <div>
                                    @if(@$sk)
                                        <a download href="{{ asset('uploads/'.@$sk->file) }}" class="btn btn-sm btn-warning" style="width: 100%;"><i class="fal fa-download"></i> SK Adiwiyata</a>
                                    @else
                                        -
                                    @endif
                                </div>
                            </div>
                        </div>
                    @else
                        <div class="alert alert-danger text-danger">
                            <i class="fal fa-info-circle"></i> Belum ada data usulan
                        </div>
                    @endif
                </div>
                
            </div>
        </div>
    </div>
</div>
@endsection
@section('page-js')
<script src="{{ asset('assets/js/highcharts.js') }}"></script>
<script>
    let series = @json($series);

    Highcharts.chart('container', {
    chart: {
        type: 'column'
    },
    title: {
        text: 'Data Sampah Terkelola Tahun {{ date("Y") }}'
    },
    xAxis: {
        categories: ["Jan",
                    "Feb",
                    "Mar",
                    "Apr",
                    "Mei",
                    "Jun",
                    "Jul",
                    "Agust",
                    "Sept",
                    "Okt",
                    "Nov",
                    "Des"],
        crosshair: true,
        accessibility: {
            description: 'Countries'
        }
    },
    yAxis: {
        min: 0,
        title: {
            text: '(Kg)'
        }
    },
    tooltip: {
        valueSuffix: ' (Kg)'
    },
    plotOptions: {
        column: {
            pointPadding: 0.2,
            borderWidth: 0
        }
    },
    series: series
});
</script>
@endsection