@extends('layouts.app2')

@section('dynamic_css')
<style>
    .f-600 {
        font-weight: 600;
    }

    .f-13 {
        font-size: 13px !important;
    }

    .v-errors {
        background-color: #eee;
        list-style: disc;
        border: 2px solid red;
        padding: 5px 20px;
        color: darkred;
    }
</style>
@endsection
@section('badcome')

@endsection

@section('content')
<div class="container">
<form method="get" action="">
    <div class="row justify-content-center">
        
        <div class="col-md-8 form-group">
           <div class="row">
        
            <div class="col-sm-4 text-center" style=" padding-top: .38rem;padding-bottom: .38rem;">
                <select name="m" id="month_achieved" class="form-control form-control-sm text-center">
                    <option value="" selected disabled>====== Select Month ======</option>
                    <option value="1" @if($month==1) {{'selected'}} @endif>January</option>
                    <option value="2" @if($month==2) {{'selected'}} @endif>February</option>
                    <option value="3" @if($month==3) {{'selected'}} @endif>March</option>
                    <option value="4" @if($month==4) {{'selected'}} @endif>April</option>
                    <option value="5" @if($month==5) {{'selected'}} @endif>May</option>
                    <option value="6" @if($month==6) {{'selected'}} @endif>June</option>
                    <option value="7" @if($month==7) {{'selected'}} @endif>July</option>
                    <option value="8" @if($month==8) {{'selected'}} @endif>August</option>
                    <option value="9" @if($month==9) {{'selected'}} @endif>September</option>
                    <option value="10" @if($month==10) {{'selected'}} @endif>October</option>
                    <option value="11" @if($month==11) {{'selected'}} @endif>November</option>
                    <option value="12" @if($month==12) {{'selected'}} @endif>December</option>
                </select>
            </div>
            <div class="col-sm-4 text-center" style=" padding-top: .38rem;padding-bottom: .38rem;">
                <select name="y" id="year_achieved" class="form-control form-control-sm text-center">
                    <option value="" selected disabled>====== Select Year ======</option>
                    <option value="2018"  @if($year==2018) {{'selected'}} @endif>2018</option>
                    <option value="2019" @if($year==2019) {{'selected'}} @endif>2019</option>
                </select>
            </div>
            <div class="col-sm-4 text-left">
                  <button type="submit" class="btn btn-outline-success btn-sm waves-effect">
                    <i class="fa fa-search" aria-hidden="true"></i> Search
                </button>              
            </div>
       
           </div>
        </div>     
    </div> 
 </form>
    <div class="row justify-content-center @if((!$month) || (!$year)){{'display_none'}} @endif">
        <div class="col-md-6 text-left pl0">
            <button type="button" class="btn btn-outline-warning btn-sm waves-effect" data-toggle="modal" data-target="#addStartAchievement" id="add-task-btn">
                <i class="fa fa-plus"></i> Add Start Achievement
            </button>
        </div>

        <div class="col-md-6 text-right pr0">
             <button type="button" class="btn btn-outline-warning btn-sm waves-effect" data-toggle="modal" data-target="#addEndAchievement" id="add-task-btn">
                <i class="fa fa-plus"></i> Add End Achievement
            </button>
        </div>
        <div class="col-md-12 col-md-push-0 p20 bg-white mt10">
            @if ($errors->any())
            <div class="alert alert-danger">
                <ul>
                    @foreach ($errors->all() as $error)
                    <li>{{ $error }}</li>
                    @endforeach
                </ul>
            </div>
            @endif
            @if(session()->has('success'))
                <div class="alert alert-success">
                    {{ session()->get('success') }}
                </div>
            @endif
            @if(session()->has('fail'))
                <div class="alert alert-danger">
                    {{ session()->get('fail') }}
                </div>
            @endif
            <table class="table table-bordered table-condensed table table-striped table-responsive" name="achieve_result" id="achieve_result">
                <thead>
                    <tr>
                        <th>#</th>
                        <th>Task title</th>
                        <th>Achievement 1</th>
                        <th>Achievement 2</th>
                        <th>Gram Panchayat</th>
                        <th>Month & Year</th>
                       <!-- <th>Action</th>-->
                    </tr>
                </thead>
                <tbody>
                    @php $i++; 
                    $month_name=['month','January', 'February', 'March', 'April', 'May', 'June', 'July', 'August', 'September', 'October', 'November', 'December'];
                    
                    
                    @endphp
                    @foreach($achievements as $achievement)
                    <tr>
                        <td>
                            {{ $i++ }}
                        </td>
                        <td>
                           {{ $achievement->task_title }}
                        </td>
                        <td>
                            {{ $achievement->achievement_1 }}
                        </td>
                        <td>
                           {{ $achievement->achievement_2 }}
                        </td>
                        <td>
                             {{ $achievement->gram_panchyat_name }}
                        </td>
                        <td>
                             {{ $month_name[$achievement->month_ac] }},&nbsp{{ $achievement->year_ac }}
                        </td>
