добавил лог

src/pages/System.svelte

@@ -128,8 +128,11 @@
 
   export let versionsList;
   export let choosingVersion;
+  export let coreMessages;
+  export let settingsJson;
 
   export let startUpdate = () => {};
+  export let saveSett = () => {};
 
   export let show;
 
@@ -137,19 +140,20 @@
 </script>
 
 {#if show}
-  <div class="grd-2col1">
+  <div class="grd-3col1">
+    <!--INFORMATION-->
     <Card title="Системная информация">
-      <div class="crd-itm-psn">
+      <div class="flex mb-2 h-6 items-center">
         <div class="w-3/4">
-          <p class="wgt-dscr-stl">Название прошивки</p>
+          <p class="pr-4 text-gray-500 font-bold text-sm">Название прошивки</p>
         </div>
         <div class="flex justify-center w-1/4">
-          <p class="text-gray-500 font-bold">{errorsJson.bn}</p>
+          <p class="text-gray-500 font-bold text-sm">{errorsJson.bn}</p>
         </div>
       </div>
-      <div class="crd-itm-psn">
+      <div class="flex mb-2 h-6 items-center">
         <div class="w-3/4">
-          <p class="wgt-dscr-stl">Версии прошивки на сервере</p>
+          <p class="pr-4 text-gray-500 font-bold text-sm">Версии прошивки на сервере</p>
         </div>
         <div class="flex justify-center w-1/4">
           <select class="border border-indigo-500 border-4" bind:value={choosingVersion}>
@@ -161,105 +165,120 @@
           </select>
         </div>
       </div>
-      <div class="crd-itm-psn">
+      <div class="flex mb-2 h-6 items-center">
         <div class="w-3/4">
-          <p class="wgt-dscr-stl">Версия прошивки</p>
+          <p class="pr-4 text-gray-500 font-bold text-sm">Версия прошивки</p>
         </div>
         <div class="flex justify-center w-1/4">
-          <p class="text-gray-500 font-bold">{errorsJson.bver}</p>
+          <p class="text-gray-500 font-bold text-sm">{errorsJson.bver}</p>
         </div>
       </div>
-      <div class="crd-itm-psn">
+      <div class="flex mb-2 h-6 items-center">
         <div class="w-3/4">
-          <p class="wgt-dscr-stl">Версия файловой системы</p>
+          <p class="pr-4 text-gray-500 font-bold text-sm">Версия файловой системы</p>
         </div>
         <div class="flex justify-center w-1/4">
-          <p class="text-gray-500 font-bold">{version}</p>
+          <p class="text-gray-500 font-bold text-sm">{version}</p>
         </div>
       </div>
-      <div class="crd-itm-psn">
+      <div class="flex mb-2 h-6 items-center">
         <div class="w-3/4">
-          <p class="wgt-dscr-stl">Uptime устройства</p>
+          <p class="pr-4 text-gray-500 font-bold text-sm">Uptime устройства</p>
         </div>
         <div class="flex justify-center w-1/4">
-          <p class="text-gray-500 font-bold">{errorsJson.upt}</p>
+          <p class="text-gray-500 font-bold text-sm">{errorsJson.upt}</p>
         </div>
       </div>
-      <div class="crd-itm-psn">
+      <div class="flex mb-2 h-6 items-center">
         <div class="w-3/4">
-          <p class="wgt-dscr-stl">Uptime сессии mqtt</p>
+          <p class="pr-4 text-gray-500 font-bold text-sm">Uptime сессии mqtt</p>
         </div>
         <div class="flex justify-center w-1/4">
-          <p class="text-gray-500 font-bold">{errorsJson.uptm}</p>
+          <p class="text-gray-500 font-bold text-sm">{errorsJson.uptm}</p>
         </div>
       </div>
-      <div class="crd-itm-psn">
+      <div class="flex mb-2 h-6 items-center">
         <div class="w-3/4">
-          <p class="wgt-dscr-stl">Качество WiFi сигнала</p>
+          <p class="pr-4 text-gray-500 font-bold text-sm">Качество WiFi сигнала</p>
         </div>
         <div class="flex justify-center w-1/4 text-xs sm:text-sm md:text-base lg:text-base xl:text-base 2xl:text-base break-words">
           {#if errorsJson.rssi === 0}
-            <p class="text-red-500 font-bold">не подключено</p>
+            <p class="text-red-500 font-bold text-sm">не подключено</p>
           {/if}
           {#if errorsJson.rssi === 1}
-            <p class="text-red-500 font-bold">нет сигнала</p>
+            <p class="text-red-500 font-bold text-sm">нет сигнала</p>
           {/if}
           {#if errorsJson.rssi === 2}
-            <p class="text-red-500 font-bold">очень низкий</p>
+            <p class="text-red-500 font-bold text-sm">очень низкий</p>
           {/if}
           {#if errorsJson.rssi === 3}
-            <p class="text-yellow-500 font-bold">низкий</p>
+            <p class="text-yellow-500 font-bold text-sm">низкий</p>
           {/if}
           {#if errorsJson.rssi === 4}
-            <p class="text-yellow-500 font-bold">хороший</p>
+            <p class="text-yellow-500 font-bold text-sm">хороший</p>
           {/if}
           {#if errorsJson.rssi === 5}
-            <p class="text-green-500 font-bold">очень хороший</p>
+            <p class="text-green-500 font-bold text-sm">очень хороший</p>
           {/if}
           {#if errorsJson.rssi === 6}
-            <p class="text-green-500 font-bold">отличный</p>
+            <p class="text-green-500 font-bold text-sm">отличный</p>
           {/if}
         </div>
       </div>
-      <div class="crd-itm-psn">
+      <div class="flex mb-2 h-6 items-center">
         <div class="w-3/4">
-          <p class="wgt-dscr-stl">Остаток оперативной памяти</p>
+          <p class="pr-4 text-gray-500 font-bold text-sm">Остаток оперативной памяти</p>
         </div>
         <div class="flex justify-center w-1/4">
           <p class="text-green-500 font-bold">{errorsJson.heap}</p>
         </div>
       </div>
-      <div class="crd-itm-psn">
+      <div class="flex mb-2 h-6 items-center">
         <div class="w-3/4">
-          <p class="wgt-dscr-stl">Количество записей на flash</p>
+          <p class="pr-4 text-gray-500 font-bold text-sm">Количество записей на flash</p>
         </div>
         <div class="flex justify-center w-1/4">
           <p class="text-green-500 font-bold">{errorsJson.fl}</p>
         </div>
       </div>
+      <button class="btn-lg" on:click={() => startUpdate()}>{"Обновить прошивку"}</button>
     </Card>
+    <!--SETTINGS-->
+    <Card title="Системные настройки">
+      <div class="flex mb-2 h-6 items-center">
+        <div class="w-5/6">
+          <p class="pr-4 text-gray-500 font-bold text-sm">Включить лог</p>
+        </div>
+        <div class="flex justify-center w-1/6">
+          <input bind:checked={settingsJson.log} on:change={() => saveSett()} type="checkbox" class="form-checkbox h-4 w-4 text-gray-600" />
+        </div>
+      </div>
+      <button class="btn-lg" on:click={() => rebootEsp()}>{"Перезагрузить устройство"}</button>
+    </Card>
+    <!--LOG-->
+    <Card title="Лог">
+      <div class="h-80 overflow-y-auto">
+        {#each coreMessages as message, i}
+          <div class={message.msg.toString().includes("[E]") ? "text-xs text-red-500" : "text-xs text-black"}>{message.msg}</div>
+        {/each}
+      </div>
+    </Card>
+  </div>
+  <!--ERRORS-->
+  <div class="grd-1col1">
     <Card title="Системные ошибки">
-      <div class="grd-2col1">
-        <!--ошибки-->
-        {#each Object.entries(errorsJson) as [key, param]}
-          {#if key in systemErrorsRus && param in systemErrorsRus[key]}
+      {#each Object.entries(errorsJson) as [key, param], i}
+        {#if key in systemErrorsRus && param in systemErrorsRus[key]}
+          <div class="grd-2col1">
             <Alarm title={systemErrorsRus[key][param].descr} cross={systemErrorsRus[key][param].cancel} close={() => cancelAlarm(key)}>
               <p class="break-words text-center">{systemErrorsRus[key][param].txt}</p>
               {#if systemErrorsRus[key][param].num}
                 <p class="break-words text-center">{"Количество: " + errorsJson[key + "n"]}</p>
               {/if}
             </Alarm>
-          {/if}
-        {/each}
-      </div>
-    </Card>
-  </div>
-  <div class="grd-1col1">
-    <Card>
-      <div class="grd-2col1">
-        <button class="btn-lg" on:click={() => startUpdate()}>{"Обновить прошивку"}</button>
-        <button class="btn-lg" on:click={() => rebootEsp()}>{"Перезагрузить устройство"}</button>
-      </div>
+          </div>
+        {/if}
+      {/each}
     </Card>
   </div>
 {:else}