@extends('backend.layouts.master')
@section('content')
  <div class="content-wrapper">
    <section class="content-header">
      <div class="container-fluid">
        <div class="row mb-2">
          <div class="col-sm-6"></div>
          <div class="col-sm-6">
            <ol class="breadcrumb float-sm-right">
              <li class="breadcrumb-item"><a href="{{ route('admin.home') }}">Home</a></li>
              <li class="breadcrumb-item active">Edit Research Report</li>
            </ol>
          </div>
        </div>
      </div>
    </section>
    <section class="content">
        <div class="container-fluid">
            <div class="row">
                <div class="col-md-12">
                    <div class="card card-primary">
                        <div class="card-header">
                            <h3 class="card-title">Edit Research Report</h3>
                        </div>
                        <form class="edit-report-form" method="POST" enctype="multipart/form-data">
                            @csrf
                            <div class="card-body">
                                @include('backend.common-views.messages')
                                <div class="row">
                                    <div class="col-6">
                                        <div class="form-group">
                                            <div class="custom-control custom-checkbox">
                                                <input type="hidden" name="is_email_updates_included" value="{{ $researchData->include_email_updates }}" id="is_email_updates_included">
                                                <input class="custom-control-input" type="checkbox" id="email_update" value="{{ $researchData->include_email_updates }}" name="include_email_updates" @if($researchData->include_email_updates == 1) checked @endif>
                                                <label for="email_update" class="custom-control-label">Include in Email Updates</label>
                                            </div>
                                        </div>
                                    </div>
                                    <div class="col-6 d-flex justify-content-end">
                                        <a href="#viewResearchReport" class="btn btn-outline-info mr-2 btn-flat"><i class="fas fa-eye"></i> View Report</a>
                                        <a href="javascript:void(0);" class="btn btn-success addResearchReport btn-flat" data-toggle="modal" data-target="#add-research-report-modal" title="Add Quarter Report"><i class="fa fa-plus"></i> Add Report</a>
                                    </div>
                                </div>

                                <div class="row">
                                    <div class="col-12">
                                        <div class="form-group">
                                            <label>Recommendation Categories</label>
                                            <div class="d-flex flex-wrap">
                                                @foreach ($category_list as $category)
                                                    <div class="custom-control custom-checkbox mr-3 mb-2">
                                                        <input class="custom-control-input" type="checkbox" id="customCheckbox{{$category->id}}" value="{{$category->id}}" name="share_recommendation[]" @if(in_array($category->id,$share_recommendation)) checked @endif>
                                                        <label for="customCheckbox{{$category->id}}" class="custom-control-label font-weight-normal">{{$category->category_name}}</label>
                                                    </div>
                                                @endforeach
                                            </div>
                                            <span class="error share_recommendation_error"></span>
                                        </div>
                                    </div>
                                </div>

                                <div class="row">
                                    <div class="col-4">
                                        <div class="form-group">
                                            <label for="name">Company Name</label>
                                            <input type="text" name="company_name" class="form-control" id="company_name" placeholder="Enter Company Name"  value="{{ !empty(old('company_name')) ? old('company_name') : $researchData->company_name }}">
                                            <span class="error company_name_error"></span>
                                        </div>
                                    </div>
                                    <div class="col-4">
                                        <div class="form-group">
                                            <label for="name">Company Slug</label>
                                            <input type="text" name="company_slug" class="form-control" id="company_slug" placeholder="Enter Company Slug"  value="{{ !empty(old('company_slug')) ? old('company_slug') : $researchData->company_slug }}">
                                            <span class="error company_slug_error"></span>
                                        </div>
                                    </div>
                                    <div class="col-4">
                                        <div class="form-group">
                                            <label>Company Logo</label>
                                            <input type="file" class="form-control" id="shareLogo" name="share_logo" accept="image/*">
                                            <span class="error share_logo_error"></span>
                                        </div>
                                        <div class="form-group">
                                            <img src="{{asset('images/research-reports/share-logo/'.$researchData->share_logo)}}" width="150px" alt="Share Logo">
                                        </div>
                                    </div>
                                </div>

                                <div class="row">
                                    <div class="col-4">
                                        <div class="form-group">
                                            <label>Report Initiating Buy Date:</label>
                                            <input type="date" class="form-control datetimepicker-input" name="share_initial_date" max="9999-12-31" value="{{ !empty(old('share_initial_date')) ? old('share_initial_date') : $researchData->share_initial_date }}">
                                            <span class="error share_initial_date_error"></span>
                                        </div>
                                    </div>
                                    <div class="col-4">
                                        <div class="form-group">
                                            <label>Report Exit Date:</label>
                                            <input type="date" class="form-control datetimepicker-input" name="share_exit_date" max="9999-12-31" value="{{ !empty(old('share_exit_date')) ? old('share_exit_date') : $researchData->share_exit_date }}">
                                            <span class="error share_exit_date_error"></span>
                                        </div>
                                    </div>
                                    <div class="col-4">
                                        <div class="form-group">
                                            <label for="name">Allocation</label>
                                            <input type="text" name="allocation" class="form-control" id="allocation" placeholder="Enter allocation" value="{{ !empty(old('allocation')) ? old('allocation') : $researchData->allocation }}">
                                            <span class="error allocation_error"></span>
                                        </div>
                                    </div>
                                </div>
                                <div class="row">
                                    <div class="col-4">
                                        <div class="form-group">
                                            <label for="name">Price as on Recommended</label>
                                            <input type="number" name="price_recommended" class="form-control" id="price_recommended" placeholder="Enter Price as on Recommended" value="{{ !empty(old('price_recommended')) ? old('price_recommended') : $researchData->price_recommended }}">
                                            <span class="error price_recommended_error"></span>
                                        </div>
                                    </div>
                                    <div class="col-4">
                                        <div class="form-group">
                                            <label for="name">Exit Price</label>
                                            <input type="number" name="exit_price" class="form-control" id="exit_price" placeholder="Exit Price" value="{{ !empty(old('exit_price')) ? old('exit_price') : $researchData->exit_price }}" >
                                            <span class="error exit_price_error"></span>
                                        </div>
                                    </div>
                                    <div class="col-4">
                                        <div class="form-group">
                                            <label for="name">Scrip code</label>
                                            <input type="text" name="scrip_code" class="form-control" id="scrip_code" placeholder="Scrip Code" value="{{ !empty(old('scrip_code')) ? old('scrip_code') : $researchData->scrip_code }}">
                                            <span class="error scrip_code_error"></span>
                                        </div>
                                    </div>
                                </div>

                                <div class="row">
                                    <div class="col-6">
                                        <div class="form-group">
                                            <label for="recommendation">Recommendation</label>
                                            <textarea type="text" name="recommendation" class="form-control" rows="5" cols="20" placeholder="recommendation" >{{ !empty(old('recommendation')) ? old('recommendation') : $researchData->recommendation }}</textarea>
                                        </div>
                                    </div>
                                </div>

                                <input type="hidden" name="share_status" value="" id="share_status">
                            </div>
                            <div class="card-footer">
                                <button type="button" class="btn btn-primary report-submit btn-flat mr-2" name="submit"><i class="fas fa-save"></i> Submit</button>
                                <button type="button" class="btn btn-outline-info report-draft btn-flat mr-2" name="draft"><i class="fas fa-file-signature"></i> Save as a Draft</button>
                                <button type="button" class="btn btn-outline-danger btn-flat" onclick="window.history.back();"><i class="fas fa-times"></i> Cancel</button>
                            </div>
                        </form>

                        <div class="m-3" id="viewResearchReport">
                            <div class="row">
                                <div class="col-12">
                                    <div class="card">
                                        <div class="card-header reports">
                                            <h5 class="mb-0">Reports History</h5>
                                        </div>
                                        <div class="card-body p-2">
                                            @if(empty($research_child_reports))
                                                <p class="text-center">No Record Found</p>
                                            @else
                                                <div id="accordion">
                                                    @foreach($research_child_reports as $groupTitle => $records)
                                                        @if($records[0]['is_quarter_report'])
                                                            <div class="card mb-0">
                                                                <div class="card-header cursor-pointer row d-flex align-items-center" id="heading{{ $loop->index }}" data-toggle="collapse" data-target="#collapse{{ $loop->index }}" aria-expanded="true" aria-controls="collapse{{ $loop->index }}">
                                                                    <h6 class="mb-0 col-10">
                                                                        <b>Financial Year {{ $records[0]['research_child_title'] }}</b>
                                                                    </h6>
                                                                    <div class="col-2">
                                                                        <a href="{{route('admin.moveup.research-report',$records[0]['quarter_id'])}}" class="btn btn-info btn-sm"><i class="fa fa-solid fa-arrow-up"></i></a>
                                                                        <a href="{{route('admin.movedown.research-report',$records[0]['quarter_id'])}}" class="btn btn-info btn-sm"><i class="fa fa-solid fa-arrow-down"></i></a>
                                                                        <a href="javascript:void(0);" class="btn btn-info editResearchReport btn-sm float-right" title="Edit" data-id="{{$records[0]['research_sub_child_reports']}}" data-quarter="{{$records[0]['is_quarter_report']}}" data-title="{{$records[0]['research_child_title']}}"><i class="fas fa-edit"></i></a>
                                                                    </div>
                                                                </div>
                                                                <div id="collapse{{ $loop->index }}" class="collapse show" aria-labelledby="heading{{ $loop->index }}" data-parent="#accordion">
                                                                    <div class="card-body p-2">
                                                                        @if($records[0]['is_quarter_report'])
                                                                            <table class="table table-striped">
                                                                                <thead>
                                                                                    <tr>
                                                                                        <th>Report Title</th>
                                                                                        <th>Q1</th>
                                                                                        <th>Q2</th>
                                                                                        <th>Q3</th>
                                                                                        <th>Q4</th>
                                                                                    </tr>
                                                                                </thead>
                                                                                <tbody>
                                                                                    @foreach($records as $record)
                                                                                        <tr>
                                                                                            <td>{{ $record['research_sub_title'] }}</td>
                                                                                            <td>
                                                                                                @if($record['quarter1'])
                                                                                                    <a href="{{ asset('pdf/research-reports/'.$record['research_sub_child_reports'].'/'.$record['quarter1']) }}" target="_blank" title="{{$record['quarter1']}}">
                                                                                                       <i class="fa fa-file-pdf pdf-icon"></i>
                                                                                                    </a>
                                                                                                @endif
                                                                                            </td>
                                                                                            <td>
                                                                                                @if($record['quarter2'])
                                                                                                    <a href="{{ asset('pdf/research-reports/'.$record['research_sub_child_reports'].'/'.$record['quarter2']) }}" target="_blank" title="{{$record['quarter2']}}">
                                                                                                       <i class="fa fa-file-pdf pdf-icon"></i>
                                                                                                    </a>
                                                                                                @endif
                                                                                            </td>
                                                                                            <td>
                                                                                                @if($record['quarter3'])
                                                                                                    <a href="{{ asset('pdf/research-reports/'.$record['research_sub_child_reports'].'/'.$record['quarter3']) }}" target="_blank" title="{{$record['quarter3']}}">
                                                                                                       <i class="fa fa-file-pdf pdf-icon"></i>
                                                                                                    </a>
                                                                                                @endif
                                                                                            </td>
                                                                                            <td>
                                                                                                @if($record['quarter4'])
                                                                                                    <a href="{{ asset('pdf/research-reports/'.$record['research_sub_child_reports'].'/'.$record['quarter4']) }}" target="_blank" title="{{$record['quarter4']}}">
                                                                                                       <i class="fa fa-file-pdf pdf-icon"></i>
                                                                                                    </a>
                                                                                                @endif
                                                                                            </td>
                                                                                        </tr>
                                                                                    @endforeach
                                                                                </tbody>
                                                                            </table>
                                                                        @endif
                                                                    </div>
                                                                </div>
                                                            </div>
                                                        @else
                                                            <div class="card mb-0">
                                                                <div class="card-header cursor-pointer row d-flex align-items-center" id="heading{{ $loop->index }}" data-toggle="collapse" data-target="#collapse{{ $loop->index }}" aria-expanded="true" aria-controls="collapse{{ $loop->index }}">
                                                                    <h6 class="mb-0 col-5">
                                                                        <b>{{ $records[0]['research_child_title'] }}</b>
                                                                    </h6>
                                                                    <div class="col-5">
                                                                    @if($records[0]['report_pdf'])
                                                                        <a href="{{ asset('pdf/research-reports/'.$records[0]['research_sub_child_reports'].'/'.$records[0]['report_pdf']) }}" target="_blank" title="{{$records[0]['report_pdf']}}"><i class="fa fa-file-pdf pdf-icon"></i></a>
                                                                    @endif
                                                                    </div>
                                                                    <div class="col-2">
                                                                        <a href="{{route('admin.moveup.research-report',$records[0]['quarter_id'])}}" class="btn btn-info btn-sm"><i class="fa fa-solid fa-arrow-up"></i></a>
                                                                        <a href="{{route('admin.movedown.research-report',$records[0]['quarter_id'])}}" class="btn btn-info btn-sm"><i class="fa fa-solid fa-arrow-down"></i></a>
                                                                        <a href="javascript:void(0);" class="btn btn-info editResearchReport btn-sm float-right" title="Edit" data-id="{{$records[0]['research_sub_child_reports']}}" data-quarter="{{$records[0]['is_quarter_report']}}" data-title="{{$records[0]['research_child_title']}}"><i class="fas fa-edit"></i></a>
                                                                    </div>
                                                                </div>
                                                            </div>
                                                            @endif
                                                    @endforeach
                                                </div>
                                            @endif
                                        </div>
                                    </div>
                                </div>
                            </div>
                        </div>

                    </div>
                </div>
            </div>
        </div>
    </section>
  </div>
