<x-form @submit.prevent="submit">
    <x-modal>
        <div v-if="!fields.input_type" class="form-group">
            <x-label for="ship_id"  > {{__('Ship') }}</x-label>
            <v-select name="ship_id"    v-model="fields.ship_id" @search="fetchShips" :options="ships" :reduce="item => item.id" label="name"  />
            <x-error v-if="errors && errors.ship_id">@{{ errors.ship_id[0] }}</x-error>
        </div>
        <div v-if="!fields.input_type" class="form-group">
            <x-label for="type_id"  > {{__('Room Type') }}</x-label>
            <v-select name="type_id"    v-model="fields.type_id" @search="fetchRoomType" :options="room_types" :reduce="item => item.id" label="name"  />
            <x-error v-if="errors && errors.type_id">@{{ errors.type_id[0] }}</x-error>
        </div>
        <div v-if="!fields.input_type" class="form-group">
            <x-label for="input_type"  > {{__('Entry type') }}</x-label>
            <select class="form-control" v-model="fields.input_type" >
                <option value="0">One Room</option>
                <option value="1">More</option>
            </select>
        </div>
        <div v-if="!fields.input_type||fields.input_type=='0'">
            <div class="form-group">
                <x-label for="room_number"  > {{__('Room Number') }}</x-label>
                <x-input type="number"  name="room_number"  v-model="fields.room_number" required />
                <x-error v-if="errors && errors.room_number">@{{ errors.room_number[0] }}</x-error>
            </div>
        </div>
        <div v-else >
            <div class="row">
                <div class="form-group col-6">
                    <x-label for="room_from"  > {{__('Room Number From') }}</x-label>
                    <x-input type="number"  name="room_from"  v-model="fields.room_from" required />
                    <x-error v-if="errors && errors.room_from">@{{ errors.room_from[0] }}</x-error>
                </div>
                <div class="form-group col-6">
                    <x-label for="room_to"  > {{__('Room Number To') }}</x-label>
                    <x-input type="number"  name="room_to"  v-model="fields.room_to" required />
                    <x-error v-if="errors && errors.room_to">@{{ errors.room_to[0] }}</x-error>
                </div>  
            </div>
        </div>

        <div class="form-group">
            <div class="custom-control custom-switch">
                <x-input name="status" type="checkbox" id="status" v-model="fields.status" class="custom-control-input" />
                <x-label for="status"  class="custom-control-label" > {{__('Status') }}</x-label>
            </div>
        </div>
        <x-slot name="footer">
            <a @click="save" class="btn btn-success float-left mx-1 float-right link-submit">{{ __('Save') }}</a>
            <button type="submit" class="btn btn-primary float-right link-submit">{{ __('save and continue') }}</button>
        </x-slot>
    </x-modal>
</x-form>