<!--                        <td>
                            <button type="button" class="btn btn-outline-warning btn-sm waves-effect task-edit-btn" data-toggle="modal" data-target="" id="">
                                <i class="fa fa-edit"></i> EDIT TASK
                            </button>
                            <button type="button" class="btn btn-primary btn-sm btn-activation" data-toggle="modal" data-target="" id="">ACTIVATION</button>
                        </td>-->
                    </tr>
                    @endforeach
                </tbody>
            </table>
        @if(!empty($achievements))
             {{$achievements->appends(request()->query())->links()}}
        @endif
        
        </div>
    </div>
</div>


<!-- =================================================== ADD Start MODAL DETAILS =============================================== -->
<!-- Modal:start  AddEnd modal -->
<div class="modal fade left" id="addStartAchievement" tabindex="-1" role="dialog"
     aria-labelledby="myModalLabel" data-backdrop="false" aria-hidden="true" style="display: none;">
    <div class="modal-dialog modal-full-height modal-left modal-notify modal-warning" role="document">
        <!--Content-->
        <div class="modal-content">
            <!--Header-->
            <div class="modal-header">
                <p class="heading lead">Add Start Achievement </p>

                <button type="button" class="close" data-dismiss="modal" aria-label="Close">
                    <span aria-hidden="true" class="white-text">×</span>
                </button>
            </div>

            <!--Body-->
            <form  action="{{ url('uploadAchievement') }}" method="POST" enctype="multipart/form-data">
                @csrf
                <div class="modal-body">
                    <div class="row">
                        <div class="col-md-12" id="saveTaskDetailsValidation1">
                            
                            @if ($errors->any())
                            <div class="alert alert-danger">
                                <ul>
                                    @foreach ($errors->all() as $error)
                                    <li>{{ $error }}</li>
                                    @endforeach
                                </ul>
                            </div>
                            @endif
                            @if(session()->has('success'))
                                <div class="alert alert-success">
                                    {{ session()->get('success') }}
                                </div>
                            @endif
                            @if(session()->has('fail'))
                                <div class="alert alert-danger">
                                    {{ session()->get('fail') }}
                                </div>
                            @endif
                        </div>
                    </div>
                    <div class="row">
                        <div class="col-md-12 form-group" id="editData">
                            <input type="hidden" name="Month1" id="Month1" class="form-control form-control-sm" value="{{$month}}">
                            <input type="hidden" name="Year1" id="Year1" class="form-control form-control-sm" value="{{$year}}">
                        </div>
                    </div>
                    <div class="row">
                        <div class="col-md-12 form-group">
                            <label class="text-upper text_style">Select Task</label>
                            <select name="select_task1" id="select_task1" class="form-control form-control-sm" >
                                <option value="" disabled selected>======= Select a task =======</option>
                                @foreach($taskname AS $tasks)
                                <option value="{{ $tasks->id }}">{{ $tasks->task_title }}</option>
                                @endforeach
                            </select>
                        </div>
                        <div class="col-md-12 form-group">
                            <label class="text-upper text_style" id="ex_dip_cer_label">Add Attachment</label>
                            <input type="file" name="_attachment1" id="_attachment1" class="form-control form-control-sm">
                        </div>
                        <div class="col-md-12 form-group">
                            <label class="text-upper text_style" id=""><a target="" href="{!! asset('/achievement/achievement.xlsx') !!}" style="color: blue;text-decoration: underline;transition: all 0.3s;">Guidelines of the Attachment</a></label>
                        </div>
                    </div>
                    <div class="row">
                        <div class="col-md-12 form-group">
                            <button type="submit" class="btn btn-primary btn-sm waves-effect waves-light" id="task-save-btn1">Upload Details
                                <i class="fa fa-save ml-1"></i>
                            </button>
                            <button type="button" class="btn btn-primary btn-sm waves-effect waves-light" id="task-edit-save-btn1" hidden>Edit Details
                                <i class="fa fa-save ml-1"></i>
                            </button>
                            <button type="button" class="btn btn-outline-danger btn-sm waves-effect"
                                    data-dismiss="modal">Close</button>
                        </div>
                    </div>

                </div>

            </form>
        </div>
        <!--/.Content-->
    </div>