<!--Add Report Modal-->
<div class="modal fade" id="add-research-report-modal" aria-modal="true" role="dialog">
    <div class="modal-dialog modal-dialog-scrollable modal-xl">
    <div class="modal-content">
        <div class="modal-header">
            <h4 class="modal-title" id="report-title">Add Reports</h4>
            <button type="button" class="close" data-dismiss="modal" aria-label="Close">
                <span aria-hidden="true">×</span>
            </button>
        </div>
        <form class="add-child-research-report-form" method="POST" enctype="multipart/form-data">@csrf
            <div class="modal-body report">
                <div class="row">
                    <input type="hidden" name="research_id" value="{{$researchData->id}}" id="research_id">
                    <div class="form-group col-4">
                        <label>Select Report Type</label>
                        <select name="quarter_report" class="form-control select2bs4" required id="quarter-report-select">
                            <option value="">SELECT OPTION</option>
                            <option value="1">Upload Report Quarterly</option>
                            <option value="0">Non Quarterly Report</option>
                        </select>
                        <span class="error quarter_report_error"></span>
                    </div>
                </div>
                <div class="alert alert-danger d-none notvalid-error" role="alert"></div>
                <div id="non-quarter-report-input" class="d-none">
                    <div class="row">
                        <div class="col-4">
                            <label for="name">Title</label>
                        </div>
                        <div class="col-8">
                            <label for="description">Upload PDF</label>
                        </div>
                    </div>
                    <div id="non-quarter-wrapper-append">
                        <div class="row">
                            <div class="col-4">
                                <div class="form-group">
                                    <input type="text" name="non_quarter_research_title[]" class="form-control" id="0" placeholder="Enter Title">
                                    <span class="error non_quarter_research_title_error_0"></span>
                                </div>
                            </div>
                            <div class="col-6">
                                <div class="form-group">
                                    <input type="file" name="report_pdf[]" class="form-control" id="upload_pdf" accept="application/pdf">
                                </div>
                            </div>
                            <div class="col-2">
                                <a  class="btn btn-danger btn-sm non-quarter-delete" title="Delete">
                                    <i class="fa fa-trash"></i>
                                </a>
                            </div>
                        </div>
                    </div>
                    <div class="row mb-2">
                        <div class="col-12">
                            <a href="javascript:void(0);" class="add_button btn btn-success btn-sm non-quarter-add" title="Add"><i class="fa fa-plus"></i></a>
                        </div>
                    </div>
                </div>

                <div id="quarter-report-input" class="d-none">
                    <div class="row">
                        <div class="col-4">
                            <div class="form-group">
                                <label for="name">Select Financial Year</label>
                                <select class="form-control select2bs4 year" name="quarter_research_title" required id="year_select">
                                    <option value="">SELECT YEAR</option>
                                    @foreach ($formattedYearList as $yearList)
                                    <option value="{{$yearList}}">{{$yearList}}</option>
                                    @endforeach
                                </select>
                                <span class="error quarter_research_title_error"></span>
                            </div>
                        </div>
                    </div>

                    <div class="row">
                        <div class="col-3">
                            <label for="name">Title</label>
                        </div>
                        <div class="col-2">
                            <label for="q1">Q1</label>
                        </div>
                        <div class="col-2">
                            <label for="q2">Q2</label>
                        </div>
                        <div class="col-2">
                            <label for="q3">Q3</label>
                        </div>
                        <div class="col-2">
                            <label for="q4">Q4</label>
                        </div>
                    </div>

                    <div id="quarter-wrapper-append">
                        <div class="row">
                            <div class="col-3">
                                <div class="form-group">
                                    <input type="text" name="research_sub_title[]" class="form-control" id="0"  placeholder="Enter Title">
                                    <span class="error research_sub_title_error_0"></span>
                                </div>
                            </div>
                            <div class="col-2">
                                <div class="form-group">
                                    <input type="file" name="quarter1[]" class="form-control" id="quarter1" accept="application/pdf">
                                </div>
                            </div>
                            <div class="col-2">
                                <div class="form-group">
                                    <input type="file" name="quarter2[]" class="form-control" id="quarter2" accept="application/pdf">
                                </div>
                            </div>
                            <div class="col-2">
                                <div class="form-group">
                                    <input type="file" name="quarter3[]" class="form-control" id="quarter3" accept="application/pdf">
                                </div>
                            </div>
                            <div class="col-2">
                                <div class="form-group">
                                    <input type="file" name="quarter4[]" class="form-control" id="quarter4" accept="application/pdf">
                                </div>
                            </div>
                            <div class="col-1">
                                <a  class="btn btn-danger btn-sm quarter-delete" title="Delete">
                                    <i class="fa fa-trash"></i>
                                </a>
                            </div>
                        </div>
                    </div>
                    <div class="row mb-2">
                        <div class="col-12">
                            <a href="javascript:void(0);" class="add_button btn btn-success btn-sm quarter-add" title="Add"><i class="fa fa-plus"></i></a>
                        </div>
                    </div>
                </div>
            </div>
            <div class="modal-footer justify-content-between">
                <button type="button" class="btn btn-primary" id="add-research-report-submit">Submit</button>
                <button type="button" class="btn btn-default" data-dismiss="modal">Close</button>
            </div>
        </form>
    </div>
    </div>
