@extends('layouts.layout')
@section('title', 'Settings')
@include('scripts.setting_terms_script')
@include('scripts.settings')

@section('content')
    @include('settings.setting_sidebar')
    <link rel="stylesheet" href="https://netdna.bootstrapcdn.com/font-awesome/4.7.0/css/font-awesome.css">
    <link rel="stylesheet" href="{{ asset('css/bootstrap-datetimepicker.min.css') }}">
    <div class="tab-content-wrap">
        <div class="tab-pane" id="setSystem">
            <div class="pb-2">
                <h3>System Settings</h3>
                <h4>Server Date/Time</h4>
            </div>

            <form method="post" action="{{ url('/setting/store-system') }}" id="add-system">

                @csrf
                <input type="hidden" id="current_date" name="id"
                    value="@if (isset($setting_system[0]['id'])) {{ $setting_system[0]['id'] }} @else @endif">
                @php date_default_timezone_set("Europe/London"); @endphp
                <div class="row">
                    <div class="col-12 col-md-6">
                        <div class="form-wrap datepicker date input-group style-input disabled-form">
                            <label for="start_date" class="style-label  with-value ">Current Date</label>
                            <input type="text" class="form-control datepicker-custom" id="start_date" name="start_date"
                                value="{{ date('d/m/Y') }}" disabled />
                            <div class="input-group-append">
                                <i class="fas fa-calendar-alt"></i>
                            </div>
                        </div>
                    </div>
                    <div class="col-12 col-md-6">
                        <div class="form-wrap datepicker date input-group style-input disabled-form">
                            <label for="start_date" class="style-label  with-value ">Current Time</label>
                            <input type="text" class="form-control datepicker-custom" id="current_time" title="disable"
                                name="current_time" value="{{ $server_time }}" disabled />
                            <!-- <input type="text" class="form-control datepicker-custom" id="current_time" title="disable" name="current_time" value="{{ date('H:i:s') }}" disabled/> -->
                            <div class="input-group-append">
                                <i class="fas fa-calendar-alt"></i>
                            </div>
                        </div>
                    </div>
                    <div class="col-12 col-md-6">
                        <div class="form-wrap">
                            <label for="" class="custom-switch-label mb-0">Use Server Date/Time</label>
                            <div class="switch-field">
                                <input type="radio" id="yes" @if ($setting_system[0]['server_date_time'] == 'yes') checked @endif
                                    onchange="waitinglist(this.value)" name="server_date_time" value="yes" checked />
                                <label for="yes">Yes</label>
                                <input type="radio" id="no" @if ($setting_system[0]['server_date_time'] == 'no') checked @endif
                                    onchange="waitinglist(this.value)" name="server_date_time" value="no" />
                                <label for="no">No</label>
                            </div>
                        </div>
                    </div>
                </div>
                <div class="row" id="server_time">
                    <div class="col-12 col-md-6">
                        <!-- <div class="form-wrap style-input">
                                                                                                <label for="set_date" class="style-label @isset($setting_system[0]['set_date']) with-value @endif">Set Date</label>
                        <input type="date" name="set_date" id="set_date" class="form-control" value="@isset($setting_system[0]['set_date']){{ date('Y-m-d', strtotime($setting_system[0]['set_date'])) }}@endisset">
                                                                                            </div> -->
                        <div class="form-wrap datepicker date input-group style-input">
                            <label for="set_date"
                                class="style-label @isset($setting_system[0]['set_date']) with-value @endif">Set Date*</label>
                        <input type="text"  class="form-control datepicker-custom" id="set_date"  name="set_date" value="@isset($setting_system[0]['set_date']){{ date('d/m/Y', strtotime($setting_system[0]['set_date'])) }}@endisset" />
                            <div class="input-group-append">
                                <i class="fas fa-calendar-alt"></i>
                            </div>
                        </div>

                    </div>
                    <div class="col-12 col-md-6">
                        <div class="form-wrap form-wrap-custom class-timepicker custom-timepicker">

                            <input type="text" name="set_time" id="set_time" class="form-control" placeholder=""
                                value="{{ isset($setting_system[0]['set_time']) ? $setting_system[0]['set_time'] : '' }}">
                            <label for="set_time" class="style-label @isset($setting_system[0]['set_time']) with-value @endif">Set Time</label>
                            <div class="input-group-append">
                                <i class="fas fa-clock"></i>
                            </div>
                        </div>

                    </div>
                </div>
                <div class="d-flex justify-content-end">
                    <button type="submit" class="btn">Save</button>
                </div>
            </form>

            <div class="permission-block">
                <div class="permission-header">
                    <h3>System History</h3>
                </div>
                <div class="venue-block">
                    <div class="table-wrap">
                        <table id="example1" class="table table-bordered table-striped">
                            <thead>
                                <tr>
                                    <th>Server Time</th>
                                    <th>Date</th>
                                    <th>Time</th>
                                    <th>Updated Date</th>
                                    <th>Updated By</th>
                                </tr>
                            </thead>
                            <tbody>
                            @php $i=0;@endphp
                            @if (!empty($setting_system_history))
                                    @foreach ($setting_system_history as $key => $value)
                                <tr>
                                    <td>{{ $value['server_date_time'] }}</td>
                                    <td>{{ date('d/m/y', strtotime($value['set_date'])) }} </td>
                                    <td>{{ date('H:i', strtotime($value['set_time'])) }}</td>
                                    <td>{{ date('d/m/y | H:i', strtotime($value['updated_at'])) }} </td>
                                     <td>{{ !empty($value['get_user'] && !empty($value['get_user']['firstname'])) ? $value['get_user']['firstname'] : '' }} {{ !empty($value['get_user'] && !empty($value['get_user']['lastname'])) ? $value['get_user']['lastname'] : '' }} @if (!empty($value['get_user']['admin_role_join'])) {{ !empty($value['get_user']['admin_role_join']['name']) ? '(' . $value['get_user']['admin_role_join']['name'] . ')' : '' }} @endif</td>
                                </tr>
                                    @endforeach
                                @endif
                                                                                                </tbody>
                                                                                            </table>
                                                                                        </div>
                                                                                    </div>
                                                                                </div>
                                                                            </div>
                                                                        </div>
                                                                        <script type="text/javascript" src="//cdnjs.cloudflare.com/ajax/libs/moment.js/2.9.0/moment-with-locales.min.js">
                                                                        </script>
                                                                        <script src="{{ url('admin/js/bootstrap-datetimepicker.min.js') }}"></script>
                                                                        <script>
                                                                            $(document).ready(function() {
                                                                                // Assuming you have jQuery and the datepicker library included
                                                                                $('.datepicker-custom').datepicker({
                                                                                    // Specify datepicker options if needed
                                                                                });

                                                                                $(".class-timepicker").datetimepicker({
                                                                                    allowInputToggle: true,
                                                                                    showClose: true,
                                                                                    showClear: true,
                                                                                    showTodayButton: false,
                                                                                    format: "HH:mm",
                                                                                });

                                                                                function updateTimer() {
                                                                                    // Make an AJAX request to fetch the server time
                                                                                    $.ajax({
                                                                                        url: 'get_server_time', // Replace this with the endpoint that provides server time
                                                                                        method: 'GET',
                                                                                        success: function(response) {
                                                                                            $('#current_time').val(response.server_time);

                                                                                        },
                                                                                        error: function(xhr, status, error) {
                                                                                            console.error("Failed to fetch server time:", error);
                                                                                        }
                                                                                    });
                                                                                }
                                                                                // Function to update the timer in real-time
                                                                                function updateTimerold() {
                                                                                    var currentTime = new Date();
                                                                                    var hours = currentTime.getHours();
                                                                                    var minutes = currentTime.getMinutes();
                                                                                    var seconds = currentTime.getSeconds();

                                                                                    // Add leading zeros if needed
                                                                                    hours = (hours < 10) ? "0" + hours : hours;
                                                                                    minutes = (minutes < 10) ? "0" + minutes : minutes;
                                                                                    seconds = (seconds < 10) ? "0" + seconds : seconds;

                                                                                    // Update the value of the disabled input field
                                                                                    $('#current_time').val(hours + ":" + minutes + ":" + seconds);
                                                                                }

                                                                                // Update the timer every second
                                                                                setInterval(updateTimer, 1000);
                                                                                waitinglist("{{ $setting_system[0]['server_date_time'] }}");

                                                                            });




                                                                            function waitinglist(e) {

                                                                                if (e == "no") {
                                                                                    $("#server_time").show();
                                                                                } else {
                                                                                    $("#server_time").hide();
                                                                                }

                                                                            }
                                                                        </script>
                                                                        <script src="{{ url('admin/js/setting.js') }}"></script>
                                                                        {!! JsValidator::formRequest('App\Http\Requests\SettingSystem', '#add-system') !!}
@endsection