@extends("template.layouts.simple.master")
@section('content')
    <div class="page-body">
        @include("master.notification")
        <div class="container-fluid">
            <div class="row">
                <div class="col-sm-12">
                    <div class="card">
                        <div class="card-body">
                            <!-- Form inside the modal -->
                            <form action="{{route("store-markin-markout")}}" method="post">
                                @csrf
                                <div class="row">
                                    @if(isset($markin_count) and isset($markout_count) and $markin_count == 1 and $markout_count == 1)
                                        <div class="col-sm-12 mt-4">
                                            <div class="alert alert-light-success" role="alert">
                                                <p class="txt-success fw-bold">You have done today
                                                    ({{$previous_details->actual_date}}) Mmark-In and Marke-Out
                                                </p>
                                            </div>
                                        </div>
                                    @endif

                                    @if((isset($previous_details->mark_status) and $previous_details->mark_status != 2))
                                        <div class="col-sm-12 ">
                                            <h2 class=" bg-primary fw-bold text-center p-2 stopwatch" id="">
                                                10:00:00</h2>
                                        </div>


                                        @if($previous_details->custom_status == 1)
                                            <div class="col-sm-12 mt-4">
                                                <div class="alert alert-light-danger" role="alert">
                                                    <p class="txt-danger">
                                                        <li class="txt-danger"> You are not approved by manager so timer
                                                            is started
                                                            from {{$previous_details->actual_date}} .
                                                        </li>
                                                        <li class="txt-danger"> Once you are approved then timer will
                                                            automatic start from
                                                            given custom date {{$previous_details->custom_date}}</li>
                                                        <li class="txt-danger">
                                                            <b>( Mark-Out
                                                                On Custom Date {{$previous_details->custom_date}})</b>
                                                        </li>

                                                    </p>
                                                </div>
                                            </div>
                                        @else
                                            <div class="col-sm-12 mt-4">
                                                <div class="alert alert-light-danger" role="alert">
                                                    <p class="txt-danger">You have not marked out
                                                        on {{$previous_details->actual_date}} . <b>(Please , First
                                                            Mark-Out
                                                            On {{$previous_details->actual_date}}.)</b></p>
                                                </div>
                                            </div>

                                        @endif

                                    @endif

                                    <div class="col-sm-12 mt-3">
                                        @can("add normal mark-in and mark-out")

                                            @if((isset($previous_details->mark_status) and $previous_details->mark_status != 1)  or !isset($previous_details->mark_status))
                                                @if(isset($markin_count) and $markin_count < 1)
                                                    <button class="btn btn-primary" value="1" name="mark_status">
                                                        Mark-In
                                                    </button>
                                                @endif

                                            @endif

                                            @if((isset($previous_details->mark_status) and $previous_details->mark_status != 2)  or !isset($previous_details->mark_status))
                                                @if(isset($markout_count) and $markout_count < 1)
                                                    <button class="btn btn-secondary" value="2" name="mark_status">
                                                        Mark-Out
                                                    </button>
                                                @endif
                                            @endif
                                        @endcan

                                        @can("add custom mark-in and mark-out")
                                            <button class="btn btn-warning custom_markin_markout_btn">
                                                Custom Mark-In / Mark-Out
                                            </button>
                                        @endcan
                                    </div>
                                </div>
                            </form>
                            <div class="custom_markin_markout_form d-none">
                                <form action="{{route("store-markin-markout")}}" method="post">
                                    @csrf
                                    <hr>
                                    <div class="row">
                                        <div class="col-sm-12 mb-3">
                                            <h3 class="bg-primary p-1 ">Custom Mark-In / Mark-Out Form</h3>
                                        </div>
                                        <div class="col-sm-3 ">
                                            <label for="" class="form-label">Custom Mark-In / Mark-Out Time</label>
                                            <input type="time" name="custom_time"
                                                   class=" form-control custom_time">
                                            @error("custom_time")
                                            <div class="text-danger fw-bold">{{$message}}</div>
                                            @enderror
                                        </div>
                                        <div class="col-sm-3 ">
                                            <label for="" class="form-label">Custom Mark-In / Mark-Out Date</label>
                                            <input type="date" name="custom_date"
                                                   class=" form-control ">
                                        </div>
                                        <div class="col-sm-6 ">
                                            <label for="" class="form-label">Description </label>
                                            <input type="text" name="description"
                                                   class=" form-control ">
                                        </div>
                                        <div class="col-sm-12 mt-3">
                                            @can("add custom mark-in and mark-out")
                                                @if((isset($previous_details->mark_status) and $previous_details->mark_status != 1)  or !isset($previous_details->mark_status))
                                                    <button class="btn btn-primary" value="1" name="mark_status">
                                                        Mark-In
                                                    </button>
                                                @endif
                                                @if((isset($previous_details->mark_status) and $previous_details->mark_status != 2)  or !isset($previous_details->mark_status))
                                                    <button class="btn btn-secondary" value="2" name="mark_status">
                                                        Mark-Out
                                                    </button>
                                                @endif
                                            @endcan

                                        </div>
                                    </div>
                                </form>
                            </div>
                        </div>
                    </div>
                </div>
            </div>
        </div>


    </div>
@endsection
{{--@include("")--}}
@section("scripts")
    @include("master.notification_show_hide")
    <script>
        $(document).ready(function () {
            let c = 1;
            $(".custom_markin_markout_btn").click(function (e) {
                e.preventDefault();
                if (c == 1) {
                    $(".custom_markin_markout_form").removeClass("d-none")
                    c = 0;
                } else {
                    $(".custom_markin_markout_form").addClass("d-none")
                    c = 1;
                }

            })
            @if(session("custom_time_error"))
            $(".custom_markin_markout_form").removeClass("d-none");
            @endif




        })
    </script>

@endsection