@include('includes/header_start')

<!-- DataTables -->
<link href="{{ asset('assets/plugins/datatables/dataTables.bootstrap4.min.css') }}" rel="stylesheet" type="text/css" />
<link href="{{ asset('assets/plugins/datatables/buttons.bootstrap4.min.css') }}" rel="stylesheet" type="text/css" />
<!-- Responsive datatable examples -->
<link href="{{ asset('assets/plugins/datatables/responsive.bootstrap4.min.css') }}" rel="stylesheet" type="text/css" />

@include('includes/header_end')

<!-- Page title -->
<ul class="list-inline menu-left mb-0">
    <li class="list-inline-item">
        <button type="button" class="button-menu-mobile open-left waves-effect">
            <i class="ion-navicon"></i>
        </button>
    </li>
    <li class="hide-phone list-inline-item app-search">
        <h3 class="page-title">View & Edit Questionnaire</h3>
    </li>
</ul>

<div class="clearfix"></div>
</nav>

</div>

<div class="page-content-wrapper">

    <div class="container-fluid">


            <div class="row">
                    <div class="col-md-3">

                        <!-- Profile Image -->
                        <div class="card m-b-30">
                            <div class="card-body">

    {{--                            @if(null === $inventory->image)--}}

    {{--                            @else--}}
    {{--                                <img src="{{ asset('images/'.$inventory->image) }}" alt="BG" style="width:100%">--}}
    {{--                            @endif--}}

                                <h3 class="profile-username text-center">{{ $questionnaire->name }}</h3>

                                <p class="text-muted text-center">
                                <td><span class="label label-success">Type: {{ isset($questionnaire->type) ? $questionnaire->type : "Standard" }}</span></td>
                                </p>

                                <ul class="list-group list-group-unbordered">
                                    <li class="list-group-item">
                                        <b>Created: </b> <a class="pull-right">{{ date('m/d/Y H:i:s', strtotime($questionnaire->created_at)) }}</a>
                                    </li>
                                    <li class="list-group-item">
                                        <b>Updated: </b> <a class="pull-right">{{ $questionnaire->updated_at->diffForHumans() }}</a>
                                    </li>
                                    {{--                                    <li class="list-group-item">--}}
                                    {{--                                        <b>Estimated Duration</b> <a class="pull-right">{{ $task->estimated_duration }} days</a>--}}
                                    {{--                                    </li>--}}
                                    {{--                                    <li class="list-group-item">--}}
                                    {{--                                        <b>Total Payment</b> <a class="pull-right">${{ $task->overall_price }}</a>--}}
                                    {{--                                    </li>--}}
                                </ul>

                            </div>
                        </div>

                        <button type="button" class="btn btn-primary waves-effect waves-light" data-toggle="modal" data-target=".bs-example-modal-lg">Add Question</button>

                    </div>

                    <div class="col-md-9">
                        <div class="card">
                            <div class="card-body">
                                <h1>Questions</h1>
                                <hr>


                                <div class="table-responsive">
                                    <table id="datatable-buttons" class="table table-striped table-bordered" cellspacing="0" width="100%">
                                        <thead>
                                        <tr>
                                            <th>Title</th>
    {{--                                        <th>Body</th>--}}
                                            <th>Status</th>
                                            <th>Created</th>
                                            <th>Updated</th>
                                        </tr>
                                        </thead>


                                        <tbody>
                                        @foreach($questions as $key=>$question)
                                            <tr>
                                                <td>{{ $question->title  }}</td>
    {{--                                            <td>{{ $question->body }}</td>--}}
                                                @if($question->status == 1)
                                                    <td>
                                                        <span class="badge badge-success">Active</span>
                                                    </td>
                                                @elseif($question->status == 0)
                                                    <td>
                                                        <span class="badge badge-danger">Inactive</span>
                                                    </td>
                                                @endif
                                                <td>{{ $question->created_at->diffForHumans() }}</td>
                                                <td>{{ $question->updated_at->diffForHumans() }}</td>
                                            </tr>
                                        @endforeach
                                        </tbody>
                                    </table>
                                </div>

                            </div>
                        </div>
                    </div>


            </div>
        <div class="row">
                <div class="col-md-12">



                </div>

            </div>

        </section><!-- /.content -->
    </div><!-- /.content-wrapper -->

    <!--  Modal content for the above example -->
    <div class="modal fade bs-example-modal-lg" tabindex="-1" role="dialog" aria-labelledby="myLargeModalLabel" aria-hidden="true">
        <div class="modal-dialog modal-lg">
            <div class="modal-content">
                <div class="modal-header">
                    <h5 class="modal-title mt-0" id="myLargeModalLabel">Add Question</h5>
                    <button type="button" class="close" data-dismiss="modal" aria-hidden="true">×</button>
                </div>
                <div class="modal-body">

                    <div class="alert alert-success alert-dismissible" id="question-success" style="display: none;">
                        <button type="button" class="close" data-dismiss="alert" aria-hidden="true">&times;</button>
                    </div>

                    <div class="alert alert-danger alert-dismissible" id="question-alert" style="display: none;">
                        <button type="button" class="close" data-dismiss="alert" aria-hidden="true">&times;</button>
                    </div>

                    <input type="hidden" class="form-control" id="key" name="key" value="{{ $key }}">
                    <input type="hidden" class="form-control" id="questionnaire_id" name="questionnaire_id" value="{{ request()->segment(3) }}">


                    <!-- text input -->
                    <div class="form-group">
                        <label>Question Title</label>
                        <input type="text" class="form-control" placeholder="Enter the question" id="question_title" name="name" value="{{ old('name') }}">

                        @error('name')
                        <span class="label label-warning">{{ $message }}</span>
                        @enderror

                    </div>

                    <!-- textarea -->
                    <div class="form-group">
                        <label>Body</label>
                        <textarea class="form-control" rows="3" id="question_body" name="body" placeholder="Enter your question body here...">{{ old('description') }}</textarea>

                        @error('description')
                        <span class="label label-warning">{{ $message }}</span>
                        @enderror

                    </div>
                    <div class="row">
                        <div class="col-md-6">

                            <div class="form-group">
                                <label>Question Type</label>
                                <select class="form-control" id="question_type" name="type">
                                    <option value="">Select Type</option>
                                    <option value="yesno">Yes/No</option>
                                    <option value="text">Text</option>
                                    <option value="textarea">Text Block</option>
                                    <option value="select">Select</option>
                                    <option value="multipleselect">Multiple Select</option>
                                </select>

                                @error('type')
                                <span class="label label-warning">{{ $message }}</span>
                                @enderror

                            </div>
                        </div>

                        <div class="col-md-6">
                            <div class="form-group">
                                <label>Status</label>
                                <select class="form-control" id="question_status" name="status">
                                    <option value="1">Active</option>
                                    <option value="0">Inactive</option>
                                </select>

                                @error('status')
                                <span class="label label-warning">{{ $message }}</span>
                                @enderror

                            </div>
                        </div>

                    </div>

                    <div class="row">
                        <div class="col-md-12">
                            <button type="button" id="question_submit" class="btn btn-primary btn-flat pull-right">Submit</button>
                        </div>
                    </div>

                    @include('ajax.scripts.question')
                </div>
            </div><!-- /.modal-content -->
        </div><!-- /.modal-dialog -->
    </div><!-- /.modal -->

