JSFiddle - React, Tailwind, and code Playground

by Rymarovich Vasily

HTML

<div>
  <input type="checkbox" id="showTasks" name="showTasks">
  <label for="showTasks">Отображать поручения</label>
</div>

CSS

.section {
    margin: 4px 16px;
    background-color: #eaeaea36;
    padding: 12px 24px;
    border: 1px solid #00000014;
    border-radius: 10px;
      }

JavaScript

const main_report = JSON.parse('[{"row_0":"790e2baa-1b4c-43b8-8964-f1f737d2c7ee","row_1":"None","row_2":"1","row_3":"Вн.","row_4":"Пост-84","row_5":"2022-08-31","row_6":"Передан получателям","row_7":"Списан в дело","row_8":"Администратор","row_9":"Администратор","row_10":"промежуточный отчет"},{"row_0":"None","row_1":"09f560ca-450d-4099-935f-271cffea4a2c","row_2":"2","row_3":"КЗ","row_4":"","row_5":"None","row_6":"В работе","row_7":"","row_8":"Администратор","row_9":"Администратор","row_10":"В Ваш адрес поступила новая корреспонденция."},{"row_0":"ae8b2265-7f75-435b-8a7b-a75265d5fc73","row_1":"None","row_2":"3","row_3":"Исх.","row_4":"None","row_5":"None","row_6":"Аннулирован","row_7":"Списан в дело","row_8":"None","row_9":"None","row_10":"промежуточный отчет"},{"row_0":"a2b7a1af-bf9b-4b8e-b6a3-481725fda749","row_1":"None","row_2":"3","row_3":"Исх.","row_4":"None","row_5":"None","row_6":"Аннулирован","row_7":"Списан в дело","row_8":"None","row_9":"None","row_10":"None"},{"row_0":"fc6cf81e-0918-42ef-a243-4df85c8c9b1f","row_1":"None","row_2":"2","row_3":"Вх.","row_4":"Пост-83","row_5":"2022-08-31","row_6":"Передан получателям","row_7":"Списан в дело","row_8":"Тестовая организация (Исх. 22222)","row_9":"Администратор","row_10":"ответ пришел"},{"row_0":"None","row_1":"304e3a4e-6893-460c-b1f1-272c3bde328d","row_2":"3","row_3":"КЗ","row_4":"","row_5":"None","row_6":"В работе","row_7":"","row_8":"Администратор","row_9":"Администратор","row_10":"В Ваш адрес поступила новая корреспонденция."},{"row_0":"None","row_1":"0dd55eb1-b2e2-4169-900e-59d3570422bb","row_2":"4","row_3":"КЗ","row_4":"","row_5":"2022-09-07","row_6":"Аннулировано","row_7":"","row_8":"Администратор","row_9":"Тест_Исполнитель","row_10":"надо подготовить ответ"},{"row_0":"21f92038-2555-4ff0-9e1b-7522a9b91e77","row_1":"None","row_2":"3","row_3":"Исх.","row_4":"Пост-81","row_5":"2022-08-16","row_6":"Регистрируется","row_7":"Списан в дело","row_8":"Администратор","row_9":"Тестовая организация","row_10":"ответ...