@extends('admin.layout.master')
@section('title', 'Bed Cleaning Status')
@section('custom_style')
<style>
/* input {
    padding:18px !important; 
    box-shadow: none!important;
}
select,.select2-selection--single {
   height: 38px !important; 
   box-shadow: none!important;
}


    table thead th,
    table tbody td {
        padding: 3px 10px !important;
        vertical-align: middle !important;
    } */

</style>
@endsection
@section('content')
    @include('flash-message')
    <div class="card sina-card">
        <div class="card-header card-header-s d-flex  justify-content-between align-items-center">
            <h4 class="m-0">{{__('obs.bed_cleaning_status')}} </h4>
            <div class="">

            </div>
        </div>
        <div class="card-body" style="">
            @if (count($errors) > 0)
                <div class="alert alert-danger">
                    <ul>
                        @foreach ($errors->all() as $error)
                            <li>{{ $error }}</li>
                        @endforeach
                    </ul>
                </div>
            @endif
           <form action="{{ route('housekeeping.bed_clean.status') }}" method="GET" class="form-horizontal">
            <div class="row">
                <div class="col-md-3">
                    <div class="form-group">
                        <label class="labels">{{ __('obs.floor_list') }}</label>
                        <select name="floor_id" id="warehouse_id" class="form-control text-right">
                            <option value="">Select Floor</option>
                            @foreach($repository->floors() as $key => $floor)
                                <option value="{{ $key }}">{{ $floor }}</option>
                            @endforeach
                        </select>
                    </div>
                </div>

                <div class="col-md-3">
                    <div class="form-group">
                        <label class="labels">{{ __('obs.room_list') }}</label>
                        <select name="room_id" id="room_type" class="form-control">
                            <option value="">Select Room</option>
                            @foreach($repository->rooms() as $key => $room)
                                <option value="{{ $key }}">{{ $room }}</option>
                            @endforeach
                        </select>
                    </div>
                </div>

                <div class="col-md-3">
                    <div class="form-group mt-4">
                        <button type="submit" name="search" class="btn btn-md btn-primary">{{ __('obs.search') }}</button>
                    </div>
                </div>
            </div>
        </form>

        </div>
    </div>

    <div class="card ">

        <div class="card-body">
           <form action="{{ route('housekeeping.bed_clean.status.update') }}" method="POST" class="form-horizontal" id="myform" enctype="multipart/form-data">
            @csrf
            @method('PUT')

            <div class="">
                <div class="table-responsive" id="print">
                    <table class="table table-bordered table-hover" id="datatable_apply" width="100%">
                        <thead class="mt-3">
                            <tr>
                                <th width="10%">{{__('obs.floor')}}</th>
                                <th width="10%">{{__('obs.room')}}</th>
                                <th width="10%">{{__('obs.bed')}}</th>
                                <th width="20%">{{__('obs.bed')}} {{__('obs.status')}}</th>
                                <th width="25%" style=" ">
                                    <div class="input-group">
                                        <div class="input-group-prepend">
                                            <div class="input-group-text">{{__('obs.hk_status')}}</div>
                                        </div>
                                        <select name="" id="room_status" class="form-control">
                                            <option value="">Select Bed Status</option>
                                            <option value="1">{{ __('obs.ready') }}</option>
                                            <option value="2">{{ __('obs.in_used') }}</option>
                                            <option value="3">{{ __('obs.dirty') }}</option>
                                            <option value="4">{{ __('obs.out_of_order') }}</option>
                                        </select>
                                    </div>
                                </th>
                                <th width="20%">
                                    <input type="checkbox" name="" id="selectall"> &nbsp; {{__('obs.modify')}}
                                </th>

                            </tr>
                        </thead>
                        <tbody>
                            @foreach ($rooms as $room)

                                {{-- @if ($room->parentRoom->room_status != 1) --}}
                                    <tr>
                                        <td>
                                            {{ $room->floor->floor_no }}
                                        </td>
                                        <td>
                                            {{ $room->parentRoom ? $room->parentRoom->room_number : null }}
                                            <input class="" type="hidden" name="id[]" id="" value="{{ $room->id }}">
                                            &nbsp;

                                        </td>
                                        <td>
                                            {{ $room ? $room->room_number : null }}

                                        </td>
                                        <td>
                                         <select name="" class="form-control" disabled>
                                            <option value="1" {{ $room->bed_status == 1 ? 'selected' : '' }}>{{ __('obs.ready') }}</option>
                                            <option value="2" {{ $room->bed_status == 2 ? 'selected' : '' }}>{{ __('obs.in_used') }}</option>
                                            <option value="3" {{ $room->bed_status == 3 ? 'selected' : '' }}>{{ __('obs.dirty') }}</option>
                                            <option value="4" {{ $room->bed_status == 4 ? 'selected' : '' }}>{{ __('obs.out_of_order') }}</option>
                                        </select>

                                        </td>
                                        <td>
                                            <select name="hk_room_status[]" id="hk_room_status{{ $room->id }}" class="form-control showSelected" data-id="{{ $room->id }}" required>
                                                <option value="">Select Bed Status</option>
                                                <option value="1" {{ $room->hk_room_status == 1 ? 'selected' : '' }}>{{ __('obs.ready') }}</option>
                                                <option value="2" {{ $room->hk_room_status == 2 ? 'selected' : '' }}>{{ __('obs.in_used') }}</option>
                                                <option value="3" {{ $room->hk_room_status == 3 ? 'selected' : '' }}>{{ __('obs.dirty') }}</option>
                                                <option value="4" {{ $room->hk_room_status == 4 ? 'selected' : '' }}>{{ __('obs.out_of_order') }}</option>
                                            </select>

                                            <input type="hidden" name="reason[]" id="out_of_order_reason{{ $room->id }}" class="form-control out_of_order_reason" placeholder="Type Reason" value="">
                                        </td>

                                        <td>
                                            <input class="selectedId {{ 'change_status' . $room->id }} myCheckBox"
                                                type="checkbox" name="change_status[]" , id='' value="{{ $room->id }}">
                                            &nbsp;
                                        </td>
                                    </tr>
                                {{-- @endif --}}
                            @endforeach

                    </table>
                </div>
                <div class="form-group col-12 text-center">
                    <button id="submit_button" type="button" class="btn btn-primary" onClick='submitDetailsForm()'> <i
                            class="fa fa-save"></i> {{__('obs.submit')}}</button>
                </div>
            </div>
           </form>

        </div>
    </div>


