@extends('admin.layout.master')
@section('custom_style')
    <style>

    </style>
@endsection

@section('content')
@include('flash-message')
    <div class="card sina-card">
        <div class="card-header d-flex justify-content-between align-items-center ">
            <div>
                <h5 class="font-weight-bold mb-0">{{ __('obs.room') }} {{ __('obs.cleaning') }} {{ __('obs.record') }}</h5>
            </div>
            <div>
                <a href="{{ route('housekeeping.room_clean.index') }}"  class="btn btn-sm btn-light">
                    {{ __('obs.room') }} {{ __('obs.cleaning') }}  {{ __('obs.list') }}
                </a>
            </div>
        </div>
        <div class="card-body">
            <form action="{{ route('housekeeping.room_clean.store') }}" method="post" class="form-horizontal" id="room_clean_form" enctype="multipart/form-data">
                @csrf
                @include('frontdesk.house-keeping.room_clean.form')
            
                <div class="row mb-4">
                    <div class="form-group col-8 text-center mt-2">
                        <button id="submit_button" type="button" class="btn btn-primary"  onclick="submitForm('room_clean_form')">
                            <i class="fa fa-save mr-1"></i>Submit
                        </button>
                    </div>
                </div>
            </form>
        </div>
    </div>
@endsection

@section('script')
<script src="{{ asset('/') }}frontdesk/frontdesk_common.js"></script>

    <script>
        $(document).ready(function() {
            
        })
        $(".select_2").select2();
       
        function check_room_info(selectElement) {
            var room_id = $(selectElement).val();
            get_room_info(room_id, function(room_info) {
                if(room_info.room_clean_status==2){
                    $('select[name="room_status"]').val(2);
                }else{
                    $('select[name="room_status"]').val(1);
                }
                console.log("Room Info: ", room_info);
            });
        }

        function get_room_info(room_id, callback) {
            if (room_id) {
                $.ajax({
                    url: "{{ route('frontdesk.room.info') }}",
                    type: "GET",
                    data: { room_id: room_id },
                    dataType: "json",
                    success: function(response) {
                        if (response.status === 'success') {
                            callback(response.data);
                        } else {
                            alert(response.message);
                        }
                    },
                    error: function(xhr) {
                        console.error(xhr.responseText);
                    }
                });
            } else {
                alert('Please select a valid room.');
            }
        }


        function submitForm(formId) {
            var message = "Do you want to Submit?";
            var confirmButtonText = "Yes, Submit it!";
            var actionUrl=null;
            var method=null;    
            
            var requiredFields = {
                room_id: 'Room',
                assigned_user: 'Cleanner',
                service_id: 'Service',
                room_status: 'Checking Status',
                date: 'Date',
            };  
            var foundMissingFields=[];
            var missingFields = checkRequiedField(formId, requiredFields,foundMissingFields);
            showConfirmAndSubmit(formId, message, confirmButtonText, ajax = 0, actionUrl, data=null, method, pageReload = 0, removeDomId = null,  missingFields);
        }
    </script>
@endsection