...

public/index.html

@@ -4,7 +4,7 @@
     <meta charset="utf-8" />
     <meta name="viewport" content="width=device-width,initial-scale=1" />
 
-    <title>IoT Manager 4.2.7</title>
+    <title>IoT Manager 4.2.8</title>
 
     <link rel="icon" type="image/png" href="/favicon.ico" />
     <link rel="stylesheet" href="/build/bundle.css" />

src/App.svelte

@@ -21,6 +21,7 @@
   import ListPage from "./pages/List.svelte";
   import SystemPage from "./pages/System.svelte";
   import DevPage from "./pages/Dev.svelte";
+  import FilesPage from "./pages/Files.svelte";
 
   //import UtilitiesPage from "./pages/Utilities.svelte";
   //import LogPage from "./pages/Log.svelte";
@@ -43,7 +44,7 @@
   //****************************************************variable section**********************************************************/
   //******************************************************************************************************************************/
   let myip = document.location.hostname;
-  if (devMode) myip = "192.168.1.101";
+  if (devMode) myip = "192.168.1.197";
 
   //Flags
   let firstDevListRequest = true;
@@ -64,6 +65,7 @@
   let connectionReady = false;
   let listReady = false;
   let systemReady = false;
+  let devReady = false;
 
   //update esp
   let versionsList = {};
@@ -577,6 +579,12 @@
       if (debug) console.log("✔✔", "system data parced");
       systemReady = true;
     }