@endsection
@section('script')
    <script>
        function updateConfirmation() {
            if (!confirm("Are You Sure to Update This"))
                event.preventDefault();
        }

        $(document).ready(function() {

            $('#room_status').on('change', function(e) {
                var val = $(e.target).val();
                var selectVal = $(".showSelected").val(val);
                $('#selectall').prop('checked', true);
                $('.selectedId').prop('checked', true);
                if(val == 4){
                  $(".out_of_order_reason").attr("type", 'textarea');
                }else{
                    $(".out_of_order_reason").attr("type", 'hidden'); 
                }      

            });

            $('#selectall').click(function() {
                $('.selectedId').prop('checked', this.checked);
            });

            $('.showSelected').on('change', function(e) {

                var val = $(this).attr('data-id');
                var hk_room_status = $("#hk_room_status"+val).val();

                if(hk_room_status == 4){
                    $("#out_of_order_reason"+val).attr("type", 'textarea');;
                }else{
                    $(".out_of_order_reason").attr("type", 'hidden'); 
                }    
                $('.change_status' + val).prop('checked', true);

            });



        });

        function submitDetailsForm() {
            var selected_value = []; // initialize empty array 
            // $(".showSelected").each(function(){
            //     selected_value.push($(this).val());
            // });

            $(".selectedId:checked").each(function() {
                selected_value.push($(this).val());
            });

            if (selected_value.length > 0) {
                $("#myform").submit();
            } else {
                alert('Empty Checkbox Value')
            }

        }
    </script>
@endsection