@include('includes/footer_start')

<!-- Required datatable js -->
<script src="{{ asset('assets/plugins/datatables/jquery.dataTables.min.js') }}"></script>
<script src="{{ asset('assets/plugins/datatables/dataTables.bootstrap4.min.js') }}"></script>
<!-- Buttons examples -->
<script src="{{ asset('assets/plugins/datatables/dataTables.buttons.min.js') }}"></script>
<script src="{{ asset('assets/plugins/datatables/buttons.bootstrap4.min.js') }}"></script>
<script src="{{ asset('assets/plugins/datatables/jszip.min.js') }}"></script>
<script src="{{ asset('assets/plugins/datatables/pdfmake.min.js') }}"></script>
<script src="{{ asset('assets/plugins/datatables/vfs_fonts.js') }}"></script>
<script src="{{ asset('assets/plugins/datatables/buttons.html5.min.js') }}"></script>
<script src="{{ asset('assets/plugins/datatables/buttons.print.min.js') }}"></script>
<script src="{{ asset('assets/plugins/datatables/buttons.colVis.min.js') }}"></script>
<!-- Responsive examples -->
<script src="{{ asset('assets/plugins/datatables/dataTables.responsive.min.js') }}"></script>
<script src="{{ asset('assets/plugins/datatables/responsive.bootstrap4.min.js') }}"></script>

<!-- Datatable init js -->
<script src="{{ asset('assets/pages/datatables.init.js') }}"></script>

@include('includes/footer_end')