</div>

<div class="modal fade" id="edit-research-report-modal" aria-modal="true" role="dialog">
    <div class="modal-dialog modal-dialog-scrollable modal-xl">
    <div class="modal-content">
        <div class="modal-header">
            <h4 class="modal-title" id="report-title">Edit Reports</h4>
            <button type="button" class="close" data-bs-dismiss="modal" aria-label="Close">
                <span aria-hidden="true">×</span>
            </button>
        </div>
        <form class="edit-child-research-report-form" enctype="multipart/form-data">
            @csrf
            <div class="modal-body report">
                <div class="row">
                    <input type="hidden" name="research_id" value="{{$researchData->id}}" id="research_id">
                    <div class="form-group col-4">
                        <label>Select Report Type</label>
                        <select name="quarter_report" class="form-control select2bs4" required id="edit-quarter-report-select" readonly>
                            <option value="">SELECT OPTION</option>
                            <option value="1">Upload Report Quarterly</option>
                            <option value="0">Non Quarterly Report</option>
                        </select>
                        <span class="error quarter_report_error"></span>
                    </div>
                </div>
                <div class="alert alert-danger d-none notvalid-error" id="child-remove" role="alert"></div>
                <div id="quarter-edit-report-wrapper" class="d-none">
                    <div class="row">
                        <div class="col-4">
                            <div class="form-group">
                                <label for="name">Select Financial Year</label>
                                <select class="form-control select2bs4 year" name="quarter_research_title" required id="q_research_title" readonly>
                                    <option value="">SELECT YEAR</option>
                                    @foreach ($formattedYearList as $yearList)
                                    <option value="{{$yearList}}">{{$yearList}}</option>
                                    @endforeach
                                </select>
                                <span class="error quarter_research_title_error"></span>
                            </div>
                        </div>
                    </div>
                    <div class="row">
                        <div class="col-3">
                            <label for="name">Title</label>
                        </div>
                        <div class="col-2">
                            <label for="q1">Q1</label>
                        </div>
                        <div class="col-2">
                            <label for="q2">Q2</label>
                        </div>
                        <div class="col-2">
                            <label for="q3">Q3</label>
                        </div>
                        <div class="col-2">
                            <label for="q4">Q4</label>
                        </div>
                    </div>
                </div>
                <div id="non-quarter-edit-report-wrapper" class="d-none">
                    <div class="row">
                        <div class="col-4">
                            <label for="name">Title</label>
                        </div>
                        <div class="col-8">
                            <label for="description">Upload PDF</label>
                        </div>
                    </div>
                </div>
                <div class="d-none">
                    <div id="non-quarter-edit-report-input">
                        <!-- Non-quarter report inputs will be appended here -->
                    </div>
                    <div class="row mb-2">
                        <div class="col-12">
                            <a href="javascript:void(0);" class="add_button btn btn-success btn-sm edit-non-quarter-add" title="Add"><i class="fa fa-plus"></i></a>
                        </div>
                    </div>
                </div>
                <div class="d-none">
                    <div id="quarter-edit-report-input">
                        <!-- Quarter report inputs will be appended here -->
                    </div>
                    <div class="row mb-2">
                        <div class="col-12">
                            <a href="javascript:void(0);" class="add_button btn btn-success btn-sm edit-quarter-add" title="Add"><i class="fa fa-plus"></i></a>
                        </div>
                    </div>
                </div>
            </div>
            <div class="modal-footer justify-content-between">
                <button type="button" class="btn btn-primary" id="edit-research-report-submit">Submit</button>
                <button type="button" class="btn btn-default" data-bs-dismiss="modal">Close</button>
            </div>
        </form>
    </div>
    </div>
