@extends('dashboard.base')

@section('css')
    <style>
        .btn-group-toggle .active{
            border: 2px solid black;
        }
    </style>
@endsection

@section('content')
<div class="container-fluid">
    <div class="fade-in">
        <div class="row">
            <div class="col-md-11">
                <div class="portlet light bordered card card-body">
                    <div class="portlet-title">
                       
                        <div class="caption font-red-sunglo">
                            <i class="icon-settings font-red-sunglo"></i>
                            <span class="caption-subject bold uppercase" style="font-weight: bold;font-size:16px;">
                                Feedback Form</span>
                        @if(Session::has('message'))
                            <div class="alert alert-success" role="alert">{{ Session::get('message') }}</div>
                        @endif
                        </div>

                        <div class="portlet-body form">
                            <form action="{{ route('feedback_submit') }}" method="post" role="form">
                                @csrf
                                <div class="form-body">
                                    @if(str_contains(Auth::user()->menuroles, "exporter"))
                                    <div class="form-group">
                                        <label for="visits">Number of visitors received during exhibition</label>
                                        <input class="form-control" type="number" name="visits" id="visits" required>
                                    </div>
                                    <div class="form-group">
                                        <label for="leads">Number of companies that showed interest</label>
                                        <input class="form-control" type="number" name="leads" id="leads" required>
                                    </div>
                                    <div class="form-group">
                                        <label for="orders">Number of orders booked</label>
                                        <input class="form-control" type="number" name="orders" id="orders" required>
                                    </div>
                                    <div class="form-group">
                                        <label for="amount">Approximate value of orders booked (USD)</label>
                                        <input class="form-control" type="number" name="amount" id="amount">
                                    </div>
                                    <label for="portal_feedback">How helpful did you find B2B Portal in connecting with potential customers?</label>
                                    <div class="form-group text-center">
                                        <div class="btn-group btn-group-toggle" data-toggle="buttons">
                                            <label class="btn btn-info active">
                                                <input type="radio" name="portal_feedback" id="option1" value="Very Helpful" checked> Very Helpful
                                            </label>
                                            <label class="btn btn-info  ml-5">
                                                <input type="radio" name="portal_feedback" id="option2" value="Somewhat Helpful"> Somewhat Helpful
                                            </label>
                                            <label class="btn btn-info ml-5">
                                                <input type="radio" name="portal_feedback" id="option3" value="Not Helpful"> Not Helpful
                                            </label>
                                        </div>
                                    </div>
                                    <label for="portal_feedback">Details of companies that showed interest:</label>
                                    <table class="table table-responsive">
                                        <thead class="thead-dark">
                                            <tr>
                                                <th scope="col">Company Name</th>
                                                <th scope="col">Country</th>
                                                <th scope="col">Nature of Enquiry</th>
                                                <th scope="col">Orders Booked</th>
                                                <th scope="col"></th>
                                            </tr>
                                        </thead>
                                        <tbody>
                                            <tr>
                                                    <td>
                                                        <input type="text" name="companies[]">
                                                    </td>
                                                    <td>
                                                        <input type="text" name="countries[]">
                                                    </td>
                                                    <td>
                                                        <input type="text" name="enquiries[]">
                                                    </td>
                                                    <td>
                                                        <input type="number" name="orders_booked[]">
                                                    </td>
                                                    <td>
                                                        <button type="button" class="remove-row"><i class="cil-trash"></i></button>
                                                    </td>
                                            </tr>
                                            <tr>
                                                    <td>
                                                        <input type="text" name="companies[]">
                                                    </td>
                                                    <td>
                                                        <input type="text" name="countries[]">
                                                    </td>
                                                    <td>
                                                        <input type="text" name="enquiries[]">
                                                    </td>
                                                    <td>
                                                        <input type="number" name="orders_booked[]">
                                                    </td>
                                                    <td>
                                                        <button type="button" class="remove-row"><i class="cil-trash"></i></button>
                                                    </td>
                                            </tr>
                                            <tr>
                                                    <td>
                                                        <input type="text" name="companies[]">
                                                    </td>
                                                    <td>
                                                        <input type="text" name="countries[]">
                                                    </td>
                                                    <td>
                                                        <input type="text" name="enquiries[]">
                                                    </td>
                                                    <td>
                                                        <input type="number" name="orders_booked[]">
                                                    </td>
                                                    <td>
                                                        <button type="button" class="remove-row"><i class="cil-trash"></i></button>
                                                    </td>
                                            </tr>
                                            <tr>
                                                    <td>
                                                        <input type="text" name="companies[]">
                                                    </td>
                                                    <td>
                                                        <input type="text" name="countries[]">
                                                    </td>
                                                    <td>
                                                        <input type="text" name="enquiries[]">
                                                    </td>
                                                    <td>
                                                        <input type="number" name="orders_booked[]">
                                                    </td>
                                                    <td>
                                                        <button type="button" class="remove-row"><i class="cil-trash"></i></button>
                                                    </td>
                                            </tr>
                                            <tr>
                                                    <td>
                                                        <input type="text" name="companies[]">
                                                    </td>
                                                    <td>
                                                        <input type="text" name="countries[]">
                                                    </td>
                                                    <td>
                                                        <input type="text" name="enquiries[]">
                                                    </td>
                                                    <td>
                                                        <input type="number" name="orders_booked[]">
                                                    </td>
                                                    <td>
                                                        <button type="button" class="remove-row"><i class="cil-trash"></i></button>
                                                    </td>
                                            </tr>
                                        </tbody>
                                        <div class="box-body">
                                            <div class="button-group">
                                                <a href="javascript:void(0)" class="add-row"><i class="cil-plus"></i> Add Row</a>
                                            </div>
                                        </div>
                                        </table>

                                    @endif
                                    <div class="form-group">
                                        <label for="feedback">Your Comments</label>
                                        <textarea class="form-control" name="his_feedback" id="his_feedback" cols="30" rows="6" placeholder="If any...."></textarea>
                                    </div>
                                    <div class="form-actions">
                                        <button type="submit" class="btn btn-primary">Submit</button>
                                    </div>
                            </form>
                        </div>
                       
                        
                    </div>
                </div>
            </div>
        </div>
    </div>
</div>
</div>
</div>
@endsection
@section('javascript')
    <script>
        $(".add-row").on('click', function(){
            var row = '<td> <input type="text" name="companies[]"></td>';
            row += '<td><input type="text" name="countries[]"></td>';
            row += '<td><input type="text" name="enquiries[]"></td>';
            row += '<td><input type="number" name="orders_booked[]"></td>';
            row +='<td><button type="button" class="remove-row"><i class="cil-trash"></i></button></td>';

            var markup = "<tr>" + row + "</tr>";
            $("table").append(markup);
        });
        $(".table").on('click', '.remove-row', function(){
            $(this).closest("tr").remove();
        });
    </script>
@endsection