<x-app-layout>
    @section('title')
        Appoinment Update
    @endsection

    <div class="row">
        <div class="col-lg-12 m-auto">
            <!-- Page Heading -->
            <h1 class="h3 mb-2 text-gray-800">
                <a href="{{ route('admin.appoinments.index') }}" class="btn btn-primary"><i class="fas fa-plus"
                        aria-hidden="true"></i>
                    Listing Appoinment
                </a>
            </h1>
            <!-- DataTales Example -->
            <div class="card shadow mb-4">
                <div class="card-header py-3">
                    <h6 class="m-0 font-weight-bold text-primary">
                        Edit Appoinment
                    </h6>
                </div>
                <div class="card-body">
                    <form role="form" method="post" action="{{ route('admin.appoinments.update', $data->id) }}"
                        class="needs-validation" novalidate>
                        {{ csrf_field() }}
                        @method('PUT')
                        <div class="box-body">
                            <div class="row">

                                <div class="col-sm-12">
                                    <div class="form-group">
                                        <label class="mb-0">Service name <span class="text-danger">*</span></label>

                                        <select onchange="getDoctors()" name="service_id" id="service_id"
                                            class="form-control" required>
                                            <option value="">Select Service</option>
                                            @foreach ($services as $service)
                                                <option value="{{ $service->id }}"
                                                    {{ $data->service_id == $service->id ? 'selected' : '' }}>
                                                    {{ $service->name }}</option>
                                            @endforeach
                                        </select>
                                        @error('service_id')
                                            <span class="text-danger">{{ $message }}</span>
                                        @enderror
                                    </div>
                                </div>


                                <div class="col-sm-12">
                                    <div class="form-group">
                                        <label class="mb-0">Doctor name <span class="text-danger">*</span></label>

                                        <select onchange="getTimes()" name="doctor_id" id="doctor_id"
                                            class="form-control" required>
                                            <option value="">Select Doctor</option>
                                            @foreach ($doctors->where('service_id', $data->service_id) as $service)
                                                <option value="{{ $service->id }}"
                                                    {{ $data->doctor_id == $service->id ? 'selected' : '' }}>
                                                    {{ $service->name }}</option>
                                            @endforeach
                                        </select>
                                        @error('doctor_id')
                                            <span class="text-danger">{{ $message }}</span>
                                        @enderror
                                    </div>
                                </div>

                                <div class="col-sm-12">
                                    <div class="form-group">
                                        <label class="mb-0">Apply Date<span class="text-danger">*</span></label>
                                        <input type="date" name="apply_date"
                                            class="form-control @error('apply_date') is-invalid @enderror"
                                            value="{{ \Carbon\Carbon::parse($data->apply_date)->format('Y-m-d') }}"
                                            required />

                                        @error('apply_date')
                                            <span class="text-danger">{{ $message }}</span>
                                        @enderror
                                    </div>
                                </div>


                                <div class="col-sm-12">
                                    <div class="form-group">
                                        <label class="mb-0">Sheduled Time <span class="text-danger">*</span></label>

                                        <select name="apply_time" id="apply_time" class="form-control" required>
                                            <option value="">Select Time</option>
                                            @foreach ($times->where('doctor_id', $data->doctor_id) as $service)
                                                <option value="{{ $service->id }}"
                                                    {{ $data->apply_time == $service->id ? 'selected' : '' }}>
                                                    {{ $service->name }}</option>
                                            @endforeach
                                        </select>
                                        @error('apply_time')
                                            <span class="text-danger">{{ $message }}</span>
                                        @enderror
                                    </div>
                                </div>



                                <div class="col-sm-12">
                                    <div class="form-group">
                                        <label class="mb-0">Patient Name <span class="text-danger">*</span></label>
                                        <input type="text" name="name"
                                            class="form-control @error('name') is-invalid @enderror"
                                            placeholder="Services name" value="{{ $data->name }}" required />
                                        @error('name')
                                            <span class="text-danger">{{ $message }}</span>
                                        @enderror
                                    </div>
                                </div>

                                <div class="col-sm-12">
                                    <div class="form-group">
                                        <label class="mb-0">Patient Phone <span class="text-danger">*</span></label>
                                        <input type="text" name="phone"
                                            class="form-control @error('phone') is-invalid @enderror"
                                            placeholder="Services phone" value="{{ $data->phone }}" required />
                                        @error('phone')
                                            <span class="text-danger">{{ $message }}</span>
                                        @enderror
                                    </div>
                                </div>


                                <div class="col-sm-12">
                                    <div class="form-group">
                                        <label for="status" class="mb-0">Appoinment Update Status <span
                                                class="text-danger">*</span></label>
                                        <select name="status" id="status"
                                            class="form-control @error('status') is-invalid @enderror">
                                            <option value="1" {{ @$data->status == 1 ? 'selected' : '' }}>
                                                Approve
                                            </option>
                                            <option value="0" {{ @$data->status == 0 ? 'selected' : '' }}>
                                                Pending
                                            </option>

                                            <option value="2" {{ @$data->status == 2 ? 'selected' : '' }}>
                                                Cancel
                                            </option>

                                        </select>
                                        @error('status')
                                            <span class="text-danger">{{ $message }}</span>
                                        @enderror
                                    </div>
                                </div>

                            </div>
                        </div>
                        <div class="box-footer">
                            <button type="submit" class="btn btn-primary">Update</button>

                        </div>
                    </form>
                </div>
            </div>
        </div>
    </div>
    <script>
        function getDoctors() {
            var service_id = $('#service_id').val();
            var doctor_id = $('#doctor_id');
            var apply_time = $('#apply_time');

            if (service_id) {
                $.ajax({
                    method: 'post',
                    url: "{{ route('getdoctors') }}",
                    data: {
                        service_id: service_id,
                        _token: "{{ csrf_token() }}"
                    },
                    success: function(result) {
                        doctor_id.find('option').not(':first').remove();
                        apply_time.find('option').not(':first').remove();
                        $.each(result, function(key, value) {
                            doctor_id.append('<option value="' + value
                                .id + '">' + value.name + '</option>');
                        });
                    }
                });
            } else {
                doctor_id.find('option').not(':first').remove();
                apply_time.find('option').not(':first').remove();
            }
        }

        function getTimes() {
            var doctor_id = $('#doctor_id').val();
            var apply_time = $('#apply_time');

            if (doctor_id) {
                $.ajax({
                    method: 'post',
                    url: "{{ route('gettimes') }}",
                    data: {
                        doctor_id: doctor_id,
                        _token: "{{ csrf_token() }}"
                    },
                    success: function(result) {
                        apply_time.find('option').not(':first').remove();
                        $.each(result, function(key, value) {
                            apply_time.append('<option value="' + value
                                .id + '">' + value.name + '</option>');
                        });
                    }
                });
            } else {
                apply_time.find('option').not(':first').remove();
            }
        }
    </script>
</x-app-layout>
