@extends('layouts.base')
@section('content')
<!-- Content Header (Page header) -->
<section class="content-header">
    <h2>
        <i class="fa fa-list"></i> របាយការណ៍បញ្ជីគ្រួសារ
        <!--<small>Version 2.0</small>-->
    </h2>
    <ol class="breadcrumb">
        <li><a href="{{ url('/') }}"><i class="fa fa-dashboard"></i> ទំព័រដើម</a></li>
        <li class="active">ទិន្នន័យបញ្ជីគ្រួសារ(ក៣)</li>
        <li class="active">របាយការណ៍</li>
    </ol>
</section>

<!-- Main content -->
<section class="content">
    <div class="row">
        <div class="col-xs-12">
            <div class="box-body">
                @if ($errors->any())
                <div class="alert alert-danger">
                    <ul>
                        @foreach ($errors->all() as $error)
                        <li>{{ $error }}</li>
                        @endforeach
                    </ul>
                    <button style="position: relative; top: -20px;" class="close" data-dismiss="alert"
                        type="button">×</button>
                </div><br />
                @endif

                @if (session()->has('success'))
                <div class="alert alert-success">
                    @if(is_array(session()->get('success')))
                    <ul>
                        @foreach (session()->get('success') as $message)
                        <li>{{ $message }}</li>
                        @endforeach
                    </ul>
                    @else
                    {{ session()->get('success') }}
                    @endif
                    <button class="close" data-dismiss="alert" type="button">×</button>
                </div>
                @endif
                <form method="post" name="frm_report" action="{{route('familybook.generate-report')}}"
                    onsubmit="return checkSubmit()" target="_blank">
                    {{ csrf_field() }}
                    <table class="table">
                        <tr>
                            <td>
                                <div class="form-group">
                                    <label for="report_type">ប្រភេទរបាយការណ៍<span style="color:#f00">*</span></label>

                                    {!! Form::select(
                                    'report_type',
                                    $reportTypes,
                                    1,
                                    [
                                    'placeholder' => 'ជ្រើសរើស របាយការណ៍',
                                    'required' => true,
                                    'id'=>'report_type',
                                    'class' => 'form-control',
                                    ])
                                    !!}
                                </div>
                            </td>
                            <td id="pro_td">
                                <div class="form-group">
                                    <label for="pro_code">រាជធានី/ខេត្ត</label>
                                    {!! Form::select(
                                    'pro_code',
                                    $provinces,
                                    1,
                                    [
                                    'placeholder' => 'ជ្រើសរើស រាជធានី/ខេត្ត',
                                    'id'=>'pro_code',
                                    'class' => 'form-control',
                                    ])
                                    !!}
                                </div>
                            </td>
                            <td id="year_td">
                                <div class="form-group">
                                    <label for="year">ឆ្នាំ<span style="color:#f00">*</span></label>
                                    <select class="form-control" id="year" name="year">
                                        <option value="">ជ្រើសរើស ឆ្នាំ</option>
                                        @foreach ($years as $item)
                                        <option value="{{ $item }}" {{ ($item == date('Y')) ? 'selected' : '' }}>
                                            {{ $item}} </option>
                                        @endforeach
                                    </select>
                                </div>
                            </td>
                            <td id="quarter_td">
                                <div class="form-group">
                                    <label for="quarter">ត្រីមាស</label>
                                    {!! Form::select(
                                    'quarter',
                                    $quarters,
                                    null,
                                    [
                                    'placeholder' => 'ជ្រើសរើស ត្រីមាស',
                                    'id'=>'quarter',
                                    'class' => 'form-control',
                                    ])
                                    !!}
                                </div>
                            </td>
                            <td style="vertical-align: bottom;">
                                <table style="margin-bottom: 3px">
                                    <tr>
                                        <!--
                                    <td style="padding-right: 3px">
                                        <button type="submit" name="exportxls" value="Export to Excel" class="btn btn-info"><i class="fa fa-download"></i>&nbsp;ទាញយក</button>
                                    </td>
                                    -->
                                        <td>
                                            <button type="submit" name="printpdf" value="Print to Pdf"
                                                class="btn btn-primary"><i class="fa fa-print"></i> ពិនិត្យ & បោះពុម្ភ</button>
                                        </td>
                                    </tr>
                                </table>
                            </td>
                        </tr>
                    </table>
                </form>
            </div>
        </div>
    </div>
</section>
<!-- /.content -->
@endsection

@push('scripts')
<script>
function checkSubmit() {
    var reportType = document.frm_report.report_type.value;
    var province = document.frm_report.pro_code.value;
    var year = document.frm_report.year.value;
    var quarter = document.frm_report.quarter.value;
    if (reportType == '') {
        alert('សូមជ្រើសរើសរបាយការណ៍!');
        return false;
    } else {
        if (reportType == '2' && province == '') {
            alert('សូមជ្រើសរើស រាជធានី/ខេត្ត!');
            return false;
        } else if (reportType == '3' && year == '') {
            alert('សូមជ្រើសរើស ឆ្នាំ!');
            return false;
        } else if (reportType == '4' && (year == '' || quarter == '')) {
            alert('អ្នកត្រូវជ្រើសរើស ឆ្នាំ​និងត្រីមាស!');
            return false;
        } else {
            return true;
        }
    }
    return true;
}
$(document).ready(function() {
    $('#pro_td').find('.form-group').css('display', 'none');
    $('#year_td').find('.form-group').css('display', 'none');
    $('#quarter_td').find('.form-group').css('display', 'none');
    $reportSelect =   $("#report_type");
    $reportSelect.on('change', function() {
        var value = $(this).val();
        $('.overloader').fadeIn('fast');
        if (value == '' || value == 1) {
                $('#pro_td').find('.form-group').css('display', 'none');
                $('#year_td').find('.form-group').css('display', 'none');
                $('#quarter_td').find('.form-group').css('display', 'none');
            } else if (value == 2) {
                $('#pro_td').find('.form-group').css('display', 'block');
                $('#year_td').find('.form-group').css('display', 'none');
                $('#quarter_td').find('.form-group').css('display', 'none');
            } else if (value == 3) {
                $('#pro_td').find('.form-group').css('display', 'block');
                $('#year_td').find('.form-group').css('display', 'block');
                $('#quarter_td').find('.form-group').css('display', 'none');
            } else {
                $('#pro_td').find('.form-group').css('display', 'block');
                $('#year_td').find('.form-group').css('display', 'block');
                $('#quarter_td').find('.form-group').css('display', 'block');
            }
            $('.overloader').fadeOut('fast');
    });
    // $("#report_type").selectmenu({
    //     change: function(event, ui) {
    //         var value = $(this).val();
    //         if (value == '' || value == 1) {
    //             $('#pro_td').find('.form-group').css('display', 'none');
    //             $('#year_td').find('.form-group').css('display', 'none');
    //             $('#quarter_td').find('.form-group').css('display', 'none');
    //         } else if (value == 2) {
    //             $('#pro_td').find('.form-group').css('display', 'block');
    //             $('#year_td').find('.form-group').css('display', 'none');
    //             $('#quarter_td').find('.form-group').css('display', 'none');
    //         } else if (value == 3) {
    //             $('#pro_td').find('.form-group').css('display', 'block');
    //             $('#year_td').find('.form-group').css('display', 'block');
    //             $('#quarter_td').find('.form-group').css('display', 'none');
    //         } else {
    //             $('#pro_td').find('.form-group').css('display', 'block');
    //             $('#year_td').find('.form-group').css('display', 'block');
    //             $('#quarter_td').find('.form-group').css('display', 'block');
    //         }
    //     }
    // });

})
</script>

@endpush