@extends('layouts.master')

@section('title', 'Farm App - Livestock Timeline')

@section('content')
    <div id="page">
        <div class="card cardi card-style" style="position: fixed !important; top: 50px; left: 0; right: 0; z-index: 50;margin: 0px 0px 0px 0px; border-radius: 0px;backdrop-filter: saturate(180%) blur(20px);">
            <div class="content row" style="margin-top:5px; margin-bottom: 20px; !important;">
                <div class="col-7 text-center">
                    <a data-menu="createLivestockList" href="#" class="btn btn-full gradient-green font-13 btn-m font-600 mt-3 rounded-s">CREATE LIVESTOCK</a>
                </div>
                <div class="col-5 text-center">
                    <a data-menu="otherJobActions" href="#" class="btn btn-full gradient-orange font-13 btn-m font-600 mt-3 rounded-s">ACTIONS</a>
                </div>
            </div>
        </div>
        <div class="header header-auto-sho header-fixed header-logo-center">
            <a href="#" class="header-title">Livestock Timeline</a>
            <a href="#" data-back-button class="header-icon header-icon-1"><i class="fas fa-chevron-left"></i></a>
            <a href="#" data-toggle-theme class="header-icon header-icon-3 show-on-theme-dark"><i class="fas fa-sun"></i></a>
            <a href="#" data-toggle-theme class="header-icon header-icon-3 show-on-theme-light"><i class="fas fa-moon"></i></a>
            <a href="#" data-menu="menu-main" class="header-icon header-icon-4"><i class="fas fa-bars"></i></a>
        </div>

        <div class="page-title-clear"></div>
        <div class="page-content">

            <div class="content">
                @php $job_dates = $jobs->pluck("job_log_created_at")->unique()->toArray() @endphp

                @foreach($job_dates as $job_date)
                    <a href="#" style="font-size: 11px !important;" class="mt-0 mb-3 btn btn-s btn-center-l rounded-s gradient-teal font-600">{{ \Carbon\Carbon::parse ($job_date)->isoFormat('dddd, Do MMMM, YYYY')}}</a>
                    <div class="list-group list-boxes">
                        @foreach($jobs as $job_items)
                            @if($job_date == $job_items->job_log_created_at)
                                <a data-id="{{$job_items->job_id}}" data-date="{{$job_items->job_log_created_at}}" data-menu="viewTimelineJobs" href="#" class="job_timeline border @if($job_items->job_type === 'CROP JOB') border-green-dark @elseif($job_items->job_type === 'LIVESTOCK JOB') border-red-dark @elseif($job_items->job_type === 'EQUIPMENT JOB') border-blue-dark @elseif($job_items->job_type === 'ACCOUNTS JOB') border-orange-dark @else border-yellow-dark @endif rounded-s shadow-xs">
                                    <i class="fa font-20 @if($job_items->job_type === 'CROP JOB') fa-seedling color-green-dark @elseif($job_items->job_type === 'LIVESTOCK JOB') fa-horse-head color-red-dark @elseif($job_items->job_type === 'EQUIPMENT JOB') fa-tools color-blue-dark @elseif($job_items->job_type === 'ACCOUNTS JOB') fa-cash-register color-orange-dark @else fa-tasks color-yellow-dark @endif"></i>
                                    <span>{{$job_items->job_name}}</span>
                                    <strong>{{$job_items->job_count}} {{$job_items->job_desc}} Job(s)</strong>
                                    <i class="fa fa-angle-right" style="color:gray; margin-top:1px;"></i>
                                </a>
                            @endif

                        @endforeach
                    </div>
                @endforeach

            </div>

        </div>

        <div id="menu-main" class="menu menu-box-left rounded-0" data-menu-load="{{url('menu-main')}}" data-menu-width="280" data-menu-active="nav-pages"></div>

        <div id="menu-share" class="menu menu-box-bottom rounded-m" data-menu-load="{{url('menu-share')}}" data-menu-height="370"></div>

        <div id="menu-colors" class="menu menu-box-bottom rounded-m" data-menu-load="{{url('menu-colors')}}" data-menu-height="480"></div>

    </div>

@endsection

