@extends('layouts.service-details-layout', [
    'subTitle' => 'Create Demand Notice'
])

@section('content')
    <!-- Zero configuration table -->
    <section class="main-content-section">
        <div class="row">
            <div class="col-md-12">
                <form action="{{ route('demand_notice.create', ['service' => $service->id]) }}" method="POST">
                    @csrf
                    <div class="form-group">
                        <label class="form-label" for="fee_name">Name</label>
                        <input type="text" class="form-control" id="fee_name" name="fee_name" required value="{{ old('fee_name') }}">
                    </div>
                    <input id="fixed-fee-type" required type="radio" hidden checked name="fee_type" value="fixed"/>
                    <div class="form-group" id="fixed-amount-field">
                        <label class="form-label" for="fixed_amount">Amount</label>
                        <input type="text" disabled class="form-control" placeholder="Enter amount" id="fixed_amount" name="fixed_amount" required value="{{ old('fixed_amount') }}" onkeypress="BaseHelper.allowOnlyNum(event)">
                    </div>
                    <div id="formula-select-section">
                        <div class="form-group">
                            <label class="form-label" for="formula">Formula</label>
                            <select class="form-control" disabled id="formula" required name="formula" data-preselected="{{ old('formula') }}">
                                <option value="">Select Formula</option>
                                @foreach($formulaFunctions as $formula)
                                    <option value="{{ $formula->id }}" @if(old('formula') == $formula->id) selected @endif>{{ $formula->display_name }} {{$formula->description ? "($formula->description)" : ''}}</option>
                                @endforeach
                            </select>
                        </div>
                        <div id="param-matcher-container" class="w-90 m-auto">

                        </div>
                    </div>
                    <div class="form-group">
                        <button class="btn btn-primary" type="submit">Submit</button>
                    </div>
                </form>
            </div>
        </div>
    </section>
@endsection

@section('more-scripts')
    <script src="{{ asset('js/pages/create-demand-notice.js') }}"></script>

@endsection