Incorrect links or js code in Bitrix?

Question

JavaScript

Sorry, I can’t understand what the problem is, I made the output of the elements in tabs, but the wrong year that I chose becomes active, whether it’s in the php code or in the script, I can’t understand the error. How can I fix this?
Here's how I did it, this is the page itself and the template is displayed, there is only a title and a link
The link to the page itself

<? if ($_SESSION['vis-imp'] == 'Y'): ?>
<div class="banner-page">
   <?else:?>
  <div class="banner-page" style="background-image: url('<span id=" title="Код PHP: &lt;?=DEFAULT_TEMPLATE_PATH?&gt;">
    <?=DEFAULT_TEMPLATE_PATH?><span class="bxhtmled-surrogate-inner"><span class="bxhtmled-right-side-item-icon"></span><span class="bxhtmled-comp-lable" unselectable="on" spellcheck="false">Код PHP</span></span>/img/project-information-banner.png')"&gt; <?endif;?>
    <div class="container">
       <?$APPLICATION->IncludeComponent(
  "bitrix:breadcrumb",
  "breadcrumb",
  Array(
    "PATH" => "",
    "SITE_ID" => "s1",
    "START_FROM" => "0"
  )
);?>
      <div class="banner-page-inner make-contribution-title">
        <h1>
        <?$APPLICATION->IncludeFile("/include/content/news-events/1-reporting.php")?> </h1>
      </div>
    </div>
  </div>
   <?

if($_GET['type']) $type = $_GET['type'];
else $type=1;
if($_GET['year']) $year = $_GET['year'];
else $year = 24;

