From 35e0abbbd86bb87db79419608b4f7321bef20283 Mon Sep 17 00:00:00 2001
From: Dmitry Borisenko <67171972+IoTManagerProject@users.noreply.github.com>
Date: Sat, 19 Feb 2022 23:35:30 +0100
Subject: [PATCH] =?UTF-8?q?=D0=B4=D0=BE=D0=B1=D0=B0=D0=B2=D0=B8=D0=BB=20?=
 =?UTF-8?q?=D0=BB=D0=BE=D0=B3?=
MIME-Version: 1.0
Content-Type: text/plain; charset=UTF-8
Content-Transfer-Encoding: 8bit

---
 src/App.svelte             |  29 +++++++---
 src/components/Card.svelte |  15 +++--
 src/pages/System.svelte    | 111 ++++++++++++++++++++++---------------
 3 files changed, 95 insertions(+), 60 deletions(-)

diff --git a/src/App.svelte b/src/App.svelte
index 8d2952c..7e42d3e 100644
--- a/src/App.svelte
+++ b/src/App.svelte
@@ -1,4 +1,8 @@
 <script>
+  /******************************************************************************************************************************
+   **
+   ******************************************************************************************************************************/
+
   //******************************************************import section*********************************************************/
   //*****************************************************************************************************************************/
   import { onMount } from "svelte";
@@ -23,9 +27,9 @@
 
   //****************************************************constants section*********************************************************/
   //******************************************************************************************************************************/
-  let version = 405;
+  let version = 407;
   let debug = true;
-  let LOG_MAX_MESSAGES = 10;
+  let LOG_MAX_MESSAGES = 100;
   let reconnectTimeout = 20000;
   let rebootingTimeout = 20000;
   let updatingTimeout = 80000;
@@ -35,7 +39,7 @@
   //****************************************************variable section**********************************************************/
   //******************************************************************************************************************************/
   let myip = document.location.hostname;
-  //let myip = "192.168.8.127";
+  //let myip = "192.168.8.128";
 
   //Flags
   let firstDevListRequest = true;
@@ -334,6 +338,14 @@
               }
             }
 
+            //сборщик log сообщений======================================
+            if (data.includes("/log|")) {
+              data = data.replace("/log|", "");
+              //let msg = data.toString();
+              if (debug) console.log("", data);
+              addCoreMsg(data);
+            }
+
             //BLOB==============================================================
             //сборщик configJson пакетов========================================
             if (data === "/st/config.json") {
@@ -573,6 +585,8 @@
 
     errorsJson = {};
 
+    coreMessages = [];
+
     dashReady = false;
     configReady = false;
     connectionReady = false;
@@ -668,14 +682,13 @@
 
   //***********************************************************logging******************************************************************/
   const addCoreMsg = (msg) => {
-    if (coreMessages.length > Number(LOG_MAX_MESSAGES)) {
-      coreMessages = coreMessages.slice(0);
+    if (coreMessages.length >= LOG_MAX_MESSAGES) {
+      coreMessages.shift();
     }
-    const time = new Date().getTime();
+    //const time = new Date().getTime();
     coreMessages = [
       ...coreMessages,
       {
-        time,
         msg,
       },
     ];
@@ -1055,7 +1068,7 @@
             <ListPage show={listReady} deviceList={deviceList} showInput={showInput} addDevInList={() => addDevInList()} newDevice={newDevice} sendToAllDevices={(msg) => sendToAllDevices(msg)} />
           </Route>
           <Route path="/system">
-            <SystemPage show={systemReady} errorsJson={errorsJson} rebootEsp={() => rebootEsp()} cancelAlarm={(alarmKey) => cancelAlarm(alarmKey)} version={version} versionsList={versionsList} bind:choosingVersion startUpdate={() => startUpdate()} />
+            <SystemPage show={systemReady} errorsJson={errorsJson} settingsJson={settingsJson} saveSett={() => saveSett()} rebootEsp={() => rebootEsp()} cancelAlarm={(alarmKey) => cancelAlarm(alarmKey)} version={version} versionsList={versionsList} bind:choosingVersion startUpdate={() => startUpdate()} coreMessages={coreMessages} />
           </Route>
 
           <!--<Route path="/utilities">-->
diff --git a/src/components/Card.svelte b/src/components/Card.svelte
index 38f615c..98b60e3 100644
--- a/src/components/Card.svelte
+++ b/src/components/Card.svelte
@@ -1,13 +1,16 @@
 <script>
   export let title = false;
+  export let show = true;
 </script>
 
-<div class="crd">
-  {#if title}
-    <h1 class="crd-hdr">{title}</h1>
-  {/if}
-  <slot />
-</div>
+{#if show}
+  <div class="crd">
+    {#if title}
+      <h1 class="crd-hdr">{title}</h1>
+    {/if}
+    <slot />
+  </div>
+{/if}
 
 <style lang="postcss" global>
   @tailwind base;
diff --git a/src/pages/System.svelte b/src/pages/System.svelte
index 0fc3964..c43e413 100644
--- a/src/pages/System.svelte
+++ b/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}