</div>
<!-- Modal:END_AddEndModal -->
<!-- Modal:Addstart modal -->
<div class="modal fade right" id="addEndAchievement" tabindex="-1" role="dialog"
     aria-labelledby="myModalLabel" data-backdrop="false" aria-hidden="true" style="display: none;">
    <div class="modal-dialog modal-full-height modal-right modal-notify modal-warning" role="document">
        <!--Content-->
        <div class="modal-content">
            <!--Header-->
            <div class="modal-header">
                <p class="heading lead">Add End Achievement</p>

                <button type="button" class="close" data-dismiss="modal" aria-label="Close">
                    <span aria-hidden="true" class="white-text">×</span>
                </button>
            </div>

            <!--Body-->
            <form action="{{url('uploadAchievementEnd')}}" method="POST" enctype="multipart/form-data">
                @csrf
                <div class="modal-body">
                     <div class="row">
                        <div class="col-md-12" id="saveTaskDetailsValidation1">
                            
                            @if ($errors->any())
                            <div class="alert alert-danger">
                                <ul>
                                    @foreach ($errors->all() as $error)
                                    <li>{{ $error }}</li>
                                    @endforeach
                                </ul>
                            </div>
                            @endif
                            @if(session()->has('success'))
                                <div class="alert alert-success">
                                    {{ session()->get('success') }}
                                </div>
                            @endif
                            @if(session()->has('fail'))
                                <div class="alert alert-danger">
                                    {{ session()->get('fail') }}
                                </div>
                            @endif
                        </div>
                    </div>
                    <div class="row">
                        <div class="col-md-12 form-group" id="editData">
                            <input type="hidden" name="Month" id="Month" class="form-control form-control-sm" value="{{$month}}">
                            <input type="hidden" name="Year" id="Year" class="form-control form-control-sm" value="{{$year}}">
                        </div>
                    </div>
                   
                    <div class="row">
                        <div class="col-md-12 form-group">
                            <label class="text-upper text_style">Select Task</label>
                            <select name="select_task" id="select_task" class="form-control form-control-sm" required>
                                <option value="" disabled selected>======= Select a task =======</option>
                                @foreach($achievementsEnd AS $taskEnd)
                                <option value="{{ $taskEnd->task_id_ac }}">{{ $taskEnd->task_title }}</option>
                                @endforeach
                            </select>
                        </div>
                        <div class="col-md-12 form-group">
                            <label class="text-upper text_style" id="ex_dip_cer_label">Add Attachment</label>
                            <input type="file" name="attachmentEnd" id="attachmentEnd" class="form-control form-control-sm">
                        </div>
                        <div class="col-md-12 form-group">
                            <label class="text-upper text_style" id=""><a href="{!! asset('/achievement/achievement.xlsx') !!}" target="" style="color: blue;text-decoration: underline;transition: all 0.3s;">Guidelines of the Attachment</a></label>
                        </div>
                    </div>
                    <div class="row">
                        <div class="col-md-12 form-group">
                            <!-- <input type="hidden" name="edit_task_id" id="edit_task_id" class="form-control" required> -->
                            <button type="submit" class="btn btn-primary btn-sm waves-effect waves-light" id="task-save-btn-end">Upload Details
                                <i class="fa fa-save ml-1"></i>
                            </button>
                            <button type="button" class="btn btn-primary btn-sm waves-effect waves-light" id="task-edit-save-btn" hidden>Edit Details
                                <i class="fa fa-save ml-1"></i>
                            </button>
                            <button type="button" class="btn btn-outline-danger btn-sm waves-effect"
                                    data-dismiss="modal">Close</button>
                        </div>
                    </div>

                </div>

            </form>
        </div>
        <!--/.Content-->
    </div>
</div>
<!-- Modal:END_StartModal -->
<script type="text/javascript">
    //Dependant Blocks lists
    $(document).ready(function() {
        $('select[name="month_achieved"]').on('change', function() {
            var MonthID = $(this).val();
            if(MonthID) {
                $.ajax({
                    url: 'searchResult/'+MonthID,
                    type: "GET",
                    dataType: "json",
                    success:function(data) {

                        $('table[name="achieve_result"]').empty();
                        $.each(data, function(key, value) {
                            $('table[name="achieve_result"]').append('<tr value="">hehehehehe</option>');
                        });


                    }
                });
            }else{
                $('table[name="achieve_result"]').empty();
            }
        });
    });
    
