@extends('Admin.Layout.Master')

@push('header_style')
    <link rel="stylesheet" href="{{ url('assets/plugins/bs-stepper/css/bs-stepper.min.css') }}">
    <style type="text/css">
        #selectQuestionModalDatatable {
            font-size: 14px; 
        }
    </style>
@endpush

@push('header_script')
    <script type="text/javascript">
    </script>
@endpush



@section('content-header')
    <section class="content-header">
        <div class="container-fluid">
            <div class="row mb-2">
                <div class="col-sm-6">
                    <h1>Exam</h1>
                </div>
                <div class="col-sm-6">
                </div>
            </div>
        </div>
    </section>
@endsection

@section('content')
    <div class="row">
        <div class="col-md-12">
            <div class="card card-default">
                <div class="card-body p-0">

                    <form id="main-form" 
                        action="{{ !$id ? url($url) : url($url . '/' . $id) }}" 
                        method="post" 
                        enctype="multipart/form-data">
                        @csrf
                        @if ($id)
                            @method('put')
                        @endif

                            <div class="bs-stepper">
                                <div class="bs-stepper-header" role="tablist">
                                    <div class="step" data-target="#exam-details-part">
                                        <button type="button" class="step-trigger" role="tab" 
                                                aria-controls="exam-details-part" 
                                                id="exam-details-part-trigger">
                                            <span class="bs-stepper-circle">1</span>
                                            <span class="bs-stepper-label">Exam Details</span>
                                        </button>
                                    </div>
                                    <div class="line"></div>
                                    <div class="step" data-target="#subject-part">
                                        <button type="button" class="step-trigger" role="tab" 
                                                aria-controls="subject-part" 
                                                id="subject-part-trigger">
                                            <span class="bs-stepper-circle">2</span>
                                            <span class="bs-stepper-label">Subjects</span>
                                        </button>
                                    </div>
                                    <div class="line"></div>
                                    <div class="step" data-target="#grades-part">
                                        <button type="button" class="step-trigger" role="tab" 
                                                aria-controls="grades-part" 
                                                id="grades-part-trigger">
                                            <span class="bs-stepper-circle">3</span>
                                            <span class="bs-stepper-label">Grades</span>
                                        </button>
                                    </div>
                                    <div class="line"></div>
                                    <div class="step" data-target="#additional-setting-part">
                                        <button type="button" class="step-trigger" role="tab" 
                                                aria-controls="additional-setting-part" 
                                                id="additional-setting-part-trigger">
                                            <span class="bs-stepper-circle">4</span>
                                            <span class="bs-stepper-label">Additional Setting</span>
                                        </button>
                                    </div>
                                </div>
                                
                                <div class="bs-stepper-content">
                                    <div id="exam-details-part" class="content" role="tabpanel" aria-labelledby="exam-details-part-trigger">
                                        <div class="card">
                                            <div class="card-header bg-info">    
                                                <h4>Exam Details</h4>
                                            </div>
                                            <div class="card-body">    
                                                <div class="row m-0">
                                                    <div class="col-md-1 text-right">
                                                        <label class="form-control-label"> Exam Name : <span class="text-danger">*</span></label>
                                                    </div>
                                                    <div class="col-md-3 text-left">
                                                        <div class="form-group">
                                                            <input type="text" class="form-control form-control-sm alphaNumeric" 
                                                                    id="exam_name"
                                                                    name="exam_name"
                                                                    value="{{ old('exam_name') ? old('exam_name') : ($exam ? $exam->exam_name : '') }}"
                                                                    required>
                                                            @error('exam_name')
                                                                <small class="text-danger"><b>{{ $message }}</b></small>
                                                            @enderror
                                                        </div>
                                                    </div>

                                                    <div class="col-md-1 text-right">
                                                        <label class="form-control-label"> Course Id : <span class="text-danger">*</span></label>
                                                    </div>
                                                    <div class="col-md-3 text-left">
                                                        <div class="form-group">
                                                            <input type="text" class="form-control form-control-sm alphaNumeric" 
                                                                    id="course_id"
                                                                    name="course_id"
                                                                    value="{{ old('course_id') ? old('course_id') : ($exam ? $exam->course_id : '') }}"
                                                                    required>
                                                            <small class="text-info"><b>Growskillindia Course Uid</b></small>        
                                                            @error('course_id')
                                                                <small class="text-danger"><b>{{ $message }}</b></small>
                                                            @enderror
                                                        </div>
                                                    </div>
                                                    <div class="col-md-3 text-left">
                                                        <div class="form-group">
                                                            <textarea type="text" class="form-control form-control-sm alphaNumeric"
                                                            disabled
                                                            >Enter Course Uid if you want to take exam for Growskillindia Course. Otherwise leave it blank.
                                                            </textarea>
                                                            @error('course_id')
                                                                <small class="text-danger"><b>{{ $message }}</b></small>
                                                            @enderror
                                                        </div>
                                                    </div>
                                                </div>
                                                <div class="row m-0">
                                                    <div class="col-md-1 text-right">
                                                        <label class="form-control-label"> Category : <span class="text-danger">*</span></label>
                                                    </div>
                                                    <div class="col-md-3 text-left">
                                                        <div class="form-group">
                                                            <select class="form-control form-control-sm" 
                                                                    id="category_id"
                                                                    name="category_id"
                                                                    required>
                                                                <option value="">Select Category</option>
                                                                @if(count($categories))
                                                                    @foreach($categories as $s)
                                                                        <option value="{{$s->value}}"
                                                                            @if( 
                                                                                    (old('category_id') && old('category_id')==$s->value)
                                                                                                ||
                                                                                    ($exam && $exam->category_id==$s->value)
                                                                                )
                                                                                selected
                                                                            @endif
                                                                            >{{$s->label}}</option>
                                                                    @endforeach
                                                                @endif  
                                                            </select>
                                                            @error('category_id')
                                                                <small class="text-danger"><b>{{ $message }}</b></small>
                                                            @enderror
                                                        </div>
                                                    </div>
                                                    <div class="col-md-1 text-right">
                                                        <label class="form-control-label"> Department :</label>
                                                    </div>
                                                    <div class="col-md-3 text-left">
                                                        <div class="form-group">
                                                            <select class="form-control form-control-sm" 
                                                                    id="department_id"
                                                                    name="department_id"
                                                                    >
                                                                <option value="">Select Department</option>
                                                                @if(count($departments))
                                                                    @foreach($departments as $s)
                                                                        <option value="{{$s->value}}"
                                                                            @if( 
                                                                                    (old('department_id') && old('department_id')==$s->value)
                                                                                                ||
                                                                                    ($exam && $exam->department_id==$s->value)
                                                                                )
                                                                                selected
                                                                            @endif
                                                                            >{{$s->label}}</option>
                                                                    @endforeach
                                                                @endif  
                                                            </select>
                                                            @error('department_id')
                                                                <small class="text-danger"><b>{{ $message }}</b></small>
                                                            @enderror
                                                        </div>
                                                    </div>
                                                </div> <!---->
                                    
                                                <div class="row m-0">
                                                    <div class="col-md-1 text-right">
                                                        <label class="form-control-label"> Start Date : <span class="text-danger">*</span></label>
                                                    </div>
                                                    <div class="col-md-3 text-left">
                                                        <div class="form-group">
                                                            <input type="date" class="form-control form-control-sm" 
                                                                    id="start_date"
                                                                    name="start_date"
                                                                    value="{{ old('start_date') ? old('start_date') : ($exam ? $exam->start_date : '') }}"
                                                                    required
                                                                    @if(!$exam)
                                                                        min="{{date('Y-m-d')}}"
                                                                        onchange="change_result_date(this.value)"
                                                                    @endif
                                                                    >
                                                            @error('start_date')
                                                                <small class="text-danger"><b>{{ $message }}</b></small>
                                                            @enderror
                                                        </div>
                                                    </div>
                                    
                                                    <div class="col-md-1 text-right">
                                                        <label class="form-control-label"> End Date : <span class="text-danger">*</span></label>
                                                    </div>
                                                    <div class="col-md-3 text-left">
                                                        <div class="form-group">
                                                            <input type="date" class="form-control form-control-sm" 
                                                                    id="end_date"
                                                                    name="end_date"
                                                                    value="{{ old('end_date') ? old('end_date') : ($exam ? $exam->end_date : '') }}"
                                                                    required
                                                                    >
                                                            @error('end_date')
                                                                <small class="text-danger"><b>{{ $message }}</b></small>
                                                            @enderror
                                                        </div>
                                                    </div>
                                    
                                                    <div class="col-md-1 text-right">
                                                        <label class="form-control-label"> Time (in min) : <span class="text-danger">*</span></label>
                                                    </div>
                                                    <div class="col-md-1 text-left">
                                                        <div class="form-group">
                                                            <input type="text" class="form-control form-control-sm" 
                                                                    id="total_time_in_min"
                                                                    name="total_time_in_min"
                                                                    value="{{ old('total_time_in_min') ? old('total_time_in_min') : ($exam ? $exam->total_time_in_min : '') }}"
                                                                    required
                                                                    oninput="convert_time_to_hm(this.value)"
                                                                    >
                                                            @error('total_time_in_min')
                                                                <small class="text-danger"><b>{{ $message }}</b></small>
                                                            @enderror
                                                        </div>
                                                    </div>
                                                    <div class="col-md-2 text-left">
                                                        <div class="form-group">
                                                            <input type="text" class="form-control form-control-sm" 
                                                                    id="total_time_in_hm"
                                                                    name="total_time_in_hm"
                                                                    value="{{ old('total_time_in_hm') ? old('total_time_in_hm') : ($exam ? $exam->total_time_in_hm : '') }}"
                                                                    required
                                                                    readonly
                                                                    >
                                                            @error('total_time_in_hm')
                                                                <small class="text-danger"><b>{{ $message }}</b></small>
                                                            @enderror
                                                        </div>
                                                    </div>
                                                </div> <!---->
                                    
                                                <div class="row m-0">
                                                    <div class="col-md-1 text-right">
                                                        <label class="form-control-label"> Start Time : <span class="text-danger">*</span></label>
                                                    </div>
                                                    <div class="col-md-3 text-left">
                                                        <div class="form-group">
                                                            <input type="time" class="form-control form-control-sm" 
                                                                    id="start_time"
                                                                    name="start_time"
                                                                    value="{{ old('start_time') ? old('start_time') : ($exam ? $exam->start_time : '') }}"
                                                                    required
                                                                    min="{{date('Y-m-d')}}"
                                                                    @if(!$exam)
                                                                        onchange="change_result_date(this.value)"
                                                                    @endif
                                                                    >
                                                            @error('start_time')
                                                                <small class="text-danger"><b>{{ $message }}</b></small>
                                                            @enderror
                                                        </div>
                                                    </div>
                                    
                                                    <div class="col-md-1 text-right">
                                                        <label class="form-control-label"> End Time : <span class="text-danger">*</span></label>
                                                    </div>
                                                    <div class="col-md-3 text-left">
                                                        <div class="form-group">
                                                            <input type="time" class="form-control form-control-sm" 
                                                                    id="end_time"
                                                                    name="end_time"
                                                                    value="{{ old('end_time') ? old('end_time') : ($exam ? $exam->end_time : '') }}"
                                                                    required
                                                                    >
                                                            @error('end_time')
                                                                <small class="text-danger"><b>{{ $message }}</b></small>
                                                            @enderror
                                                        </div>
                                                    </div>
                                    
                                                    <div class="col-md-1 text-right">
                                                        <label class="form-control-label">Timing Type: <span class="text-danger">*</span></label>
                                                    </div>
                                                    <div class="col-md-3 text-left">
                                                        <select class="form-control form-control-sm"
                                                            id="timing_type"
                                                            name="timing_type"
                                                        >
                                                            <option value="">Select Option</option>
                                                            <option value="DAILY_TIMING" @if( ($exam && $exam->timing_type=="DAILY_TIMING") || !$exam) selected @endif>Follow Daily Time</option>
                                                            <option value="EXAM_DATES" @if( ($exam && $exam->timing_type=="EXAM_DATES")) selected @endif>Follow Exam Dates</option>
                                                        </select>
                                                    </div>
                                                </div> <!---->
                                            </div>
                                            <div class="card-footer text-center">
                                                <div class="btn-group">
                                                    <a href="{{ url($url) }}" class="btn btn-danger btn-sm">
                                                        <i class="fa fa-ban" aria-hidden="true"></i>
                                                        Cancel
                                                    </a>
                                                    <button type="button" class="btn btn-primary btn-sm float-right" onclick="stepper.next()">
                                                        Next
                                                        <i class="fas fa-chevron-right"></i>
                                                    </button>
                                                </div>
                                            </div>
                                        </div>
                                    </div>

                                    <div id="subject-part" class="content" role="tabpanel" aria-labelledby="subject-part-trigger">
                                        
                                        <div class="card">
                                            <div class="card-header bg-info">    
                                                <h4>Subject Details</h4>
                                            </div>
                                            <div class="card-body">    
                                                <div class="row m-0 ">
                                                    <div class="col-md-12">
                                                        <table class="table table-bordered table-hover" id="questionTable">
                                                            <thead>
                                                                <tr class="p-1">
                                                                    <th class="text-center p-1">Sr </th>
                                                                    <th class="text-center p-1">Subject</th>
                                                                    <th class="text-center p-1">Questions</th>
                                                                    <th class="text-center p-1">Marks for Correct Answer</th>
                                                                    <th class="text-center p-1">Marks for Wrong Answer</th>
                                                                    <th class="text-center p-1 text-center">
                                                                        <button type="button" class="btn btn-sm btn-success" id="addRow">
                                                                            <i class="fa fa-plus-circle" aria-hidden="true"></i>
                                                                        </button>
                                                                    </th>
                                                                </tr>
                                                            </thead>
                                                            <tbody>
                                                                @if(count($subjectArray))
                                                                    @foreach($subjectArray as $key=>$subject)
                                                                    <tr id="tr_{{$key}}">
                                                                        <td class="p-2 text-center">
                                                                            {{$loop->iteration}}
                                                                        </td>
                                                                        <td class="p-2">
                                                                            <select class="form-control form-control-sm" 
                                                                                    id="subject_id_{{$key}}"
                                                                                    name="subject_id[]"
                                                                                    required>
                                                                                <option value="">Subject</option>
                                                                                @if(count($subjects))
                                                                                    @foreach($subjects as $s)
                                                                                        <option value="{{$s->value}}"
                                                                                            @if($subject->subject_id && $subject->subject_id==$s->value)
                                                                                                selected
                                                                                            @endif
                                                                                        >
                                                                                            {{$s->label}}
                                                                                        </option>
                                                                                    @endforeach
                                                                                @endif  
                                                                            </select>
                                                                        </td>
                                                                        <td class="p-2">
                                                                            <div class="input-group mb-3">
                                                                                <input type="text" class="form-control form-control-sm selected_questions" 
                                                                                        id="selected_question_{{$key}}" 
                                                                                        name="selected_question[]" 
                                                                                        value="{{$subject->total_subject_question}}" 
                                                                                        readonly
                                                                                        style="width:10px"
                                                                                >
                                                                                <button type="button" 
                                                                                        class="btn btn-sm btn-info" 
                                                                                        onclick="getSubjectQuestionModal({{$key}})">
                                                                                        Add Question
                                                                                </button>  
                                                                                <input type="hidden" class="form-control form-control-sm selected_question_id" 
                                                                                        id="selected_question_id_{{$key}}" 
                                                                                        name="selected_question_id[]" 
                                                                                        value="{{$subject->selected_question_id}}" 
                                                                                        readonly
                                                                                    >
                                                                            </div>
                                                                        </td>
                                                                        <td class="p-2">
                                                                            <input type="text" class="form-control form-control-sm positive_marks number" 
                                                                                    id="positive_marks_{{$key}}"
                                                                                    name="positive_marks[]" 
                                                                                    value="{{$subject->total_subject_positive_mark}}"
                                                                                    oninput="calculateTotalMarksAndQuestions();" 
                                                                                    onchange="setDecimal(this);"
                                                                                    >
                                                                        </td>
                                                                        <td class="p-2">
                                                                            <input type="text" class="form-control form-control-sm negative_marks numberspecial" 
                                                                                    id="negative_marks_{{$key}}" 
                                                                                    name="negative_marks[]" 
                                                                                    value="{{$subject->total_subject_negative_mark}}" 
                                                                                    placeholder="Eg. Value with - sign" 
                                                                                    oninput="calculateTotalMarksAndQuestions();" 
                                                                                    onchange="setDecimal(this);">
                                                                        </td>
                                                                        
                                                                        <td class="p-2 text-center" style="min-width:20px">
                                                                            <button type="button" class="btn btn-sm btn-danger" onclick="removeSubject(this)">
                                                                                <i class="fa fa-minus-circle" aria-hidden="true"></i>
                                                                            </button>  
                                                                        </td>
                                                                    </tr>
                                                                    @endforeach
                                                                @else
                                                                    <tr id="tr_0">
                                                                        <td class="p-2">
                                                                            <input type="hidden" id="question_array_1" name="question_array[]" value="0" >1
                                                                        </td>
                                                                        <td class="p-2">
                                                                            <select class="form-control form-control-sm" 
                                                                                    id="subject_id_0"
                                                                                    name="subject_id[]"
                                                                                    required>
                                                                                <option value="">Subject</option>
                                                                                @if(count($subjects))
                                                                                    @foreach($subjects as $s)
                                                                                        <option value="{{$s->value}}">{{$s->label}}</option>
                                                                                    @endforeach
                                                                                @endif  
                                                                            </select>
                                                                        </td>
                                                                        <td class="p-2">
                                                                            <div class="input-group mb-3">
                                                                                <input type="text" class="form-control form-control-sm selected_questions" 
                                                                                        id="selected_question_0" 
                                                                                        name="selected_question[]" 
                                                                                        value="0" 
                                                                                        style="width:10px"
                                                                                >
                                                                                <button type="button" 
                                                                                        class="btn btn-sm btn-info" 
                                                                                        onclick="getSubjectQuestionModal(0)">
                                                                                        Add Question
                                                                                </button>  

                                                                             <input type="hidden" class="form-control form-control-sm selected_question_id" 
                                                                                    id="selected_question_id_0" 
                                                                                    name="selected_question_id[]" 
                                                                                    value="0" 
                                                                                    readonly
                                                                                >
                                                                            </div>
                                                                        </td>
                                                                        <td class="p-2">
                                                                            <input type="text" class="form-control form-control-sm positive_marks number" 
                                                                                    id="positive_marks_0"
                                                                                    name="positive_marks[]" 
                                                                                    value="1.00" 
                                                                                    oninput="calculateTotalMarksAndQuestions();" 
                                                                                    onchange="setDecimal(this);"
                                                                                    >
                                                                        </td>
                                                                        <td class="p-2">
                                                                            <input type="text" class="form-control form-control-sm negative_marks numberspecial" 
                                                                                    id="negative_marks_0" 
                                                                                    name="negative_marks[]" 
                                                                                    value="-1.00" 
                                                                                    placeholder="Eg. Value with - sign" 
                                                                                    oninput="calculateTotalMarksAndQuestions();" 
                                                                                    onchange="setDecimal(this);">
                                                                        </td>
                                                                        <td class="p-2 text-center" style="min-width:20px">
                                                                            <button type="button" class="btn btn-sm btn-danger" onclick="removeSubject(this)">
                                                                                <i class="fa fa-minus-circle" aria-hidden="true"></i>
                                                                            </button>  
                                                                        </td>
                                                                    </tr>
                                                                @endif
                                                            </tbody>
                                                            <tfooter>
                                                                <tr>
                                                                    <td colspan="2">
                                                                        
                                                                    </td>
                                                                    <td>
                                                                        <label class="form-control-label"> Total Question (s) :<span class="text-danger">*</span></label>
                                                                        <input type="text" class="form-control form-control-sm" 
                                                                        id="total_questions"
                                                                        name="total_questions"
                                                                        value="{{ old('total_questions') ? old('total_questions') : ($exam ? $exam->total_questions : '') }}"
                                                                        required
                                                                        readonly
                                                                        >
                                                                        @error('total_questions')
                                                                            <small class="text-danger"><b>{{ $message }}</b></small>
                                                                        @enderror
                                                                    </td>
                                                                    <td>
                                                                        <label class="form-control-label"> Total Mark (s) :<span class="text-danger">*</span></label>
                                                                        <input type="text" class="form-control form-control-sm" 
                                                                                id="total_marks"
                                                                                name="total_marks"
                                                                                value="{{ old('total_marks') ? old('total_marks') : ($exam ? $exam->total_marks : '') }}"
                                                                                required
                                                                                readonly
                                                                                >
                                                                        @error('total_marks')
                                                                            <small class="text-danger"><b>{{ $message }}</b></small>
                                                                        @enderror
                                                                    </td>
                                                                    <td colspan="2">
                                                                    </td>
                                                                </tr>
                                                                <tr>
                                                                    <td colspan="3">
                                                                    </td>
                                                                    <td>
                                                                        <label class="form-control-label"> Passing Marks : <span class="text-danger">*</span></label>
                                                                        <input type="text" class="form-control form-control-sm" 
                                                                                id="total_passing_marks"
                                                                                name="total_passing_marks"
                                                                                value="{{ old('total_passing_marks') ? old('total_passing_marks') : ($exam ? $exam->total_passing_marks : '') }}"
                                                                                required
                                                                                min="{{date('Y-m-d')}}"
                                                                                >
                                                                        @error('total_passing_marks')
                                                                            <small class="text-danger"><b>{{ $message }}</b></small>
                                                                        @enderror
                                                                    </td>
                                                                    <td colspan="2">
                                                                    </td>
                                                                </tr>
                                                            </tfooter>

                                                        </table>
                                                    </div>
                                                </div>     
                                            </div>
                                        </div>
                                        
                                        <div class="card">
                                            <div class="card-body">    
                                                <div class="row">
                                                    <div class="col-md-1 text-left">
                                                        <label class="form-control-label"> Result Date : <span class="text-danger">*</span></label>
                                                    </div>
                                                    <div class="col-md-3 text-left">
                                                        <input type="date" class="form-control form-control-sm" 
                                                                id="result_date"
                                                                name="result_date"
                                                                value="{{ old('result_date') ? old('result_date') : ($exam ? $exam->result_date : '') }}"
                                                                required
                                                                >
                                                        @error('result_date')
                                                            <small class="text-danger"><b>{{ $message }}</b></small>
                                                        @enderror
                                                    </div>
                                    
                                                    <div class="col-md-1 text-right">
                                                        <label class="form-control-label">Total Attempt : <span class="text-danger">*</span></label>
                                                    </div>
                                                    <div class="col-md-3 text-left">
                                                        <div class="form-group">
                                                            <input type="number" class="form-control form-control-sm" 
                                                                    id="total_attempts"
                                                                    name="total_attempts"
                                                                    value="{{ old('total_attempts') ? old('total_attempts') : ($exam ? $exam->total_attempts : '') }}"
                                                                    required
                                                                    min="1"
                                                                    minvalue="1"
                                                                    >
                                                            @error('total_attempts')
                                                                <small class="text-danger"><b>{{ $message }}</b></small>
                                                            @enderror
                                                        </div>
                                                    </div>
                                                </div>
                                            </div>
                                            <div class="card-footer text-center">
                                                <div class="btn-group">
                                                    <button type="button" class="btn btn-primary btn-sm float-right" onclick="stepper.previous()">
                                                        <i class="fas fa-chevron-left"></i>
                                                        Previous
                                                    </button>
                                                    <a href="{{ url($url) }}" class="btn btn-danger btn-sm">
                                                        <i class="fa fa-ban" aria-hidden="true"></i>
                                                        Cancel
                                                    </a>
                                                    <button type="button" class="btn btn-primary btn-sm float-right" onclick="stepper.next()">
                                                        Next
                                                        <i class="fas fa-chevron-right"></i>
                                                    </button>
                                                </div>
                                            </div>
                                        </div>
                                        
                                    </div>

                                    <div id="grades-part" class="content" role="tabpanel" aria-labelledby="grades-part-trigger">
                                        <div class="card">
                                            <div class="card-header bg-info">
                                                <h4>Add Grades</h4>
                                            </div>
                                            <div class="card-body">
                                                <table class="table table-bordered table-hover" id="slabTable">
                                                    <thead class="">
                                                        <tr>
                                                            <th>Sr</th>
                                                            <th>Grade</th>
                                                            <th>Min Score</th>
                                                            <th>Max Score</th>
                                                            <th class="p-1 text-center">
                                                                <button type="button" class="btn btn-sm btn-success" onclick="addSlabRow()">
                                                                    <i class="fa fa-plus-circle" aria-hidden="true"></i>
                                                                </button>
                                                            </th>
                                                        </tr>
                                                    </thead>
                                                    <tbody>
                                                        @if(count($examGradeArray))
                                                            @foreach($examGradeArray as $e)
                                                                <tr id="slab_tr_{{$loop->iteration}}">
                                                                    <td>{{$loop->iteration}}</td>
                                                                    <td><input type="text" class="form-control form-control-sm" id="grade_name_{{$loop->iteration}}" name="grade_name[]" value="{{$e->grade_name}}"></td>
                                                                    <td><input type="text" class="form-control form-control-sm" id="min_score_{{$loop->iteration}}" name="min_score[]" value="{{$e->min_score}}"></td>
                                                                    <td><input type="text" class="form-control form-control-sm" id="max_score_{{$loop->iteration}}" name="max_score[]" value="{{$e->max_score}}"></td>
                                                                    <td class="p-2 text-center" style="min-width:20px">
                                                                        <button type="button" class="btn btn-sm btn-danger" onclick="removeSlabRow(this)">
                                                                            <i class="fa fa-minus-circle" aria-hidden="true"></i>
                                                                        </button>
                                                                    </td>
                                                                </tr>
                                                            @endforeach   
                                                        @else
                                                            <tr id="slab_tr_1">
                                                                <td>1</td>
                                                                <td><input type="text" class="form-control form-control-sm" id="grade_name_1" name="grade_name[]"></td>
                                                                <td><input type="text" class="form-control form-control-sm" id="min_score_1" name="min_score[]"></td>
                                                                <td><input type="text" class="form-control form-control-sm" id="max_score_1" name="max_score[]"></td>
                                                                <td class="p-2 text-center" style="min-width:20px">
                                                                    <button type="button" class="btn btn-sm btn-danger" onclick="removeSlabRow(this)">
                                                                        <i class="fa fa-minus-circle" aria-hidden="true"></i>
                                                                    </button>
                                                                </td>
                                                            </tr>
                                                        @endif
                                                    </tbody>
                                                </table>
                                            </div>
                                            <div class="card-footer text-center">
                                                <div class="btn-group">
                                                    <button type="button" class="btn btn-primary btn-sm float-right" onclick="stepper.previous()">
                                                        <i class="fas fa-chevron-left"></i>
                                                        Previous
                                                    </button>
                                                    <a href="{{ url($url) }}" class="btn btn-danger btn-sm">
                                                        <i class="fa fa-ban" aria-hidden="true"></i>
                                                        Cancel
                                                    </a>
                                                    <button type="button" class="btn btn-primary btn-sm float-right" onclick="stepper.next()">
                                                        Next
                                                        <i class="fas fa-chevron-right"></i>
                                                    </button>
                                                </div>
                                            </div>
                                        </div>
                                    </div>

                                    <div id="additional-setting-part" class="content" role="tabpanel" aria-labelledby="additional-setting-part-trigger">
                                        <div class="card">
                                            <div class="card-header bg-info">    
                                                <h4>Additional Setting Details</h4>
                                            </div>
                                            <div class="card-body">    

                                                <div class="row">
                                                    <div class="col-md-3 text-left">
                                                        <label class="form-control-label">Candidate must complete exam : <span class="text-danger">*</span></label>
                                                    </div>
                                                    <div class="col-md-9 text-left">
                                                        <div class="form-group">
                                                            <input type="radio" 
                                                                    id="completion_required_1" 
                                                                    name="completion_required" 
                                                                    value="1"
                                                                    @if($exam && $exam->completion_required==1)
                                                                        checked
                                                                    @endif
                                                                    > Yes
                                                            <input type="radio" 
                                                                    id="completion_required_1" 
                                                                    name="completion_required" 
                                                                    value="0"
                                                                    @if(!$exam || $exam && $exam->completion_required==0)
                                                                        checked
                                                                    @endif
                                                                    > No
                                                        </div>
                                                    </div>
                                                </div>

                                                <div class="row">
                                                    <div class="col-md-3 text-left">
                                                        <label class="form-control-label">Attedance required for appearing in exam: <span class="text-danger">*</span></label>
                                                    </div>
                                                    <div class="col-md-9 text-left">
                                                        <div class="form-group">
                                                            <input type="radio" 
                                                                    id="attendance_required_1" 
                                                                    name="attendance_required" 
                                                                    value="1"
                                                                    @if($exam && $exam->attendance_required==1)
                                                                        checked
                                                                    @endif
                                                                    > Yes
                                                            <input type="radio" 
                                                                    id="attendance_required_1" 
                                                                    name="attendance_required" 
                                                                    value="0"
                                                                    @if(!$exam || $exam && $exam->attendance_required==0)
                                                                        checked
                                                                    @endif
                                                                    > No
                                                        </div>
                                                    </div>
                                                </div>
                                            </div>
                                            <div class="card-footer text-center">
                                                <div class="btn-group">
                                                    <button type="button" class="btn btn-primary btn-sm float-right" onclick="stepper.previous()">
                                                        <i class="fas fa-chevron-left"></i>
                                                        Previous
                                                    </button>
                                                    <a href="{{ url($url) }}" class="btn btn-danger btn-sm">
                                                        <i class="fa fa-ban" aria-hidden="true"></i>
                                                        Cancel
                                                    </a>
                                                    @if (!$id)
                                                    <button type="submit" class="btn btn-primary btn-sm" name="button_type" value="SAVE">
                                                        <i class="fas fa-save"></i>
                                                        Save
                                                    </button>
                                                    @endif
                
                                                    @if ($id)
                                                        <button type="submit" class="btn btn-primary btn-sm" name="button_type" value="UPDATE">
                                                            <i class="fas fa-save"></i>
                                                            Update
                                                        </button>
                                                    @endif
                                                </div>
                                            </div>
                                        </div>

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

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

    <div class="modal" id="selectQuestionModal" tabindex="-1" role="dialog" aria-labelledby="selectQuestionLabel" aria-hidden="true">
        <div class="modal-dialog modal-xl" role="document">
            <div class="modal-content modal-align-centered">
                <div class="modal-header">
                    <h5 class="modal-title" id="selectQuestionLabel">Subject : <span id="selected_subject"></span></h5>
                    <button type="button" class="btn btn-outline-danger btn-sm" data-dismiss="modal"
                        aria-label="Close">
                        &times;
                    </button>
                </div>
                <div class="modal-body mt--3" id="selectQuestionModalBody">
                    <div class="table-responsive">
                        <input type="hidden" id="selected_row_no" value="">
                        <table class="table table-bordered table-striped table-hover mt-2" id="selectQuestionModalDatatable">
                            <thead>
                                <tr class="p-1">
                                    <th class="p-1"></th>
                                    <th class="p-1">Apprears</th>
                                    <th class="p-1">Question</th>
                                    <th class="p-1">Answer</th>
                                    <th class="p-1">Option A</th>
                                    <th class="p-1">Option B</th>
                                    <th class="p-1">Option C</th>
                                    <th class="p-1">Option D</th>
                                </tr>
                            </thead>
                            <tbody id="subject_body">
                            </tbody>
                        </table>
                    </div>
                </div>
            </div>
        </div>
    </div>