$elDocument[]=array("PROPERTY"=>array("TYPE"=>$type));
if (CModule::IncludeModule("iblock")) {
    $sections = [];
    $arFilter = array('IBLOCK_ID' => 5);
    $rsSect = CIBlockSection::GetList(array(), $arFilter);
    while ($arSect = $rsSect->GetNext()) {
        $sections[] = $arSect;
    }
}
foreach ($sections as $index => $item) {
    if($item['ID']==$year || !$year){
        $res = CIBlockElement::GetList(array(), array('IBLOCK_ID' => 5, 'SECTION_ID' => $item['ID']), false, array(), array());
        while ($ob = $res->GetNextElement()) {
            $arFields = $ob->GetFields();
            $elDocument['ID'][] = $arFields['ID'];
        }
    }
}
?>
  <div class="reporting">
    <div class="container">
      <form action="/about/reporting" method="GET" id="filtersForm">
        <div class="reporting-type">
 <label for="yearReporting" class="btn-block"> <input type="radio" id="yearReporting" class="check-box" name="type" value="1" style="display: none">
          <div class="blue-btn active">
            Годовые отчеты
          </div>
 </label> <label for="financialPlans" class="btn-block"> <input type="radio" class="check-box" id="financialPlans" name="type" value="2" style="display: none">
          <div class="blue-btn">
            Финансовые планы
          </div>
 </label> <label for="auditReports" class="btn-block"> <input type="radio" class="check-box" id="auditReports" name="type" value="3" style="display: none">
          <div class="blue-btn">
            Аудиторские отчеты
          </div>
 </label> <label for="auditMinust" class="btn-block"> <input type="radio" class="check-box" id="auditMinust" name="type" value="41" style="display: none">
          <div class="blue-btn">
            Отчеты по форме Минюста РФ
          </div>
 </label>
        </div>
        <div class="years">
 <label for="years2021" class="years-btn"> <input type="radio" class="check-box" id="years2021" name="year" value="25" style="display: none">
          <div>
            2021
          </div>
 </label> <label for="years2020" class="years-btn"> <input type="radio" class="check-box" id="years2020" name="year" value="23" style="display: none">
          <div>
            2020
          </div>
 </label> <label for="years2019" class="years-btn"> <input type="radio" class="check-box" id="years2019" name="year" value="22" style="display: none">
          <div>
            2019
          </div>
 </label> <label for="years2018" class="years-btn"> <input type="radio" class="check-box" id="years2018" name="year" value="21" style="display: none">
          <div>
            2018
          </div>
 </label> <label for="years2017" class="years-btn"> <input type="radio" class="check-box" id="years2017" name="year" value="19" style="display: none">
          <div>
            2017 и ранее
          </div>
 </label>
        </div>
      </form>
       <?$APPLICATION->IncludeComponent(
  "bitrix:news.list",
  "reporting",
  Array(
    "ACTIVE_DATE_FORMAT" => "d.m.Y",
    "ADD_SECTIONS_CHAIN" => "N",
    "AJAX_MODE" => "N",
    "AJAX_OPTION_ADDITIONAL" => "",
    "AJAX_OPTION_HISTORY" => "N",
    "AJAX_OPTION_JUMP" => "N",
    "AJAX_OPTION_STYLE" => "Y",
    "CACHE_FILTER" => "N",
    "CACHE_GROUPS" => "Y",
    "CACHE_TIME" => "36000000",
    "CACHE_TYPE" => "A",
    "CHECK_DATES" => "Y",
    "COMPONENT_TEMPLATE" => "reporting",
    "DETAIL_URL" => "",
    "DISPLAY_BOTTOM_PAGER" => "Y",
    "DISPLAY_DATE" => "Y",
    "DISPLAY_NAME" => "Y",
    "DISPLAY_PICTURE" => "Y",
    "DISPLAY_PREVIEW_TEXT" => "Y",
    "DISPLAY_TOP_PAGER" => "N",
    "FIELD_CODE" => array(0=>"",1=>"",),
    "FILTER_NAME" => "elDocument",
    "HIDE_LINK_WHEN_NO_DETAIL" => "N",
    "IBLOCK_ID" => "5",
    "IBLOCK_TYPE" => "Content",
    "INCLUDE_IBLOCK_INTO_CHAIN" => "N",
    "INCLUDE_SUBSECTIONS" => "Y",
    "MESSAGE_404" => "",
    "NEWS_COUNT" => "15",
    "PAGER_BASE_LINK_ENABLE" => "N",
    "PAGER_DESC_NUMBERING" => "N",
    "PAGER_DESC_NUMBERING_CACHE_TIME" => "36000",
    "PAGER_SHOW_ALL" => "N",
    "PAGER_SHOW_ALWAYS" => "N",
    "PAGER_TEMPLATE" => "blog",
    "PAGER_TITLE" => "Новости",
    "PARENT_SECTION" => "",
    "PARENT_SECTION_CODE" => "",
    "PREVIEW_TRUNCATE_LEN" => "",
    "PROPERTY_CODE" => array(0=>"TYPE",1=>"DOCUMENT",2=>"",),
    "SET_BROWSER_TITLE" => "N",
    "SET_LAST_MODIFIED" => "Y",
    "SET_META_DESCRIPTION" => "N",
    "SET_META_KEYWORDS" => "N",
    "SET_STATUS_404" => "N",
    "SET_TITLE" => "N",
    "SHOW_404" => "N",
    "SORT_BY1" => "SORT",
    "SORT_BY2" => "ACTIVE_FROM",
    "SORT_ORDER1" => "ASC",
    "SORT_ORDER2" => "DESC",
    "STRICT_SECTION_CHECK" => "Y"
  )
);?>
    </div>
  </div>
</div>

and there is js, I can't figure out where the error is

document.addEventListener("DOMContentLoaded", function () {
if(document.querySelector('.reporting')){
    let formFilter = document.querySelector('#filtersForm');
    let checkboxes = document.querySelectorAll('.check-box');
    if (window.location.search) {
        let query_string = window.location.search.split('?')[1].split('&');
        checkboxes.forEach(item => {
            console.log(item.name);
            query_string.forEach(el => {
                let filter_query = el.split('=');

                if (filter_query[0] == item.name && filter_query[1] == item.value) {
                    item.checked = true;
                }
            })
        })
        for (let i = 0; i < checkboxes.length; i++) {
            if (checkboxes[i].checked === true) {
                console.log(i);
                if(i<3){
                    $($($('.blue-btn'))[i]).addClass('active');
                }
                if(2<i){
                    $($($('.years-btn'))[i-3]).addClass('active');
                }

            } else {
                if(i<3){
                    $($($('.blue-btn'))[i]).removeClass('active');

                }
                if(2<i){
                    $($($('.years-btn'))[i-3]).removeClass('active');
                }
            }
        }
    }
    checkboxes.forEach(item => {
        item.addEventListener('change', function (e) {
            formFilter.submit();
        })
    })


}


});