</script>
<!-- <script>
    $(document).on('click', '#task-save-btn', function () {
        Swal({
            title: 'Are you sure?',
            text: "You are going to Upload a new Achievement!",
            type: 'warning',
            showCancelButton: true,
            confirmButtonColor: '#3085d6',
            cancelButtonColor: '#d33',
            confirmButtonText: 'Yes, create it!'
        }).then((result) => {
            $('#saveTaskDetailsValidation').empty();
            if (result.value) {

                $.post("{{url('/uploadAchievement')}}", {
                    '_token': $('meta[name=csrf-token]').attr('content'),
                    'select_task': $('#select_task').val(),
                    'select_gps': $('#select_gps').val(),
                    '_attachment': $('#_attachment').val()
                }, function (j) {
                    if (j['msg'] == "VE") {
                        $('#saveTaskDetailsValidation').append('<ul class="form-group f-600 f-13 v-errors" id="saveTaskDetailValidationErrors"></ul>');

                        $.each(j.error, function (index, value) {
                            $('#saveTaskDetailValidationErrors').append('<li>' + value + '</li>');
                        });
                    } else {
                        Swal(j['msg']);
                        $('#saveTaskDetails').trigger("reset");
                        location.reload();

                    }
                })
                        .fail(function () {
                            Swal("Something went wrong! Please try again.");
                        });

            }
        });
    });
    $(document).on('click', '.btn-activation', function () {
        var id = $(this).attr('id').split("_");
        $('#task').val(id[1]);

    });
    $(document).on('click', '#change-status-btn', function () {
        Swal({
            title: 'Are you sure?',
            text: "You are going to change task activation sttatus!",
            type: 'warning',
            showCancelButton: true,
            confirmButtonColor: '#3085d6',
            cancelButtonColor: '#d33',
            confirmButtonText: 'Yes, change it!'
        }).then((result) => {
            $('#saveTaskActivationValidation').empty();
            if (result.value) {

                $.post("{{url('/save_task_activation')}}", {
                    '_token': $('meta[name=csrf-token]').attr('content'),
                    'status': $('#activation_staus').val(),
                    'task': $('#task').val()
                }, function (j) {
                    if (j['msg'] == "VE") {
                        $('#saveTaskActivationValidation').append('<ul class="form-group f-600 f-13 v-errors" id="saveTaskActivationValidationErrors"></ul>');

                        $.each(j.error, function (index, value) {
                            $('#saveTaskActivationValidationErrors').append('<li>' + value + '</li>');
                        });
                    } else {
                        Swal(j['msg']);
                        $('#saveTaskActivtion').trigger("reset");
                        location.reload();

                    }
                })
                        .fail(function () {
                            Swal("Something went wrong! Please try again.");
                        });

            }
        });
    });
    $(document).on('click', '.task-edit-btn', function () {
        $('#task-edit-save-btn').removeAttr("hidden");
        $('#task-save-btn').attr('hidden', 'hidden');
        var $row = jQuery(this).closest('tr');
        var $columns = $row.find('td');

        $columns.addClass('row-highlight');
        
        var values = [];
        jQuery.each($columns, function (i, item) {
            values[i] = ""+item.innerHTML;
        });
        var table = "<table class='table table-responsive table-bordered'>\n\
<tr><th>Task Title</th><td>"+values[1]+"</td></tr>\n\
<tr><th>Task Description</th><td>"+values[2]+"</td></tr>\n\
<tr><th>Program</th><td>"+values[3]+"</td></tr>\n\
</table>";
        $('#editData').html(table);
        var id = $(this).attr('id').split("_");
        $('#edit_task_id').val(id[2]);
    });
    $(document).on('click', '#add-task-btn', function () {
        $('#task-save-btn').removeAttr("hidden");
        $('#task-edit-save-btn').attr('hidden', 'hidden');
        $('#editData').html("");
    });
    
    $(document).on('click', '#task-edit-save-btn', function () {
        Swal({
            title: 'Are you sure?',
            text: "You are going to edit a task!",
            type: 'warning',
            showCancelButton: true,
            confirmButtonColor: '#3085d6',
            cancelButtonColor: '#d33',
            confirmButtonText: 'Yes, edit it!'
        }).then((result) => {
            $('#saveTaskDetailsValidation').empty();
            if (result.value) {

                $.post("{{url('/edit_task')}}", {
                    '_token': $('meta[name=csrf-token]').attr('content'),
                    'program': $('#select_program').val(),
                    'task_title': $('#task_title').val(),
                    'task_desp': $('#task_desp').val(),
                    'task':$('#edit_task_id').val()
                }, function (j) {
                    if (j['msg'] == "VE") {
                        $('#saveTaskDetailsValidation').append('<ul class="form-group f-600 f-13 v-errors" id="saveTaskDetailValidationErrors"></ul>');

                        $.each(j.error, function (index, value) {
                            $('#saveTaskDetailValidationErrors').append('<li>' + value + '</li>');
                        });
                    } else {
                        Swal(j['msg']);
                        $('#saveTaskDetails').trigger("reset");
                        location.reload();

                    }
                })
                        .fail(function () {
                            Swal("Something went wrong! Please try again.");
                        });

            }
        });
    });
</script> -->
@endsection