</div>


@endsection
@push('js')
<script>
    var quarter = 1;
    var non_quarter = 1;
    var edit_quarter = 0;
    var edit_non_quarter = 0;
    var research_id = $("#research_id").val();
    // var include_email_updates = $("#is_email_updates_included").val(); // Unused
    $(document).ready(function() {

        $('.report-submit').click(function(){
            $('#share_status').val(1);
            submitResearchReportForm();
        });

        $('.report-draft').click(function() {
            $('#share_status').val(0);
            submitResearchReportForm();
        });

        function submitResearchReportForm() {
            $('.error').empty();
            $('.loading-block').show();
            var Data = new FormData( $( '.edit-report-form' )[ 0 ] );
            Data.append('id', research_id);
            Data.set('include_email_updates', document.getElementById('email_update').checked ? 1 : 0);
            $.ajax({
                method : "POST",
                headers:{ 'X-CSRF-TOKEN': '{{ csrf_token() }}'},
                url : "{{url('admin/update/research-report')}}",
                data: Data,
                processData: false,
                contentType: false,
                success:function(data){
                    $('.loading-block').hide();
                    if(data.success == 1){
                        window.location.reload();
                    }else if(data.success == 0){
                        Object.keys(data.message).forEach(function(key) {
                            var errorSelector = '.' + key + '_error';
                            if (data.message[key].length && $(errorSelector).length) {
                                $(errorSelector).html(data.message[key][0]);
                            }
                        });
                    }
                }

            });
        }

        if (window.location.href.includes('/edit#redirectUrl')) {
            $('#add-research-report-modal').modal('show');
        }

        $('#quarter-report-select, #edit-quarter-report-select').change(function() {
            $('.error').empty();
            $('.row-to-non-quarter-remove').remove();
            $('.row-to-quarter-remove').remove();
            quarter = 1;
            non_quarter = 1;
            edit_quarter = 0;
            edit_non_quarter = 0;
            var selectedOption = $(this).val();
            if (selectedOption == 1) {
                $('#quarter-report-input').removeClass('d-none');
                $('#non-quarter-report-input').addClass('d-none');
                //call function to check if year is already added
                quarterYearSelectionCheck();
            } else if (selectedOption == 0) {
                $('#quarter-report-input').addClass('d-none');
                $('#non-quarter-report-input').removeClass('d-none');
            } else {
                $('#quarter-report-input, #non-quarter-report-input').addClass('d-none');
            }

        });

        function quarterYearSelectionCheck(){
            $('.loading-block').show();
            $.ajax({
                method : "GET",
                url : "{{url('admin/quarter-check-reports')}}/"+research_id,
                success:function(data){
                    $('.loading-block').hide();
                    $('#year_select option, #q_research_title option').each(function() {
                        var year = $(this).val();
                        // Check if the year is in the disabledYears array
                        if ($.inArray(year, data) !== -1) {
                            $(this).prop('disabled', true);
                        }
                    });
                }
            });
        }

        $('#add-research-report-modal, #edit-research-report-modal').on('hidden.bs.modal', function () {
            quarter = 1;
            non_quarter = 1;
            edit_quarter = 0;
            edit_non_quarter = 0;
            $('#add-research-report-modal input[type="text"], #edit-research-report-modal input[type="text"]').val('');
            $('#add-research-report-modal input[type="file"], #edit-research-report-modal input[type="file"]').val('');
            $('#add-research-report-modal input[type="checkbox"], #edit-research-report-modal input[type="checkbox"]').prop("checked",false);
            $('#quarter-report-select').val('');
            $('#edit-quarter-report-select').val('');
            $('#quarter-report-input, #non-quarter-report-input, #quarter-edit-report-wrapper, #quarter-edit-report-wrapper').addClass('d-none');
            $('#quarter-edit-report-input, #non-quarter-edit-report-input').parent().addClass('d-none');
            $('.error').empty();
            $('#quarter-edit-report-input, #non-quarter-edit-report-input').empty();
            $('#q_research_title').val('').trigger('change');
            $('#year_select').val('').trigger('change');
            $('.row-to-non-quarter-remove').remove();
            $('.row-to-quarter-remove').remove();
        });

        $('#edit-research-report-modal').on('hidden.bs.modal', function () {
            window.location.reload();
        });

        $('.quarter-add').click(function() {
            var $quarterRow = $('#quarter-wrapper-append .row').first().clone();
            $quarterRow.addClass('row-to-quarter-remove');
            $('#quarter-wrapper-append').append($quarterRow);
            $quarterRow.find('.form-group input[type="text"]').attr('id', quarter);
            $quarterRow.find('.form-group input[type="text"]').val('');
            $quarterRow.find('.form-group input[type="hidden"]').val('');
            $quarterRow.find('.form-group input[type="file"]').val('');
            $quarterRow.find('.form-group .error').removeClass('research_sub_title_error_0');
            $quarterRow.find('.form-group .error').addClass('research_sub_title_error_' + quarter);
            $quarterRow.find('.form-group .error').html('');
            quarter++;
        });

        $('.edit-quarter-add').click(function() {
            var $quarterRow = $('#quarter-edit-report-input .row').first().clone();
            $quarterRow.addClass('row-to-quarter-remove');
            $('#quarter-edit-report-input').append($quarterRow);
            $quarterRow.find('.form-group input[type="text"]').attr('id', edit_quarter);
            $quarterRow.find('.form-group input[type="text"]').val('');
            $quarterRow.find('.form-group input[type="hidden"]').val('');
            $quarterRow.find('.form-group input[type="file"]').val('');
            $quarterRow.find('.quarter-edit-delete').removeAttr('data-id');
            $quarterRow.find('.form-group .error').removeClass('research_sub_title_error_0');
            $quarterRow.find('.form-group .error').addClass('research_sub_title_error_' + edit_quarter);
            $quarterRow.find('.form-group .error').html('');
            $quarterRow.find('.research_pdf').html('');
            edit_quarter++;
        });

        $('.non-quarter-add').click(function() {
            var $nonQuarterRow = $('#non-quarter-wrapper-append .row').first().clone();
            $nonQuarterRow.addClass('row-to-non-quarter-remove');
            $('#non-quarter-wrapper-append').append($nonQuarterRow);
            $nonQuarterRow.find('.form-group input[type="text"]').attr('id', non_quarter);
            $nonQuarterRow.find('.form-group input[type="text"]').val('');
            $nonQuarterRow.find('.form-group input[type="hidden"]').val('');
            $nonQuarterRow.find('.form-group input[type="file"]').val('');
            $nonQuarterRow.find('.form-group input[type="checkbox"]').prop("checked",false);
            $nonQuarterRow.find('.form-group .error').removeClass('non_quarter_research_title_error_0');
            $nonQuarterRow.find('.form-group .error').addClass('non_quarter_research_title_error_' + non_quarter);
            $nonQuarterRow.find('.form-group .error').html('');
            non_quarter++;
        });

        $('.edit-non-quarter-add').click(function() {
            var $nonQuarterRow = $('#non-quarter-edit-report-input .row').first().clone();
            $nonQuarterRow.addClass('row-to-quarter-remove');
            $('#non-quarter-edit-report-input').append($nonQuarterRow);
            $nonQuarterRow.find('.form-group input[type="text"]').attr('id', edit_non_quarter);
            $nonQuarterRow.find('.form-group input[type="text"]').val('');
            $nonQuarterRow.find('.form-group input[type="hidden"]').val('');
            $nonQuarterRow.find('.form-group input[type="file"]').val('');
            $nonQuarterRow.find('.non-quarter-edit-delete').removeAttr('data-id');
            $nonQuarterRow.find('.form-group input[type="checkbox"]').prop("checked",false);
            $nonQuarterRow.find('.form-group .error').removeClass('non_quarter_research_title_error_0');
            $nonQuarterRow.find('.form-group .error').addClass('non_quarter_research_title_error_' + edit_non_quarter);
            $nonQuarterRow.find('.form-group .error').html('');
            $nonQuarterRow.find('.research_pdf').html('');
            edit_non_quarter++;
        });


        $(document).on('click', '.non-quarter-delete', function() {
            $(this).closest('.row').remove();
            non_quarter--;
            if(non_quarter === 0){window.location.reload()}
        });

        $(document).on('click', '.quarter-delete', function() {
            $(this).closest('.row').remove();
            quarter--;
            if(quarter === 0){ window.location.reload() };
        });

        //post add
        $('#add-research-report-submit').click(function(){
            $('.error').empty();
            $('.loading-block').show();
            var quarterVal = $("#quarter-report-select").val() === "1" ? quarter : non_quarter;
            var data  = new FormData( $( '.add-child-research-report-form' )[ 0 ] );
            data.append('include_email_updates', document.getElementById('email_update').checked ? 1 : 0); // include_email_updates
            data.append('total',quarterVal);
            $.ajax({
                method : "POST",
                headers:{ 'X-CSRF-TOKEN': '{{ csrf_token() }}'},
                url : "{{url('/admin/research-child-report')}}",
                data: data,
                processData: false,
                contentType: false,
                success:function(data){
                    $('.loading-block').hide();
                    if(data.success == 1){
                        window.location.href = "{{ url('/admin/research-report') }}/"+research_id +"/edit"
                    }else if(data.success == 0){
                        Object.keys(data.message).forEach(function(key) {
                            var errorSelectorOne = '.' + key + '_error';
                            if (data.message[key].length && $(errorSelectorOne).length) {
                                $(errorSelectorOne).html(data.message[key][0]);
                            }
                        });
                        for(i=0;i<quarter;i++){
                            if(data.message['research_sub_title.'+(i)]){
                                $('.research_sub_title_error_'+i).html(data.message['research_sub_title.'+i][0]);
                            }
                        }
                        for(i=0;i<non_quarter;i++){
                            if(data.message['non_quarter_research_title.'+(i)]){
                                $('.non_quarter_research_title_error_'+i).html(data.message['non_quarter_research_title.'+i][0]);
                            }
                        }
                    }else{
                        if(data.error === 0){
                            $('.notvalid-error').html(data.message);
                            $('.notvalid-error').removeClass("d-none");
                            setTimeout(function() {
                                $('.notvalid-error').addClass("d-none");
                            }, 5000);
                        }
                    }
                }
            });
        });

        //get edit
        $('.editResearchReport').click(function(){
            var edit_id = $(this).data('id');
            var is_quarter = $(this).data('quarter');
            var title = $(this).data('title');

            $.ajax({
                method : "GET",
                url : "{{url('/admin/research-child-report')}}/"+ edit_id +"/edit?title="+title+"&isquarter="+is_quarter,
                processData: false,
                contentType: false,
                success:function(data){
                    $('.loading-block').hide();
                    $('#edit-research-report-modal').modal('show');
                    $('#research_id').val(edit_id);
                    $('#edit-quarter-report-select').val(is_quarter);
                    if (is_quarter) {
                        $('#q_research_title').val(data[0].research_child_title);
                        $('#quarter-edit-report-input').parent().removeClass('d-none');
                        $('#quarter-edit-report-wrapper').removeClass('d-none');
                        $('#non-quarter-edit-report-wrapper').addClass('d-none');
                        $('#non-quarter-edit-report-input').parent().addClass('d-none');
                        $.each(data, function(index, record) {
                            $('#quarter-edit-report-input').append(
                                `<div class="row">
                                    <div class="form-group">
                                        <input type="hidden" name="quarter_id[]" value="${record.id}" id="quarter-id">
                                    </div>
                                    <div class="col-3">
                                        <div class="form-group">
                                            <input type="text" name="research_sub_title[]" class="form-control" id="${edit_quarter}" value="${record.research_sub_title}" placeholder="Enter Title">
                                            <span class="error research_sub_title_error_${edit_quarter}"></span>
                                        </div>
                                    </div>
                                    <div class="col-2">
                                        <div class="form-group">
                                            <input type="file" name="quarter1[]" class="form-control" id="quarter1" accept="application/pdf">
                                            ${record.quarter1 ? `<a href="{{ asset('pdf/research-reports/${record.research_sub_child_reports}/${record.quarter1}') }}" target="_blank" class="research_pdf" title="${record.quarter1}"> ${record.quarter1.length > 15 ? record.quarter1.substring(0, 15) + '...' : record.quarter1 }</a>` : '' }
                                        </div>
                                    </div>
                                    <div class="col-2">
                                        <div class="form-group">
                                            <input type="file" name="quarter2[]" class="form-control" id="quarter2" accept="application/pdf">
                                            ${record.quarter2 ? `<a href="{{ asset('pdf/research-reports/${record.research_sub_child_reports}/${record.quarter2}') }}" target="_blank" class="research_pdf" title="${record.quarter2}"> ${record.quarter2.length > 15 ? record.quarter2.substring(0, 15) + '...' : record.quarter2 }</a>` : '' }
                                        </div>
                                    </div>
                                    <div class="col-2">
                                        <div class="form-group">
                                            <input type="file" name="quarter3[]" class="form-control" id="quarter3" accept="application/pdf">
                                            ${record.quarter3 ? `<a href="{{ asset('pdf/research-reports/${record.research_sub_child_reports}/${record.quarter3}') }}" target="_blank" class="research_pdf" title="${record.quarter3}"> ${record.quarter3.length > 15 ? record.quarter3.substring(0, 15) + '...' : record.quarter3 }</a>` : '' }
                                        </div>
                                    </div>
                                    <div class="col-2">
                                        <div class="form-group">
                                            <input type="file" name="quarter4[]" class="form-control" id="quarter4" accept="application/pdf">
                                            ${record.quarter4 ? `<a href="{{ asset('pdf/research-reports/${record.research_sub_child_reports}/${record.quarter4}') }}" target="_blank" title="${record.quarter4}" class="research_pdf"> ${record.quarter4.length > 15 ? record.quarter4.substring(0, 15) + '...' : record.quarter4 }</a>` : '' }
                                        </div>
                                    </div>
                                    <div class="col-1">
                                        <a href="javascript:void(0);" class="btn btn-danger btn-sm quarter-edit-delete" title="Delete" data-id="${record.id}" data-isquarter="1" onclick="child_remove(this)">
                                            <i class="fa fa-trash"></i>
                                        </a>
                                    </div>
                                </div>`
                            );
                            edit_quarter++;
                        });
                    } else {
                        $('#quarter-edit-report-wrapper').addClass('d-none');
                        $('#non-quarter-edit-report-wrapper').removeClass('d-none');
                        $('#non-quarter-edit-report-input').parent().removeClass('d-none');
                        $('#quarter-edit-report-input').parent().addClass('d-none');
                        $.each(data, function(index, record) {
                            $('#non-quarter-edit-report-input').append(
                                `<div class="row">
                                    <div class="form-group">
                                        <input type="hidden" name="non_quarter_id[]" value="${record.id}" id="non-quarter-id">
                                    </div>
                                    <div class="col-4">
                                        <div class="form-group">
                                            <input type="text" name="non_quarter_research_title[]" class="form-control" id="${edit_non_quarter}" value="${record.research_child_title}" placeholder="Enter Title">
                                            <span class="error non_quarter_research_title_error_${edit_non_quarter}"></span>
                                        </div>
                                    </div>
                                    <div class="col-7">
                                        <div class="form-group">
                                            <input type="file" name="report_pdf[]" class="form-control" id="upload_pdf" accept="application/pdf">
                                            ${record.report_pdf ? `<a href="{{ asset('pdf/research-reports/${record.research_sub_child_reports}/${record.report_pdf}') }}" target="_blank" class="research_pdf" title="${record.report_pdf}"> ${record.report_pdf.length > 40 ? record.report_pdf.substring(0, 40) + '...' : record.report_pdf }</a>` : ''}
                                        </div>
                                    </div>
                                    <div class="col-1">
                                        <a href="javascript:void(0);" class="btn btn-danger btn-sm non-quarter-edit-delete" title="Delete" data-id="${record.id}" data-isquarter="0" onclick="child_remove(this)">
                                            <i class="fa fa-trash"></i>
                                        </a>
                                    </div>
                                </div>`
                            );
                            edit_non_quarter++;
                        });
                    }
                }
            });
        });

        //post edit
        $('#edit-research-report-submit').click(function(e){
            e.preventDefault();
            $('.error').empty();
            $('.loading-block').show();
            var editdata  = new FormData( $( '.edit-child-research-report-form' )[ 0 ] );
            var title = $("#edit-quarter-report-select").val() === "1" ? $('#q_research_title').val() : '';
            var quarterVal = $("#edit-quarter-report-select").val() === "1" ? edit_quarter : edit_non_quarter;
            editdata.append('total',quarterVal);
            editdata.append('title',title);
            editdata.append('id',research_id);
            editdata.append('include_email_updates', document.getElementById('email_update').checked ? 1 : 0); // include_email_updates
            $.ajax({
                headers:{ 'X-CSRF-TOKEN': '{{ csrf_token() }}'},
                url : "{{url('/admin/update/research-child-report')}}",
                method : "POST",
                data: editdata,
                processData: false,
                contentType: false,
                success:function(data){
                    $('.loading-block').hide();
                    if(data.success == 1){
                        $('#edit-research-report-modal').modal('hide');
                        window.location.href = "{{ url('/admin/research-report') }}/"+research_id +"/edit#viewResearchReport"
                    }else if(data.success == 0){
                        Object.keys(data.message).forEach(function(key) {
                            var errorSelectorOne = '.' + key + '_error';
                            if (data.message[key].length && $(errorSelectorOne).length) {
                                $(errorSelectorOne).html(data.message[key][0]);
                            }
                        });
                        for(i=0;i<edit_quarter;i++){
                            if(data.message['research_sub_title.'+(i)]){
                                $('.research_sub_title_error_'+i).html(data.message['research_sub_title.'+i][0]);
                            }
                        }
                        for(i=0;i<edit_non_quarter;i++){
                            if(data.message['non_quarter_research_title.'+(i)]){
                                $('.non_quarter_research_title_error_'+i).html(data.message['non_quarter_research_title.'+i][0]);
                            }
                        }
                    }else{
                        if(data.error === 0){
                            $('.notvalid-error').html(data.message);
                            $('.notvalid-error').removeClass("d-none");
                            setTimeout(function() {
                                $('.notvalid-error').addClass("d-none");
                            }, 5000);
                        }
                    }
                },
                error: function(jqXHR, textStatus, errorThrown) {
                // Handle error
                console.error(textStatus, errorThrown);
            }
            });
        });
    });

    function child_remove(button){
        var isquarter = button.getAttribute("data-isquarter");
        var id = button.getAttribute("data-id");
        if (button.getAttribute("data-id")) {
            if(confirm('Are you sure to delete this record ?')) {
                $.ajax({
                    method : "DELETE",
                    headers:{ 'X-CSRF-TOKEN': '{{ csrf_token() }}'},
                    url : "{{url('/admin/research-child-report')}}/" + id,
                    data: {
                        isquarter: isquarter
                    },
                    success:function(data){
                        if(data.success == 1){
                            button.closest('.row').remove();
                            $('#child-remove').html(data.message);
                            $('#child-remove').removeClass("d-none");
                            setTimeout(function() {
                                $('#child-remove').addClass("d-none");
                            }, 5000);
                            if(isquarter === "0"){
                                window.location.reload();
                                edit_non_quarter--;
                            }else{
                                edit_quarter--;
                                if(edit_quarter === 0){window.location.reload()}
                            }
                        }
                    }
                });
            }
        }else{
            button.closest('.row').remove();
            if(isquarter === "1") {
                edit_quarter--;
                if(edit_quarter === 0){window.location.reload()}
            }else{
                edit_non_quarter--;
            }

        }
    }

</script>
@endpush