@extends('Training::backend.layouts.app')

@section('title', 'Surprise Test Result')

@push('css')
    <style>

    </style>
@endpush

@section('content')
    <!-- Page Content-->
    <div class="page-content-tab">
        <div class="container-fluid">
            <!-- Page-Title -->
            <div class="row">
                <div class="col-sm-12">
                    <div class="page-title-box">
                        <div class="float-right">
                            <ol class="breadcrumb">
                                <li class="breadcrumb-item">
                                    <a href="javascript:void(0);">Training</a>
                                </li>
                                <li class="breadcrumb-item">
                                    <a href="{{ route('admin.training.surprise-test-results') }}">Surprise Test Result List</a>
                                </li>
                                <li class="breadcrumb-item active">Surprise Test Result</li>
                            </ol>
                        </div>
                        <h4 class="page-title">Surprise Test Result</h4>
                    </div>
                    <!--end page-title-box-->
                </div>
                <!--end col-->
            </div>
            <div class="row">
                <div class="col-md-12">
                    @if(session('success'))
                        <div id="mydiv" class="alert alert-success mt-3 text-center">
                            {{ session('success') }}
                        </div>
                    @endif

                    @if(session('error'))
                        <div id="mydiv" class="alert alert-danger mt-3 text-center">
                            {{ session('error') }}
                        </div>
                    @endif
                    <div class="card overflow-hidden">
                        <div class="card-body">
                            <div class="met-profile">
                                <div class="row">
                                    <div class="col-lg-6 align-self-center mb-3 mb-lg-0">
                                        <ul class="list-unstyled personal-detail mb-0">
                                            <h5 class="met-user-name">{{ $trSurpriseParticipant->employee->user->name ?? '' }}</h5>
                                           
                                            <li class="text-dark mb-1">Designation: <span
                                                    class="text-primary font-weight-bold">{{ $trSurpriseParticipant->employee->designation->name ?? ''}}</span>
                                            </li>
                                            
                                            <li class="text-dark mb-1">Total Marks: <span
                                                    class="text-primary font-weight-bold">{{ $trSurpriseParticipant->trSurpriseResponses()->totalMarks() }}</span>
                                            </li>
                                            <li class="text-dark mb-1">Result: <span
                                                    class="text-primary font-weight-bold">{{ +$trSurpriseParticipant->obtained }} ({{ +$trSurpriseParticipant->percentage }}%)</span>
                                            </li>
                                        </ul>
                                    </div>
                                    <!--end col-->
                                    <div class="col-lg-4 ml-auto align-self-center">
                                        <ul class="list-unstyled personal-detail text-right mb-0">
                                            <li class="text-dark mb-1">Total Question: <span
                                                    class="text-primary font-weight-bold">{{ $trSurpriseParticipant->trSurpriseResponses()->totalQuestion() }}</span>
                                            </li>
                                            <li class="text-dark mb-1">Total Answered: <span
                                                    class="text-primary font-weight-bold">{{ $trSurpriseParticipant->trSurpriseResponses()->totalAnswered() }}</span>
                                            </li>
                                            <li class="text-dark mb-1">Correct Answer: <span
                                                    class="text-success font-weight-bold">{{ $trSurpriseParticipant->trSurpriseResponses()->correctAnswer() }}</span>
                                            </li>
                                            <li class="text-dark">Theory Answer: <span
                                                    class="text-success font-weight-bold">{{ $trSurpriseParticipant->trSurpriseResponses()->theoryQuestion() }}</span>
                                            </li>
                                            <li class="text-dark mt-2">
                                                <form method="post"
                                                      action="{{ route('admin.training.surprise-test-results.pdf', $trSurpriseParticipant->id) }}">
                                                    @csrf
                                                    <button type="submit" class="btn btn-info">
                                                        <i class="ti-download mr-2"></i>Download Result Sheet
                                                    </button>
                                                </form>
                                            </li>
                                        </ul>
                                    </div>
                                    <!--end col-->
                                </div>
                                <!--end row-->
                            </div>
                            <!--end f_profile-->
                        </div>
                        <!--end card-body-->
                    </div>
                    <!--end card-->
                </div>
                <!--end col-->
            </div>
            <div class="row">
                <div class="col-sm-12">
                    <div class="card">
                        <div class="card-body">
                            <div class="row">
                               
                                <form method="POST"
                                      action="{{ route('admin.training.surprise-test-results.update', $trSurpriseParticipant->id) }}"
                                      class="col-lg-12">
                                    @csrf
                                    @method('PUT')
                                    @forelse($trSurpriseParticipant->trSurpriseResponses as $trSurpriseResponse)
                                        <div class="col-lg-12">
                                            <div class="card user_info_card">
                                                <div class="card-header">
                                                    <div class="d-flex align-items-center">
                                                        <div class="">
                                                            <h5 class="card-title m-0">
                                                                <strong>
                                                                    <span
                                                                        class="text-primary">{{ $loop->iteration }}</span>/{{ $loop->count }}
                                                                </strong>
                                                                {{ $trSurpriseResponse->question }}
                                                                @if($trSurpriseResponse->type == 'Theory')
                                                                    {!! $trSurpriseResponse->is_evaluated ? '<span class="text-success">(Evaluated)</span>' : '<span class="text-danger">(Not Evaluated)</span>' !!}
                                                                @else
                                                                    {!! $trSurpriseResponse->is_correct ? '<span class="text-success">(Correct)</span>' : '<span class="text-danger">(Wrong)</span>' !!}
                                                                @endif
                                                            </h5>
                                                        </div>
                                                        <!--end col-->
                                                    </div>
                                                    <!--end row-->
                                                </div>
                                                <div class="card-body">
                                                    @if($trSurpriseResponse->type == 'Multiselect')
                                                        @if(isset($trSurpriseResponse->options) && count($trSurpriseResponse->options) > 0)
                                                        @foreach($trSurpriseResponse->options as $option)
                                                            <div class="d-flex justify-content-start">
                                                                <input type="checkbox"
                                                                       value="{{ $option }}" class="required"
                                                                       {{ (isset($trSurpriseResponse->user_answer)) ? in_array($option, $trSurpriseResponse->user_answer) ? 'checked' : '' : '' }} disabled>
                                                                <span
                                                                    class="ml-1 {{ in_array($option, $trSurpriseResponse->correct_answer) ? 'text-success' : '' }}">{{ $option }}</span>
                                                            </div>
                                                        @endforeach
                                                        @endif
                                                    @elseif($trSurpriseResponse->type == 'Radio')
                                                    @if(isset($trSurpriseResponse->options) && count($trSurpriseResponse->options) > 0)
                                                        @foreach($trSurpriseResponse->options as $option)
                                                            <div class="d-flex justify-content-start">
                                                                <input type="radio"
                                                                       value="{{ (isset($option)) ? $option : '' }}" class="required"
                                                                       {{ (isset($trSurpriseResponse->user_answer)) ? in_array($option, $trSurpriseResponse->user_answer) ? 'checked' : '' : '' }} disabled>
                                                                <span
                                                                    class="ml-1 {{ in_array($option, $trSurpriseResponse->correct_answer) ? 'text-success' : '' }}">{{ $option }}</span>
                                                            </div>
                                                        @endforeach
                                                        @endif
                                                    @elseif($trSurpriseResponse->type == 'Theory')
                                                        <div class="d-flex justify-content-start">
                                                            <input type="text"
                                                                   class="form-control required"
                                                                   value="{{ (isset($trSurpriseResponse->user_answer)) ? head($trSurpriseResponse->user_answer) : '' }}"
                                                                   placeholder="Enter Answer" disabled>
                                                        </div>
                                                        <div
                                                            class="d-flex justify-content-end align-items-center mt-2">

                                                            <span>Give Mark</span>
                                                            <input
                                                                name="marks[{{ $trSurpriseResponse->id }}]"
                                                                class="form-control ml-2"
                                                                style="width:120px" step="0.01"
                                                                max="1" type="number"
                                                                onKeyUp="if(this.value>1){this.value='1.00';}else if(this.value<0){this.value='0.00';}"
                                                                value="{{ $trSurpriseResponse->marks }}">
                                                        </div>
                                                    @endif
                                                </div>
                                            </div>
                                        </div>
                                    @empty
                                        No answers found
                                    @endforelse
                                    @if($trSurpriseParticipant->trSurpriseResponses()->theoryQuestion() > 0)
                                        <button type="submit" class="btn btn-success ml-2">
                                            <i class="ti-check mr-1"></i> Update Theory Marks
                                        </button>
                                    @endif
                                </form>
                            </div>
                            <!-- end row -->

                        </div><!--end card-body-->
                    </div><!--end card-->
                </div><!--end col-->
            </div><!--end row-->
        </div>
        <!-- footer -->
    @include('admin.sections.footer')
    <!--end footer-->
    </div>
    <!-- end page content -->
@endsection

@push('js')
    <script>
        setTimeout(function () {
            $('#mydiv').fadeOut('fast');
        }, 3000);
    </script>
@endpush