@include('layouts.sidebar')

{{-- <link rel="stylesheet" href="https://cdnjs.cloudflare.com/ajax/libs/jquery-datetimepicker/2.5.9/jquery.datetimepicker.min.css" integrity="sha512-f0tzWhCwVFS3WeYaofoLWkTP62ObhewQ1EZn65oSYDZUg1+CyywGKkWzm8BxaJj5HGKI72PnMH9jYyIFz+GH7g==" crossorigin="anonymous" referrerpolicy="no-referrer" /> --}}
<!-- =============== Left side End ================-->


<div class="main-content-wrap sidenav-open d-flex flex-column">
    <!-- ============ Body content start ============= -->
    <div class="main-content">

        <div class="row">
            <div class="card text-left">
                {!! Form::open(['route' => [$current_menu . '.update', $encrypt_id], 'method' => 'PUT', 'id' => $current_menu . '-form', 'enctype' => 'multipart/form-data', 'role' => 'form']) !!}
                {!! csrf_field() !!}
                <div class="card-body">
                    <div class="row">
                        <div class="col-md-12">
                            <h3 class="card-title mb-3"> Edit Appointment </h3>
                            @if ($errors->any())
                                <div class="alert alert-danger">
                                    <ul>
                                        @foreach ($errors->all() as $error)
                                            <li>{{ $error }}</li>
                                        @endforeach
                                    </ul>
                                </div>
                            @endif
                            <div class="data-create">
                                <div class="container">
                                    <div class="row">
                                        <div class="col">

                                            <label>Description<span style="color: red">*</span></label>
                                            <br>
                                            <textarea style="width: 350px" placeholder="Enter Description" name="description" value="{{ $records[0]->description }}"
                                                rows="3">{{ $records[0]->description }}</textarea>

                                        </div>
                                        <div class="col">
                                            <label>Select Customer<span style="color: red">*</span></label>
                                            <br>
                                            <select name="customer_id" class="form-control" required="">
                                                <option value="" selected="">Select Customer</option>
                                                @if (!empty($customers))
                                                    @foreach ($customers as $key => $value)
                                                        <option
                                                            {{ $records[0]->customer_id == $key ? 'selected' : '' }}
                                                            value="{{ $key }}">
                                                            {{ ucfirst($value) }}</option>
                                                    @endforeach
                                                @endif
                                            </select>
                                        </div>
                                        <div class="col">
                                            <label>Pick Appointment Date & Time<span style="color: red">*</span></label>
                                            <br>
                                            <div class="form-group">
                                                <div class='input-group date'>
                                                    <input type='datetime-local' class="form-control "
                                                        value="{{ str_replace(' ','T',date('Y-m-d H:i',strtotime($records[0]->appointment_date_time))) }}"
                                                        autocomplete="off" name="appointment_date_time" id="datefield" value=""
                                                        required /> 
                                                        {{-- datetimepicker1 --}}
                                                    <span class="input-group-addon">
                                                        {{-- <button class="btn btn-primary" type="button"><i class="nav-icon i-Calendar"></i></button> --}}
                                                    </span>
                                                </div>
                                            </div>
                                        </div>
                                    </div>
                                    <br>
                                    <div class="row">
                                        <div class="col">
                                            <label>Assign Executive<span style="color: red">*</span></label>
                                            <br>
                                            <select name="executive_id" class="form-control" required="">
                                                <option value="" selected="">Select Executive</option>
                                                @if (!empty($executives))
                                                    @foreach ($executives as $key => $value)
                                                        <option
                                                            {{ $records[0]->executive_id == $key ? 'selected' : '' }}
                                                            value="{{ $key }}">{{ $value }}</option>
                                                    @endforeach
                                                @endif
                                            </select>
                                        </div>
                                        <div class="col">
                                            <label>Status</label><br />
                                            <select class="form-control" name="status">
                                                <option value="" selected="">Select Status</option>
                                                <option value="0">Inactive</option>
                                                <option value="1" selected>Active</option>
                                            </select>
                                        </div>
                                        <div class="col">
                                            <br>
                                            <button type="submit" class="btn btn-success">Submit</button>
                                        </div>
                                    </div>
                                </div>
                            </div>

                        </div>
                    </div>
                </div>
                {!! Form::close() !!}
            </div>
        </div>

    </div><!-- Footer Start -->
    <div class="flex-grow-1"></div>