@section('footer-links')

    <script>
        function close_modal(){
            $(".modal").modal('hide');
            $('body').removeClass('modal-open');
            $('.modal-backdrop').remove();
        }
        $(function () {

            $("#createLivestockListForm").submit(function(e){
                e.preventDefault();
                var error = false;

                if(!error){
                    close_modal();
                    swal({
                            title: "Are you sure?",
                            text: "Livestock List will be created!",
                            type: "warning",
                            showCancelButton: true,
                            closeOnConfirm: false,
                            showLoaderOnConfirm: true
                        },
                        function() {
                            $("#createLivestockListForm").ajaxSubmit({
                                type: "POST",
                                url: "create_livestockList",
                                dataType: "json",
                                success: function (response) {
                                    if (response.status === "success") {
                                        swal("Done!", "Livestock List Created", "success");

                                        $(".job-content").load(location.href+(' .job-content'));
                                        $('#createLivestockListForm').resetForm();
                                        $("#filtered_date").load(location.href+(' #filtered_date'));
                                        var element = document.getElementById("createLivestockList");
                                        element.classList.remove("menu-active");
                                        var element = document.getElementById("logger");
                                        element.classList.remove("menu-active");

                                    } else{
                                        swal("Cancelled!", response.msg, "error")

                                    }
                                }
                            });
                        });

                }
            });

            let livestockList_id, livestockList_name;

            $(".page-content").on("click", ".livestockList_button", function (e) {

                var element = document.getElementById("LivestockListActions");
                element.classList.add("menu-active");
                var element = document.getElementById("logger");
                element.classList.add("menu-active");

                livestockList_id = $(this).data("id");
                livestockList_name = $(this).data("name");

                $(".animal_name_text").text(livestockList_name);
            });

            $("#LivestockListActions").on("click", ".view_edit_livestockList", function (e) {

                $.ajax({
                    type: "GET",
                    url: "view_edit_livestockList",
                    dataType: "json",
                    data:{
                        livestockList_id: livestockList_id
                    },
                    success: function (response) {
                        if (response.status === "success") {
                            $("#edit_livestockList_name").val(response.animal_id).change();
                            $("#edit_alert_when_less").val(response.alert_when_less).change();
                        } else{

                        }
                    }
                });
            });

            $("#editLivestockListForm").submit(function(e){
                e.preventDefault();
                var error = false;

                if(!error){
                    swal({
                            title: "Are you sure?",
                            text: livestockList_name+" will be updated!",
                            type: "warning",
                            showCancelButton: true,
                            closeOnConfirm: false,
                            showLoaderOnConfirm: true
                        },
                        function() {
                            $("#editLivestockListForm").ajaxSubmit({
                                type: "PUT",
                                url: "edit_livestockList",
                                dataType: "json",
                                data: {
                                    livestockList_id: livestockList_id,
                                },
                                success: function (response) {
                                    if (response.status === "success") {
                                        swal("Done!", livestockList_name+" Updated", "success");

                                        $(".job-content").load(location.href+(' .job-content'));
                                        $('#editLivestockListForm').resetForm();
                                        $("#filtered_date").load(location.href+(' #filtered_date'));
                                        var element = document.getElementById("editLivestockList");
                                        element.classList.remove("menu-active");
                                        var element = document.getElementById("logger");
                                        element.classList.remove("menu-active");

                                    } else{
                                        swal("Cancelled!", response.msg, "error")

                                    }
                                }
                            });
                        });

                }
            });

            $("#LivestockListActions").on("click", ".delete_livestockList", function (e) {
                swal({
                        title: "Are you sure?",
                        text: livestockList_name+" will be deleted!",
                        type: "warning",
                        showCancelButton: true,
                        closeOnConfirm: false,
                        showLoaderOnConfirm: true
                    },
                    function() {
                        $.ajax({
                            type: "DELETE",
                            url: "delete_livestockList",
                            dataType: "json",
                            data:{
                                livestockList_id: livestockList_id
                            },
                            success: function (response) {
                                if (response.status === "success") {
                                    swal("Done!", livestockList_name+" Deleted", "success");

                                    $(".job-content").load(location.href+(' .job-content'));
                                    $("#filtered_date").load(location.href+(' #filtered_date'));
                                    var element = document.getElementById("LivestockListActions");
                                    element.classList.remove("menu-active");
                                    var element = document.getElementById("logger");
                                    element.classList.remove("menu-active");


                                } else{
                                    swal("Cancelled!", response.msg, "error")

                                }
                            }
                        });
                    });
            });

            $("#LivestockListActions").on("click", ".view_livestockList_timeline", function (e) {

                $.ajax({
                    type: "GET",
                    url: "livestock-timeline",
                    dataType: "json",
                    data:{
                        livestockList_id: livestockList_id
                    },
                    success: function (response) {
                        if (response.status === "success") {

                        } else{

                        }
                    }
                });
            });

        });
    </script>

    </body>
    </html>
@endsection