{% extends 'base.html' %}

{% block content %}
<div class="card">
    <div class="card-body">
        <h1>{% block title %} Salary Rate Forecasting {% endblock %}</h1>

        <!-- Main Input For Receiving Query to our ML -->
        <form action="{{ url_for('predict')}}" method="post">
            <div class="form-group">
                <label for="exampleInputPassword1">Job Position Level</label>
                <br>
                <select class="form-select form-select-sm" aria-label=".form-select-sm example" name="comp_select">
                    <option selected>Select Position Level</option>
                    <option value="1">Junior</option>
                    <option value="2">Senior</option>
                    <option value="3">Chief Technology Officer</option>
                    <option value="4">Project Manager</option>
                </select>
            </div>
            <div class="form-group">
                <label for="exampleInputPassword1">Experience</label>
                <input type="text" class="form-control" name="experience" placeholder="Experience" required="required" />
            </div>

            <button type="submit" class="btn btn-primary">Predict Salary Rate</button>
        </form>

        <br>
        <br>
        <label for="exampleInputPassword1"> </label>{{ prediction_text }} </label>
    </div>
</div>
{% endblock %}