</div>
</div><!-- ============ Search UI Start ============= -->

<!-- ============ Search UI End ============= -->
<script src="{{ asset('js/bootstrap.bundle.min.js') }}"></script>
<script src="{{ asset('js/perfect-scrollbar.min.js') }}"></script>
<script src="{{ asset('js/script.min.js') }}"></script>
<script src="{{ asset('js/sidebar.large.script.min.js') }}"></script>
<script src="{{ asset('js/echarts.min.js') }}"></script>
<script src="{{ asset('js/echart.options.min.js') }}"></script>
<script src="{{ asset('js/dashboard.v1.script.min.js') }}"></script>
<!-- ============ bootstrap-datetimepicker ============= -->
{{-- <script src="https://cdnjs.cloudflare.com/ajax/libs/jquery/1.12.4/jquery.min.js"></script> --}}
<script src="https://cdnjs.cloudflare.com/ajax/libs/moment.js/2.15.1/moment.min.js"></script>
<script src="https://cdnjs.cloudflare.com/ajax/libs/twitter-bootstrap/3.3.7/js/bootstrap.min.js"></script>
<script src="https://cdnjs.cloudflare.com/ajax/libs/jquery-datetimepicker/2.5.9/jquery.datetimepicker.full.min.js"
integrity="sha512-hDFt+089A+EmzZS6n/urree+gmentY36d9flHQ5ChfiRjEJJKFSsl1HqyEOS5qz7jjbMZ0JU4u/x1qe211534g=="
crossorigin="anonymous" referrerpolicy="no-referrer"></script>
{{-- date('Y-m-d H:i',strtotime($records[0]->appointment_date_time))--}}

<script type="text/javascript">
    // document.getElementById('datefield').value = formatDate("dd/mm/yyyy HH:MM", new Date('{{$records[0]->appointment_date_time}}')); 
    // var newformat = moment('{{$records[0]->appointment_date_time}}').format('DD/MM/YYYY H:mm');
    // alert(newformat);
    // $('#datefield').val(newformat);
    // document.getElementById('datefield').value = moment('{{$records[0]->appointment_date_time}}').format('dd/mm/YYYY H:mm');
</script>

<script type="text/javascript">
    $(function() {

        var newformat = moment('{{$records[0]->appointment_date_time}}').format('DD/MM/YYYY');
        // alert(newformat);
        // $('#datefield').val(newformat);
        
		var timeArr = [];
        for (let hr = 0; hr < 24; hr++) {
            let hrStr = hr.toString().padStart(2, "0");

			for (let mint = 0; mint < 60; mint++) {
				let mintStr = mint.toString().padStart(2, "0");

				timeArr.push(hrStr+':'+mintStr);
			}
			// timeArr.push(hrStr+':00');

        }
		// var newtime = timeArr.join();

		// console.log(timeArr);
        $('.datetimepicker1').datetimepicker({
            useCurrent: false,
            closeOnDateSelect: true,
            minDate: moment(),
            step: 1,
            // allowTimes: ['00:00', '01:00', '02:00', '03:00', '04:00', '05:00', '06:00', '07:00',
            //     '08:00', '09:00', '10:00', '11:00', '12:00', '13:00', '14:00', '15:00', '16:00',
            //     '17:00', '18:00', '19:00', '20:00', '21:00', '22:00', '23:00'
            // ]
			allowTimes:timeArr
        });
    });
</script>
</body>

</html>