добавил лог

2026-03-26 15:02:21 +03:00 · 2022-02-19 23:35:30 +01:00
parent fdde2c9e9c
commit 35e0abbbd8
3 changed files with 95 additions and 60 deletions
--- 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">-->
--- 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;
--- 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}