add setting page

views/dashboard/index.ejs

@@ -9,13 +9,17 @@
           <div class="item">
             <div class="header">系統功能</div>
             <div class="menu">
-              <a href="#" class="item">Func1</a>
+              <a href="/setting" class="item <%= route == 'setting' ? 'active' : '' %>">修改設定</a>
             </div>
           </div>
         </div>
       </div>
       <div class="thirteen wide column">
+        <% if(route == 'index'){ %>
         <%- include statusview.ejs %>
+        <% } else { %>
+        <%- include setting.ejs %>
+        <% } %>
       </div>
     </div>
   </div>

views/dashboard/setting.ejs

@@ -0,0 +1,121 @@
+
+<div class="ui container" style="padding-top: 20px;">
+    <h1 class="ui header">系統安裝設定</h1>
+    <form id="setup" class="ui form">
+      <h3 class="ui dividing header">印表機設定</h3>
+      <div class="field">
+        <label for="tty">印表機連接埠</label>
+        <select name="tty" id="tty">
+          <option value="">選擇裝置</option>
+          <% for(let i of ttys) { %>
+            <option value="<%= i %>" <%= ttys[i] == defConfig.printer.serial ? 'selected' : '' %>><%= i %></option>
+          <% } %>
+        </select>
+      </div>
+      <div class="field">
+        <label for="feed">切紙前空行</label>
+        <input type="text" name="feed" value="<%= defConfig.printer.feed %>" id="feed">
+      </div>
+      <div class="field">
+        <button class="ui button mini" type="button" id="test-printer">測試印表機</button>
+      </div>
+  
+      <h3 class="ui dividing header">藍芽列印設定</h3>
+      <div class="field">
+        <div class="ui checkbox">
+          <input type="checkbox" class="hidden" id="en-ble" <%= defConfig.ble.enable ? 'checked' : '' %>>
+          <label for="en-ble">啟用藍芽</label>
+        </div>
+      </div>
+  
+      <div style="margin-top: 40px; text-align: right;">
+        <button class="ui button blue" type="submit">送出設定</button>
+      </div>
+    </form>
+  </div>
+  
+  <div class="ui dimmer" id="loader">
+    <div class="ui loader text">Rebooting...</div>
+  </div>
+  
+  <script>
+    function getValue(obj){
+      if(!obj || !('value' in obj)) return ''
+      return obj.value
+    }
+  
+    $('#test-printer').click(function(){
+      let json = {
+        device: '',
+        feed: 0
+      }
+      let dev = getValue(document.querySelector('select#tty'))
+      let feed = getValue(document.querySelector('input#feed'))
+  
+      if(!dev) return alert('請選擇印表機連接埠')
+      if (!isFinite(feed) || feed < 0) return alert('切紙前空行請輸入整數')
+  
+      json.device = dev
+      json.feed = Math.floor(parseInt(feed))
+  
+      $.ajax({
+        url: '/api/printer_test',
+        type: 'post',
+        data: json,
+        success: function(e){
+          alert(e.msg || '資料傳送失敗')
+        }
+      })
+  
+    })
+  
+    $('form#setup').submit(function(e) {
+      e.preventDefault()
+  
+      let json = {
+        tty: '',
+        feed: 0,
+        ble: ''
+      }
+      let dev = getValue(document.querySelector('select#tty'))
+      let feed = getValue(document.querySelector('input#feed'))
+      let elBle = document.querySelector('input#en-ble')
+      let ble = ''
+      if(elBle != null && 'checked' in elBle) ble = elBle.checked ? 'yes' : 'no'
+  
+      if(!dev) return alert('請選擇印表機連接埠')
+      if (!isFinite(feed) || feed < 0) return alert('切紙前空行請輸入整數')
+  
+      json.tty = dev
+      json.feed = Math.floor(parseInt(feed))
+      json.ble = ble
+  
+      $.ajax({
+        url: '/api/write_config',
+        type: 'post',
+        data: json,
+        success: function(e){
+          if(e.status != 1) {
+            alert(e.msg || '寫入失敗')
+            return
+          }
+  
+          $.ajax({
+            url: '/reboot_sys',
+            type: 'put',
+            success: function(){
+              setTimeout(function(){
+                location.replace('/')
+              }, 30000)
+              $('#loader').addClass('active')
+            },
+            error: function(){
+              alert('系統重新啟動失敗')
+            }
+          })
+        }
+      })
+  
+      return false
+    })
+  </script>