settings.ejs 2.2 KB

123456789101112131415161718192021222324252627282930313233343536373839404142434445
  1. <!doctype html>
  2. <html lang="zh-CN">
  3. <head>
  4. <meta charset="utf-8">
  5. <meta name="viewport" content="width=device-width, initial-scale=1">
  6. <title><%= title %></title>
  7. <link rel="stylesheet" href="/styles.css">
  8. </head>
  9. <body>
  10. <%- include('partials/nav') %>
  11. <main>
  12. <section class="hero tile-light compact page-intro">
  13. <p class="eyebrow">Settings</p>
  14. <h1>系统设置</h1>
  15. <p class="lead">设备 ID 可单独配置,Topic 会自动生成。</p>
  16. </section>
  17. <% if (message) { %><div class="notice"><%= message %></div><% } %>
  18. <% if (error) { %><div class="notice notice-error"><%= error %></div><% } %>
  19. <section class="tile-parchment compact">
  20. <article class="utility-card wide">
  21. <form method="post" action="/settings" class="form-grid">
  22. <label>MQTT 地址<input name="mqtt_url" value="<%= config.mqtt_url %>" required></label>
  23. <label>Topic 版本<input name="topic_version" value="<%= config.topic_version %>" required></label>
  24. <label>产品标识<input name="product_key" value="<%= config.product_key %>" required></label>
  25. <label>设备 ID<input name="device_id" value="<%= config.device_id %>" required></label>
  26. <label>Web 端口<input name="server_port" type="number" value="<%= config.server_port %>" required></label>
  27. <label>日志保留天数<input name="log_retention_days" type="number" min="1" value="<%= config.log_retention_days %>" required></label>
  28. <% states.forEach((state) => { %>
  29. <label>灯<%= state.channel %> 名称<input name="channel_<%= state.channel %>_name" value="<%= state.name %>" required></label>
  30. <% }) %>
  31. <div class="form-actions">
  32. <button class="button-primary">保存设置</button>
  33. </div>
  34. </form>
  35. </article>
  36. <article class="utility-card wide topic-preview">
  37. <h2>当前 Topic</h2>
  38. <p>查询/控制:<code><%= topicConfig.commandPrefix %>/Power0</code></p>
  39. <p>状态回执:<code><%= topicConfig.statusTopic %></code></p>
  40. <p>设备上报:<code><%= topicConfig.telemetryTopic %></code></p>
  41. </article>
  42. </section>
  43. </main>
  44. </body>
  45. </html>