@extends('layouts.app')

@section('title', __('bms::lang.matching') . ' — ' . __('bms::lang.tester'))

@section('content')

<section class="content-header">
    <h1>@lang('bms::lang.matching')
        <small>@lang('bms::lang.tester')</small>
    </h1>
</section>

<section class="content">
    <div class="row">
        <div class="col-md-4">
            @component('components.widget', ['class' => 'box-primary', 'title' => __('bms::lang.criteria')])
                {!! Form::open(['route' => 'bms.matching.run', 'method' => 'post', 'id' => 'bms-match-form']) !!}
                    <div class="form-group">
                        {!! Form::label('attendees', __('bms::lang.attendees') . ':') !!}
                        {!! Form::number('attendees', null, ['class' => 'form-control', 'min' => 0, 'placeholder' => 'e.g. 250']) !!}
                    </div>
                    <div class="form-group">
                        {!! Form::label('fnb_level', __('bms::lang.fnb_level') . ':') !!}
                        {!! Form::select('fnb_level', $fnbLevels, null, ['class' => 'form-control', 'placeholder' => __('messages.please_select')]) !!}
                    </div>
                    <div class="form-group">
                        {!! Form::label('venue_preference', __('bms::lang.venue_type') . ':') !!}
                        {!! Form::select('venue_preference', $venueTypes, null, ['class' => 'form-control', 'placeholder' => __('messages.please_select')]) !!}
                    </div>
                    <div class="form-group">
                        {!! Form::label('area_id', __('bms::lang.area') . ':') !!}
                        {!! Form::select('area_id', $areas, null, ['class' => 'form-control', 'placeholder' => __('messages.please_select')]) !!}
                    </div>
                    <div class="form-group">
                        {!! Form::label('budget', __('bms::lang.budget') . ':') !!}
                        {!! Form::number('budget', null, ['class' => 'form-control', 'min' => 0, 'step' => '0.01', 'placeholder' => 'e.g. 200000']) !!}
                    </div>
                    <div class="form-group">
                        {!! Form::label('dates', __('bms::lang.dates') . ':') !!}
                        {!! Form::text('dates', null, ['class' => 'form-control', 'placeholder' => '2026-07-15, 2026-07-20']) !!}
                        <small class="text-muted">@lang('bms::lang.dates_hint')</small>
                    </div>
                    <button type="submit" class="tw-dw-btn tw-dw-btn-primary tw-text-white btn-block">
                        <i class="fa fa-search"></i> @lang('bms::lang.find_halls')
                    </button>
                {!! Form::close() !!}
            @endcomponent
        </div>

        <div class="col-md-8">
            <div id="bms-match-results">
                @component('components.widget', ['class' => 'box-solid'])
                    <p class="text-muted" style="margin:0">@lang('bms::lang.run_match_hint')</p>
                @endcomponent
            </div>
        </div>
    </div>
</section>

@endsection

@section('javascript')
<script>
$(function () {
    $('#bms-match-form').on('submit', function (e) {
        e.preventDefault();
        var $form = $(this);
        var $btn = $form.find('button[type=submit]').prop('disabled', true);
        $('#bms-match-results').html('<div class="text-center" style="padding:40px"><i class="fa fa-spinner fa-spin fa-2x text-muted"></i></div>');
        $.ajax({
            url: $form.attr('action'),
            method: 'POST',
            data: $form.serialize(),
            success: function (html) {
                $('#bms-match-results').html(html);
                if (window.__currency_convert_recursively) __currency_convert_recursively($('#bms-match-results'));
            },
            error: function () { toastr.error('{{ __('messages.something_went_wrong') }}'); },
            complete: function () { $btn.prop('disabled', false); }
        });
    });
});
</script>
@endsection