@endsection

@push('footer_scripts_after_initialization')
<script src="{{ url('assets/plugins/bs-stepper/js/bs-stepper.min.js') }}"></script>
<script>    


    document.addEventListener('DOMContentLoaded', function () {
        window.stepper = new Stepper(document.querySelector('.bs-stepper'))
    })

    let slabRowCount = $('#slabTable tbody tr').length;
    function addSlabRow() {
        slabRowCount++;
        let newRow = `
            <tr id="slab_tr_${slabRowCount}">
                <td>${slabRowCount}</td>
                <td><input type="text" class="form-control form-control-sm" id="grade_name_${slabRowCount}" name="grade_name[]" value=""></td>
                <td><input type="text" class="form-control form-control-sm" id="min_score_${slabRowCount}" name="min_score[]" value=""></td>
                <td><input type="text" class="form-control form-control-sm" id="max_score_${slabRowCount}" name="max_score[]" value=""></td>
                <td class="p-2 text-center" style="min-width:20px">
                    <button type="button" class="btn btn-sm btn-danger" onclick="removeSlabRow(this)">
                        <i class="fa fa-minus-circle" aria-hidden="true"></i>
                    </button>
                </td>
            </tr>
        `;
        $('#slabTable tbody').append(newRow);
    }

    function removeSlabRow(button) {
        $(button).closest('tr').remove();
        updateRowNumbers();
    }

    function updateRowNumbers() {
        $('#slabTable tbody tr').each(function(index, tr) {
            $(tr).find('td:first').text(index + 1);
            $(tr).attr('id', `slab_tr_${index + 1}`);
            $(tr).find('input[id^="grade_"]').attr('id', `grade_${index + 1}`);
            $(tr).find('input[id^="min_score_"]').attr('id', `min_score_${index + 1}`);
            $(tr).find('input[id^="max_score_"]').attr('id', `max_score_${index + 1}`);
        });
        slabRowCount = $('#slabTable tbody tr').length;
    }


    function change_result_date(date){
        $('#result_date').val(date);
        $('#end_date').attr('min',date);
    }

    function calculateTotalMarksAndQuestions() {       
        var selectedQuestions = document.getElementsByClassName('selected_questions');
        var positiveMarks = document.getElementsByClassName('positive_marks');
        var totalMarks = 0;
        var totalQuestions = 0;

        for (var i = 0; i < selectedQuestions.length; i++) {
            var selectedValue = parseFloat(selectedQuestions[i].value) || 0;
            var positiveMarkValue = parseFloat(positiveMarks[i].value) || 0;

            totalMarks += selectedValue * positiveMarkValue;
            totalQuestions += selectedValue;
        }

        document.getElementById('total_marks').value = totalMarks.toFixed(2);
        document.getElementById('total_questions').value = totalQuestions;
    }


    document.getElementById('addRow').addEventListener('click', function() {
        var tableBody = document.getElementById('questionTable').getElementsByTagName('tbody')[0];
        
        var lastRow = tableBody.querySelector('tr:last-child');
        var lastId = parseInt(lastRow.id.split('_')[1]);

        var previousSelectedSubject=$('#subject_id_'+lastId).val();
        if(!previousSelectedSubject || previousSelectedSubject==""){
            alert("Select Subject For Current Row");
            return "";
        }

        var newId = lastId + 1;
        var newRow = lastRow.cloneNode(true);
        newRow.id = 'tr_' + newId;
        newRow.querySelectorAll('input, select').forEach(function(element) {
            var oldId = element.id;
            var newName = element.name.replace(/\[\d+\]/, '[' + newId + ']');
            var newIdStr = oldId.replace(/_\d+/, '_' + newId);
            
            element.id = newIdStr;
            element.name = newName;

            if (element.tagName === 'INPUT') {
                if (element.type === 'hidden') {
                    element.value = '0';
                } else if (element.classList.contains('selected_questions') || element.classList.contains('selected_question_id')) {
                    element.value = '0'; 
                } else if (element.classList.contains('positive_marks')) {
                    element.value = '1.00'; 
                } else if (element.classList.contains('negative_marks')) {
                    element.value = '-1.00';
                }
            }
            
            if (element.tagName === 'SELECT') {
                element.value = '';
            }
        });
        newRow.cells[0].innerHTML = '<input type="hidden" id="question_array_' + newId + '" name="question_array[]" value="0">' + (newId + 1);
        var addButton = newRow.querySelector('button');
        addButton.setAttribute('onclick', 'getSubjectQuestionModal(' + newId + ')');
        
        tableBody.appendChild(newRow);
    });

    function removeSubject(button) {
        if (button && button.nodeType === 1) {
            var row = button.closest('tr');
            if (row) {
                row.remove();
                updateRowNumbers();
            } else {
                console.error('Row not found for button:', button);
            }
        } else {
            console.error('Button is not a valid HTML element:', button);
        }
    }

    function updateRowNumbers() {
        document.querySelectorAll('#questionTable tbody tr').forEach(function(row, index) {
            row.id = 'tr_' + index;
            row.cells[0].innerHTML = '<input type="hidden" id="question_array_' + index + '" name="question_array[]" value="0">' + (index + 1);
            row.querySelectorAll('input, select').forEach(function(element) {
                var newIdStr = element.id.replace(/_\d+/, '_' + index);
                var newName = element.name.replace(/\[\d+\]/, '[' + index + ']');
                element.id = newIdStr;
                element.name = newName;
            });
            var addButton = row.querySelector('button');
            if (addButton) {
                addButton.setAttribute('onclick', 'getSubjectQuestionModal(' + index + ')');
            }
        });
    }

    function getSubjectQuestionModal(row_no){
        let subject_id = $('#subject_id_' + row_no).val();
        let subject_label = $('#subject_id_' + row_no + ' option:selected').text();
        var selected_question_id = $('#selected_question_id_' + row_no).val();
        var required_question = $('#selected_question_' + row_no).val();
        
        if(!subject_id){
            alert("Select Subject !!!");
            return null;
        }

        if(required_question==0 || required_question==""){
            alert("Enter required questions");
            return null;
        }

        var json_data = {   
                        'subject_id': subject_id.toString(),
                        'selected_question_id':selected_question_id
                        };

        $.ajax({
            headers: {
                'X-CSRF-TOKEN': $('meta[name="csrf-token"]').attr('content'),
                'Content-Type': 'application/json',
            },
            type: "POST",
            url: "{{ url('supportive/getQuestions') }}",
            data: JSON.stringify(json_data),
            success: function(response) {
                $('#selected_subject').empty();
                $('#subject_body').empty();
                $('#selected_subject').html(subject_label);
                if ($.fn.DataTable.isDataTable('#selectQuestionModalDatatable')) {
                        $('#selectQuestionModalDatatable').DataTable().clear().destroy();
                }
                if (response['status'] === 1) {
                    let rows = '';
                    var selected_questions = $('#selected_question_id_' + row_no).val().split(',').map(function(uid) {
                        return uid.trim();
                    });
                    let loop=1;
                    response['data'].forEach(function(question, index) {
                        var uid = String(question.uid).trim();
                        var isChecked = selected_questions.includes(uid) ? 'checked' : '';
                        rows += `<tr>
                                    <td class="p-1">
                                        <input type="checkbox" class="row-select" data-id="${uid}" ${isChecked}>
                                    </td>
                                    <td class="p-1">${question.repeat_count}</td>
                                    <td class="p-1">${loop}) ${question.question}</td>
                                    <td class="p-1">${question.answer}</td>
                                    <td class="p-1">${question.option_a}</td>
                                    <td class="p-1">${question.option_b}</td>
                                    <td class="p-1">${question.option_c}</td>
                                    <td class="p-1">${question.option_d}</td>
                                </tr>`;
                        loop++;
                    });
                    
                    $('#selected_row_no').val(row_no);
                    $('#subject_body').html(rows);

                    var table = $('#selectQuestionModalDatatable').DataTable({
                        paging: true,
                        searching: true,
                        ordering: true,
                        autoWidth: false,
                        responsive: true,
                        columnDefs: [
                            { orderable: false, targets: 0 }, 
                            { orderable: false, targets: 1} 
                        ],
                        dom: '<"row"<"col-md-3"l><"col-md-3 text-center custom-div"><"col-md-6"f>>t<"row"<"col-md-6"i><"col-md-6"p>>', // Adjust layout
                        initComplete: function () {
                            $("div.custom-div").html(`
                                <div class="selected-container text-center">
                                    Selected : <span id="selected_questions">0</span>
                                </div>
                            `);
                        }
                    });
                    $('#selected_questions').html(selected_questions.length);
                    $('#selectQuestionModal').modal('show');
                }else {
                    alert(['response.message']);
                }
            },
            error: function(jqXHR, textStatus, errorThrown) {
                console.error('Error:', textStatus, errorThrown);
            }
        });
    }

    $(document).on('change', '.row-select', function() {
        var table = $('#selectQuestionModalDatatable').DataTable();
        var selected_ids = [];

        var row_no = $('#selected_row_no').val();
        var allowed = parseInt($('#selected_question_' + row_no).val());

        table.rows({ 'search': 'applied' }).nodes().to$().each(function() {
            var checkbox = $(this).find('input.row-select');
            if (checkbox.is(':checked')) {
                var id = checkbox.data('id');
                selected_ids.push(id);
            }
        });

        if (selected_ids.length <= allowed) {
            $('#selected_questions').html(selected_ids.length);
            // $('#selected_question_' + row_no).val(selected_ids.length);
            $('#selected_question_id_' + row_no).val(selected_ids.join(','));
            calculateTotalMarksAndQuestions();
        } else {
            $(this).prop('checked', false);
            alert("You can't select more than " + allowed + " questions.");
        }
    });


    function convert_time_to_hm(val){
        var i=j=0;
        if(val >= 60){
            j=parseInt(val/60);
            i=val%60;
        }else {
            j=0;
            i=val;
        }
        var con=j+" Hr "+i+" Min";
        document.getElementById('total_time_in_hm').value=con;
    }
    
    function setDecimal(input) {
        input.value = parseFloat(input.value).toFixed(2);
    }
</script>
@endpush