+    if (currentPageName === "/dev|" && errorsJsonParced && settingsJsonParced && configJsonParced && itemsJsonParced) {
+      clearParcedFlags();
+      getVersionsList();
+      if (debug) console.log("✔✔", "dev data parced");
+      devReady = true;
+    }
   }
 
   function saveConfig() {
@@ -620,7 +628,7 @@
   function getInput() {
     let input = {
       name: "inputDate",
-      descr: "Выберите дату",
+      //descr: "Выберите дату",
       widget: "input",
       size: "small",
       color: "orange",
@@ -648,9 +656,9 @@
           if (widget.widget === "chart") {
             let input = getInput();
             input.page = config.page;
-            let topic = settingsJson.root + "/" + config.id + "-date";
+            input.topic = settingsJson.root + "/" + config.id + "-date";
-            input.topic = topic;
+            input.descr = config.descr;
-            console.log("[i]", "topic ", topic);
+            console.log("[i]", "topic ", widget.topic);
             layout.push(input);
           }
           error = false;
@@ -1149,6 +1157,9 @@
         <li>
           <a class="menu__item" href="/dev">{"Разработчик"}</a>
         </li>
+        <li>
+          <a class="menu__item" href="/files">{"Файлы"}</a>
+        </li>
       {/if}
     </ul>
   </nav>
@@ -1176,7 +1187,10 @@
           </Route>
           {#if devMode}
             <Route path="/dev">
-              <DevPage show={systemReady} layoutJson={layoutJson} errorsJson={errorsJson} settingsJson={settingsJson} configJson={configJson} itemsJson={itemsJson} />
+              <DevPage show={devReady} layoutJson={layoutJson} errorsJson={errorsJson} settingsJson={settingsJson} configJson={configJson} itemsJson={itemsJson} />
+            </Route>
+            <Route path="/files">
+              <FilesPage show={systemReady} />
             </Route>
           {/if}
         {/if}

src/pages/Config.svelte

@@ -19,8 +19,6 @@
   export let rebootEsp = () => {};
   export let cleanLogs = () => {};
 
-  let hideAllSubParams = true;
-
   function elementsDropdownChange() {
     for (let i = 0; i < itemsJson.length; i++) {
       let item = Object.assign({}, itemsJson[i]);
@@ -100,10 +98,10 @@
                 </select></td>
               <td class="tbl-bdy-lg"><input bind:value={element.page} class="ipt-lg w-full" type="text" /></td>
               <td class="tbl-bdy-lg"><input bind:value={element.descr} class="ipt-lg w-full" type="text" /></td>
-              <td class="tbl-bdy-lg"><OpenIcon click={() => (hideAllSubParams = !hideAllSubParams)} /></td>
+              <td class="tbl-bdy-lg"><OpenIcon click={() => (element.show = !element.show)} /></td>
               <td class="tbl-bdy-lg"><CrossIcon click={() => deleteLineFromConfig(i)} /></td>
             </tr>
-            {#if !hideAllSubParams}
+            {#if element.show}
               {#each Object.entries(element) as [key, param]}
                 {#if key != "type" && key != "subtype" && key != "id" && key != "widget" && key != "page" && key != "descr"}
                   <tr class="txt-sz txt-pad">
@@ -127,7 +125,7 @@
     </Card>
 
     <Card title="Сценарии">
-      <textarea bind:value={scenarioJson.scen} rows={height} cols="50" class="px-2 bg-gray-50 border-2 border-gray-200 rounded text-gray-700 leading-tight focus:outline-none focus:bg-white focus:border-indigo-500 w-full" />
+      <textarea bind:value={scenarioJson.scen} rows={height} class="px-2 bg-gray-50 border-2 border-gray-200 rounded text-gray-700 leading-tight focus:outline-none focus:bg-white focus:border-indigo-500 w-full" />
     </Card>
   </div>
   <div class="grd-1col1">

src/pages/Dev.svelte

@@ -14,8 +14,8 @@
     return json;
   };
 
-  export let errorsJson;
   export let layoutJson;
+  export let errorsJson;
   export let settingsJson;
   export let configJson;
   export let itemsJson;
@@ -23,18 +23,18 @@
 
 <div class="grd-3col1">
   <Card title="layoutJson">
-    <textarea on:input={layoutJson} rows="23" cols="50" id="1">{syntaxHighlight(JSON.stringify(layoutJson))}</textarea>
+    <textarea on:input={layoutJson} rows="23" class="w-full" id="1">{syntaxHighlight(JSON.stringify(layoutJson))}</textarea>
   </Card>
   <Card title="errorsJson">
-    <textarea on:input={errorsJson} rows="23" cols="50" id="2">{syntaxHighlight(JSON.stringify(errorsJson))}</textarea>
+    <textarea on:input={errorsJson} rows="23" class="w-full" id="2">{syntaxHighlight(JSON.stringify(errorsJson))}</textarea>
   </Card>
   <Card title="settingsJson">
-    <textarea on:input={settingsJson} rows="23" cols="50" id="3">{syntaxHighlight(JSON.stringify(settingsJson))}</textarea>
+    <textarea on:input={settingsJson} rows="23" class="w-full" id="3">{syntaxHighlight(JSON.stringify(settingsJson))}</textarea>
   </Card>
   <Card title="configJson">
-    <textarea on:input={configJson} rows="23" cols="50" id="3">{syntaxHighlight(JSON.stringify(configJson))}</textarea>
+    <textarea on:input={configJson} rows="23" class="w-full" id="3">{syntaxHighlight(JSON.stringify(configJson))}</textarea>
   </Card>
   <Card title="itemsJson">
-    <textarea on:input={itemsJson} rows="23" cols="50" id="3">{syntaxHighlight(JSON.stringify(itemsJson))}</textarea>
+    <textarea on:input={itemsJson} rows="23" class="w-full" id="4">{syntaxHighlight(JSON.stringify(itemsJson))}</textarea>
   </Card>
 </div>

src/pages/Files.svelte

@@ -0,0 +1,9 @@
+<script>
+  import Card from "../components/Card.svelte";
+</script>
+
+<div class="grd-3col1">
+  <Card title="layoutJson">
+    <p>123</p>
+  </Card>
+</div>

src/pages/System.svelte

@@ -245,6 +245,14 @@
           <p class="text-green-500 font-bold text-center truncate">{errorsJson.heap}</p>
         </div>
       </div>
+      <div class="flex mb-2 h-6 items-center">
+        <div class="w-2/3">
+          <p class="pr-4 text-gray-500 font-bold text-sm truncate">Остаток flash</p>
+        </div>
+        <div class="flex justify-center w-1/3 text-sm text-center">
+          <p class="text-green-500 font-bold text-center truncate">{errorsJson.freeBytes}</p>
+        </div>
+      </div>
       <div class="flex mb-2 h-6 items-center">
         <div class="w-2/3">
           <p class="pr-4 text-gray-500 font-bold text-sm truncate">Кол-во записей на flash</p>