@extends('admin.layout.master')
@section('title',__('obs.'.$title))
@section('content')
<style>
    textarea{
        min-height: 3rem!important;
    }
</style>
<div class="card sina-card mt-0 mb-1">
    <div class="card-header card-header-s d-flex justify-content-between">
        <h5 class="mb-0">{{__('obs.'.$title)}}</h5>
    </div>
    <div class="card-body pt-1">
        <div class="row" style="border-bottom: 2px solid #000; padding-bottom: 5px;">
            <div class="col-4">
                Title
            </div>
            <div class="col-7">
                Description
            </div>
            <div class="col-1">
                <button type="button" class="btn btn-sm btn-info" onclick="addNewHotelInfo()">{{ __('obs.add_new_row') }}</button>
            </div>
        </div>
        @php $i = 1; @endphp
        <form action="{{ route('frontdesk.update_hotel_information') }}" class="form_submit" method="get" class="">
            <input type="hidden" name="type" value="{{ $type }}">
            <div id="all_info">
                @foreach ($info as $d)
                    <div class="row" id="row_id_{{$i}}">
                        <div class="col-4">
                            <textarea name="title[]" class="form-control" id="" cols="30" rows="3" placeholder="Title">{!! str_replace('<br />', '',$d->title) !!}</textarea>
                        </div>
                        <div class="col-7">
                            <textarea name="description[]" class="form-control" id="" cols="30" rows="3" placeholder="Description">{!! str_replace('<br />', '',$d->description) !!}</textarea>
                        </div>
                        <div class="col-1">
                            <button type="button" class="btn btn-sm btn-danger" onclick="addNewHotelInfo({{$i}})">Remove</button>
                        </div>    
                    </div>
                    @php ++$i; @endphp
                @endforeach
            </div>
            <div class="row">
                <div class="col-2">
                    <button class="btn btn-sm btn-info d-block">Submit</button>
                </div>
            </div>
        </form>
    </div>
</div>
@include('frontdesk.common.common')
@endsection

@section('script')
<script>
    let i = @json($i);
    $(document).ready(function(){
        
    });

    function addNewHotelInfo(j=null){
        let html = `
            <div class="row" id="row_id_${i}">
                <div class="col-4">
                    <textarea name="title[]" class="form-control" id="" cols="30" rows="3" placeholder="Title"></textarea>
                </div>
                <div class="col-7">
                    <textarea name="description[]" class="form-control" id="" cols="30" rows="3" placeholder="Description"></textarea>
                </div>
                <div class="col-1">
                    <button type="button" class="btn btn-sm btn-danger" onclick="addNewHotelInfo(${i})">Remove</button>
                </div>    
            </div>
        `;
        if(j == null){
            $('#all_info').append(html);
            i++;
        }else{
            $(`#row_id_${j}`).remove();
        }
    }
</script>
@endsection