peel_container.html 25 KB

123456789101112131415161718192021222324252627282930313233343536373839404142434445464748495051525354555657585960616263646566676869707172737475767778798081828384858687888990919293949596979899100101102103104105106107108109110111112113114115116117118119120121122123124125126127128129130131132133134135136137138139140141142143144145146147148149150151152153154155156157158159160161162163164165166167168169170171172173174175176177178179180181182183184185186187188189190191192193194195196197198199200201202203204205206207208209210211212213214215216217218219220221222223224225226227228229230231232233234235236237238239240241242243244245246247248249250251252253254255256257258259260261262263264265266267268269270271272273274275276277278279280281282283284285286287288289290291292293294295296297298299300301302303304305306307308309310311312313314315316317318319320321322323324325326327328329330331332333334335336337338339340341342343344345346347348349350351352353354355356357358359360361362363364365366367368369370371372373374375376377378379380381382383384385386387388389390391392393394395396397398399400401402403404405406407408409410411412413414415416417418419420421422423424425426427428429430431432433434435436437438439440441442443444445446447448449450451452453454455456457458459460461462463464465466467468469470471472473474475476477478479480481482483484485486487488489490491492493494495496497498499500501502503504505506507508509510511512513514515516517518519520521522523524525526527528529530531532533534535536537538539540541542543544545546547548549550551552553554555556557558559560561562563564565566567568569570571572573574575576577578579580581582583584585586587588589590591592593594595596597598599600601602603604605606607608609610611612613614615616617618619620621622623624625626627628629630631632633634635636637638639640641642643644645646647648649650651652653654655656657658659660661662663664665666667668669670671672673674675676677678679680681
  1. <!DOCTYPE html>
  2. <html lang="en">
  3. <head>
  4. <meta charset="UTF-8">
  5. <title>{{ title }}</title>
  6. <meta name="viewport" content="width=device-width, initial-scale=1, shrink-to-fit=no">
  7. <!-- 新 Bootstrap4 核心 CSS 文件 -->
  8. <link rel="stylesheet" href="https://cdn.bootcss.com/bootstrap/4.1.0/css/bootstrap.min.css">
  9. <!-- jQuery文件。务必在bootstrap.min.js 之前引入 -->
  10. <script src="https://cdn.bootcss.com/jquery/3.2.1/jquery.min.js"></script>
  11. <!-- popper.min.js 用于弹窗、提示、下拉菜单 -->
  12. <script src="https://cdn.bootcss.com/popper.js/1.12.5/umd/popper.min.js"></script>
  13. <!-- 最新的 Bootstrap4 核心 JavaScript 文件 -->
  14. <script src="https://cdn.bootcss.com/bootstrap/4.1.0/js/bootstrap.min.js"></script>
  15. <!--可用來建立使用者小圖示-->
  16. <link rel="stylesheet" href="https://cdnjs.cloudflare.com/ajax/libs/font-awesome/4.7.0/css/font-awesome.min.css">
  17. <script language="JavaScript">
  18. // 指定 10秒 刷新網頁一次
  19. var ptid = '{{tid}}';
  20. console.log('ptid:' + ptid)
  21. WebUpdate_set = setInterval(function(){WebUpdate(ptid)} , 5 * 1000)
  22. </script>
  23. <style>
  24. body {
  25. margin: 0;
  26. }
  27. input[type="button"] {
  28. padding: 4px 15px;
  29. background: #f3f3f3;
  30. border: 0 none;
  31. cursor: pointer;
  32. -webkit-border-radius: 5px;
  33. border-radius: 5px;
  34. }
  35. .navbar-dark .navbar-nav .nav-link {
  36. color: white;
  37. cursor: pointer;
  38. text-decoration: none;
  39. width: 110px;
  40. height: 46px;
  41. }
  42. .nav-top {
  43. line-height: 40px;
  44. background-color: #C4C4C4;
  45. }
  46. .website_title {
  47. font-family: Roboto;
  48. font-style: normal;
  49. font-weight: normal;
  50. font-size: 30px;
  51. color: #000000;
  52. }
  53. .navbar-nav>li {
  54. float: none;
  55. display: inline-block;
  56. width: 70px;
  57. margin: 0 auto;
  58. text-align: center;
  59. }
  60. .navbar-nav>li a {
  61. font-size: 20px;
  62. }
  63. .main-page {
  64. margin-top: 200px;
  65. }
  66. .page-title {
  67. font-family: Roboto;
  68. font-style: normal;
  69. font-weight: bold;
  70. font-size: 36px;
  71. }
  72. .flex {
  73. display: flex;
  74. flex-direction: row;
  75. flex-wrap: wrap;
  76. justify-content: center;
  77. }
  78. .set-link {
  79. display: inline-block;
  80. width: 350px;
  81. height: 70px;
  82. line-height: 70px;
  83. background: #008CBA;
  84. border: 1px solid #CFCFCF;
  85. box-sizing: border-box;
  86. color: #FFFFFF;
  87. border-radius: 10px;
  88. font-size: 36px;
  89. }
  90. .cmn-toggle {
  91. position: absolute;
  92. margin-left: 0px;
  93. visibility: hidden;
  94. }
  95. .cmn-toggle+label {
  96. display: block;
  97. position: relative;
  98. cursor: pointer;
  99. outline: none;
  100. user-select: none;
  101. }
  102. input.cmn-toggle-round-flat+label {
  103. padding: 2px;
  104. width: 60px;
  105. height: 30px;
  106. background-color: #C0C0C0;
  107. border-radius: 60px;
  108. transition: background 0.4s;
  109. }
  110. input.cmn-toggle-round-flat+label:before,
  111. input.cmn-toggle-round-flat+label:after {
  112. display: block;
  113. position: absolute;
  114. content: "";
  115. }
  116. input.cmn-toggle-round-flat+label:before {
  117. top: 2px;
  118. left: 2px;
  119. bottom: 2px;
  120. right: 2px;
  121. background-color: #fff;
  122. border-radius: 60px;
  123. transition: background 0.4s;
  124. }
  125. input.cmn-toggle-round-flat+label:after {
  126. top: 4px;
  127. left: 4px;
  128. bottom: 4px;
  129. width: 24px;
  130. background-color: #dddddd;
  131. border-radius: 52px;
  132. transition: margin 0.4s, background 0.4s;
  133. }
  134. input.cmn-toggle-round-flat:checked+label {
  135. background-color: #C0C0C0;
  136. }
  137. input.cmn-toggle-round-flat:checked+label:after {
  138. margin-left: 27px;
  139. background-color: #008CBA;
  140. }
  141. @media(max-width:373px) {
  142. .card {
  143. margin-right: 0px;
  144. }
  145. .set-link {
  146. width: 250px;
  147. }
  148. }
  149. @media(max-width:577px) {}
  150. @media(min-width:576px) {}
  151. @media(min-width:768px) {
  152. .navbar-nav>li {
  153. margin-left: 0px;
  154. }
  155. .navbar-nav .li-block {
  156. display: none;
  157. }
  158. }
  159. @media(min-width:991px) {
  160. .navbar-nav>li {
  161. margin-left: 20px;
  162. }
  163. .navbar-nav .li-block {
  164. display: none;
  165. }
  166. }
  167. @media(min-width:1200px) {
  168. .navbar-nav>li {
  169. margin-left: 50px;
  170. }
  171. .navbar-nav .li-block {
  172. display: inline-block;
  173. width: 70px;
  174. }
  175. }
  176. @media(min-width:1400px) {
  177. .navbar-nav .li-block {
  178. display: inline-block;
  179. width: 200px;
  180. }
  181. }
  182. @media(min-width:1689px) {
  183. .navbar-nav>li {
  184. margin-left: 50px;
  185. }
  186. .navbar-nav .li-block {
  187. display: inline-block;
  188. width: 500px;
  189. }
  190. }
  191. </style>
  192. <script>
  193. // 清洗浮選 制動器開關
  194. var tank_num = '{{tid}}';
  195. // 入料 真空吸料機
  196. function inputVacuum() {
  197. var status = "off";
  198. var check = $("input[name=input_vacuum_status]:checked"); // 這裡面是 jQuery 撈取資料的方法, jQuery 常使用到 $ 錢字號
  199. console.log('check:', check);
  200. //大於0代表有被選中, 如果有多個可以呈現勾取的項目數量
  201. if (check.length > 0) {
  202. status = "on";
  203. $("#cmn-toggle-62").prop('checked', false); // 確認是否勾選
  204. if (!confirm("你確定要開啟入料儲豆槽真空吸料機嗎?")) {
  205. return false;
  206. };
  207. } else {
  208. $("#cmn-toggle-62").prop('checked', true);
  209. if (!confirm("你確定要關閉入料儲豆槽真空吸料機嗎?")) {
  210. return false;
  211. };
  212. };
  213. var data = { "tank_num": "P" + tank_num, "command": "input_vacuum_status", "value": status };
  214. // jquery 請求 '/mqtt/{{tid}}' 頁面
  215. $.post('/mqtt/{{tid}}', data, function (res) { //res:HTTP response argument to the middleware function
  216. console.log('data:', data)
  217. if (res == 'on') {
  218. $("#cmn-toggle-62").prop('checked', true);
  219. setTimeout("alert('入料儲豆槽真空吸料機_開啟成功!')", 500);
  220. } else if (res == 'off') {
  221. $("#cmn-toggle-62").prop('checked', false);
  222. setTimeout("alert('入料儲豆槽真空吸料機_關閉成功!')", 500);
  223. } else {
  224. alert(res);
  225. };
  226. }, 'text')
  227. };
  228. function inputVacuum_ON() {
  229. var data = { "tank_num": "P" + tank_num, "command": "input_vacuum_status", "value": "on" };
  230. // jquery 請求 '/mqtt/{{tid}}' 頁面
  231. $.post('/mqtt/{{tid}}', data, function (res) {
  232. console.log('data:', data)
  233. if (res == 'on') {
  234. $("#cmn-toggle-62").prop('checked', true);
  235. } else if (res == 'off') {
  236. $("#cmn-toggle-62").prop('checked', false);
  237. } else {
  238. };
  239. }, 'text')
  240. };
  241. function inputVacuum_OFF() {
  242. var data = { "tank_num": "P" + tank_num, "command": "input_vacuum_status", "value": "off" };
  243. // jquery 請求 '/mqtt/{{tid}}' 頁面
  244. $.post('/mqtt/{{tid}}', data, function (res) { //res:HTTP response argument to the middleware function
  245. console.log('data:', data)
  246. if (res == 'on') {
  247. $("#cmn-toggle-62").prop('checked', true);
  248. } else if (res == 'off') {
  249. $("#cmn-toggle-62").prop('checked', false);
  250. } else {
  251. };
  252. }, 'text')
  253. };
  254. // 桶內 真空吸料機
  255. function tankVacuum() {
  256. var status = "off";
  257. var check = $("input[name=tank_vacuum_status]:checked");
  258. console.log('check:', check);
  259. //大於0代表有被選中
  260. if (check.length > 0) {
  261. status = "on";
  262. $("#cmn-toggle-65").prop('checked', false);
  263. if (!confirm("你確定要開啟真空吸料機嗎?")) {
  264. return false;
  265. };
  266. } else {
  267. $("#cmn-toggle-65").prop('checked', true);
  268. if (!confirm("你確定要關閉真空吸料機嗎?")) {
  269. return false;
  270. };
  271. };
  272. var data = { "tank_num": "P" + tank_num, "command": "tank_vacuum_status", "value": status };
  273. $.post('/mqtt/{{tid}}', data, function (res) {
  274. console.log('data:', data)
  275. if (res == 'on') {
  276. $("#cmn-toggle-65").prop('checked', true);
  277. setTimeout("alert('真空吸料機_開啟成功!')", 500);
  278. } else if (res == 'off') {
  279. $("#cmn-toggle-65").prop('checked', false);
  280. setTimeout("alert('真空吸料機_關閉成功!')", 500);
  281. } else {
  282. alert(res);
  283. };
  284. }, 'text')
  285. };
  286. function tankVacuum_ON() {
  287. var data = { "tank_num": "P" + tank_num, "command": "tank_vacuum_status", "value": "on" };
  288. $.post('/mqtt/{{tid}}', data, function (res) {
  289. console.log('data:', data)
  290. if (res == 'on') {
  291. $("#cmn-toggle-65").prop('checked', true);
  292. } else if (res == 'off') {
  293. $("#cmn-toggle-65").prop('checked', false);
  294. } else {
  295. };
  296. }, 'text')
  297. };
  298. function tankVacuum_OFF() {
  299. var data = { "tank_num": "P" + tank_num, "command": "tank_vacuum_status", "value": "off" };
  300. $.post('/mqtt/{{tid}}', data, function (res) {
  301. console.log('data:', data)
  302. if (res == 'on') {
  303. $("#cmn-toggle-65").prop('checked', true);
  304. } else if (res == 'off') {
  305. $("#cmn-toggle-65").prop('checked', false);
  306. } else {
  307. };
  308. }, 'text')
  309. };
  310. // 馬達
  311. function ChangeMotor() {
  312. var motor_data = $("input[id=motor_rpm_data]").val();
  313. if (motor_data == '') {
  314. //$("#cmn-toggle-20").prop('checked', false);
  315. alert("請先輸入要運轉的值!");
  316. return false;
  317. } else if (motor_data == 0) {
  318. alert("轉速 0 為關閉馬達");
  319. } else if (Number(motor_data) < -50 || Number(motor_data) > 50 || !Number(motor_data)) {
  320. //
  321. //$("#cmn-toggle-20").prop('checked', false);
  322. alert("您輸入的值已超過範圍,請重新輸入!" + !Number(motor_data));
  323. return false;
  324. };
  325. var value = "off";
  326. //var check = $("input[name=peeling-machine-on]:checked");
  327. if (motor_data != 0) {
  328. value = motor_data;
  329. //$("#cmn-toggle-20").prop('checked', false);
  330. if (!confirm("你確定要開啟攪拌馬達,運轉速度為 " + motor_data + " RPM 嗎?")) {
  331. return false;
  332. };
  333. } else {
  334. //$("#cmn-toggle-20").prop('checked', true);
  335. if (!confirm("你確定要關閉攪拌馬達嗎?")) {
  336. return false;
  337. };
  338. };
  339. var data = { "tank_num": "P" + tank_num, "command": "tank_motor_status", "value": motor_data };
  340. $.post('/mqtt/{{tid}}', data, function (res) {
  341. console.log('data:', data)
  342. if (res == 'on') {
  343. //$("#cmn-toggle-14").prop('checked', true); // prop 設置元素屬型與元素值, 設定 checked 屬性為 true
  344. setTimeout("alert('攪拌馬達_開啟成功!')", 500); // 設定時間執行函式 delay(500), 只執行一次
  345. var timer = setInterval(Rotate, 60000); // 啟動後會在 60000 毫秒(更新時間一分鐘)內不斷執行 (原因須配合更新時間?)
  346. } else if (res == 'off') {
  347. //$("#cmn-toggle-14").prop('checked', false);
  348. setTimeout("alert('攪拌馬達_關閉成功!')", 500);
  349. clearInterval(timer); // 取消 timer 的不斷執行
  350. $("#motor_rpm_status").text(''); // 設置 #motor_rpm_status 的文字為空, #井字號
  351. } else {
  352. alert(res);
  353. };
  354. }, 'text')
  355. $.get('/loading/D{{tid}}', '', function (res) {
  356. $("#motor_rpm_data").attr("placeholder", res.tank_motor)
  357. }, 'json');
  358. };
  359. function ChangeMotor_ON() {
  360. var data = { "tank_num": "P" + tank_num, "command": "tank_motor_status", "value": "20" };
  361. $.post('/mqtt/{{tid}}', data, function (res) {
  362. console.log('data:', data)
  363. if (res == 'on') {
  364. var timer = setInterval(Rotate, 60000);
  365. } else if (res == 'off') {
  366. clearInterval(timer);
  367. $("#motor_rpm_status").text('');
  368. } else {
  369. };
  370. }, 'text')
  371. }
  372. function ChangeMotor_OFF() {
  373. var data = { "tank_num": "P" + tank_num, "command": "tank_motor_status", "value": "0" };
  374. $.post('/mqtt/{{tid}}', data, function (res) {
  375. console.log('data:', data)
  376. if (res == 'on') {
  377. var timer = setInterval(Rotate, 60000);
  378. } else if (res == 'off') {
  379. clearInterval(timer);
  380. $("#motor_rpm_status").text('');
  381. } else {
  382. };
  383. }, 'text')
  384. }
  385. function Rotate() {
  386. $.get('/peeling', '', function (res) {
  387. //console.log(res.peeling);
  388. $("#motor_rpm_status-status").text(res.peeling + ' rpm(每1分鐘更新一次)');
  389. }, 'json');
  390. setTimeout(function () { location.reload(); }, 500);
  391. };
  392. // 出料 真空吸料機
  393. function outputVacuum() {
  394. var status = "off";
  395. var check = $("input[name=output_vacuum_status]:checked");
  396. //大於0代表有被選中
  397. if (check.length > 0) {
  398. status = "on";
  399. $("#cmn-toggle-71").prop('checked', false);
  400. if (!confirm("你確定要開啟出料儲豆槽真空吸料機嗎?")) {
  401. return false;
  402. };
  403. } else {
  404. $("#cmn-toggle-71").prop('checked', true);
  405. if (!confirm("你確定要關閉出料儲豆槽真空吸料機嗎?")) {
  406. return false;
  407. };
  408. };
  409. var data = { "tank_num": "P" + tank_num, "command": "output_vacuum_status", "value": status };
  410. console.log('data:', data)
  411. $.post('/mqtt/{{tid}}', data, function (res) {
  412. if (res == 'on') {
  413. $("#cmn-toggle-71").prop('checked', true);
  414. setTimeout("alert('出料儲豆槽真空吸料機_開啟成功!')", 500);
  415. } else if (res == 'off') {
  416. $("#cmn-toggle-71").prop('checked', false);
  417. setTimeout("alert('出料儲豆槽真空吸料機_關閉成功!')", 500);
  418. } else {
  419. alert(res);
  420. };
  421. }, 'text')
  422. };
  423. function outputVacuum_ON() {
  424. var data = { "tank_num": "P" + tank_num, "command": "output_vacuum_status", "value": "on" };
  425. console.log('data:', data)
  426. $.post('/mqtt/{{tid}}', data, function (res) {
  427. if (res == 'on') {
  428. $("#cmn-toggle-71").prop('checked', true);
  429. } else if (res == 'off') {
  430. $("#cmn-toggle-71").prop('checked', false);
  431. } else {
  432. };
  433. }, 'text')
  434. };
  435. function outputVacuum_OFF() {
  436. var data = { "tank_num": "P" + tank_num, "command": "output_vacuum_status", "value": "off" };
  437. console.log('data:', data)
  438. $.post('/mqtt/{{tid}}', data, function (res) {
  439. if (res == 'on') {
  440. $("#cmn-toggle-71").prop('checked', true);
  441. } else if (res == 'off') {
  442. $("#cmn-toggle-71").prop('checked', false);
  443. } else {
  444. };
  445. }, 'text')
  446. };
  447. </script>
  448. </head>
  449. <body>
  450. 狀態更新時間(秒):
  451. <input name="webupdate_time" type="text" value="5" style="width:100px;">
  452. <input type="button" value="設定更新時間" onclick="changeUpdate()">
  453. <script language="JavaScript">
  454. function changeUpdate() {
  455. clearInterval(WebUpdate_set);
  456. var webupdate_time = $("input[name=webupdate_time]").val()
  457. console.log('webupdate_time' + webupdate_time)
  458. WebUpdate_set = setInterval(function(){WebUpdate(ptid)} , webupdate_time * 1000);
  459. }
  460. </script>
  461. <h4>制動器</h4>
  462. <table border="1px solid black" style="font-size:18px;" width=100%>
  463. <tr>
  464. <td style="color:red;">Valve</td>
  465. <td>入料<br>真空吸料機</td>
  466. <td>脫皮機入料<br>真空吸料機</td>
  467. <td>馬達</td>
  468. <td>出料<br>真空吸料機</td>
  469. </tr>
  470. <tr>
  471. <td>
  472. <span style="color:#C0C0C0;">off</span>
  473. <span style="color:#008CBA;">on</span>
  474. </td>
  475. <td>
  476. <div class="switch_div">
  477. <div class="switch">
  478. <input id="cmn-toggle-01" class="cmn-toggle cmn-toggle-round" type="checkbox">
  479. <label for="cmn-toggle-01"></label>
  480. </div>
  481. <div class="switch text-center">
  482. {% if input_vacuum== 1 %}
  483. <input id="cmn-toggle-62" class="cmn-toggle cmn-toggle-round-flat" type="checkbox" checked
  484. name="input_vacuum_status" value="ON" onclick="inputVacuum()">
  485. {% else %}
  486. <input id="cmn-toggle-62" class="cmn-toggle cmn-toggle-round-flat" type="checkbox"
  487. name="input_vacuum_status" value="OFF" onclick="inputVacuum()">
  488. {% endif %}
  489. <label for="cmn-toggle-62"></label>
  490. </div>
  491. <div class="switch">
  492. <input id="cmn-toggle-03" class="cmn-toggle cmn-toggle-yes-no" type="checkbox">
  493. <label for="cmn-toggle-03" data-on="Yes" data-off="No"></label>
  494. </div>
  495. </div>
  496. </td>
  497. <td>
  498. <div class="switch_div">
  499. <div class="switch">
  500. <input id="cmn-toggle-04" class="cmn-toggle cmn-toggle-round" type="checkbox">
  501. <label for="cmn-toggle-04"></label>
  502. </div>
  503. <div class="switch text-center">
  504. {% if tank_vacuum== 1 %}
  505. <input id="cmn-toggle-65" class="cmn-toggle cmn-toggle-round-flat" type="checkbox" checked
  506. name="tank_vacuum_status" value="ON" onclick="tankVacuum()">
  507. {% else %}
  508. <input id="cmn-toggle-65" class="cmn-toggle cmn-toggle-round-flat" type="checkbox"
  509. name="tank_vacuum_status" value="OFF" onclick="tankVacuum()">
  510. {% endif %}
  511. <label for="cmn-toggle-65"></label>
  512. </div>
  513. <div class="switch">
  514. <input id="cmn-toggle-06" class="cmn-toggle cmn-toggle-yes-no" type="checkbox">
  515. <label for="cmn-toggle-06" data-on="Yes" data-off="No"></label>
  516. </div>
  517. </div>
  518. </td>
  519. <td>
  520. <input id="motor_rpm_data" type="text" placeholder="{{tank_motor}}" style="width:100px;">RPM (±50)
  521. <span id="motor_rpm_status" style="color:red;"></span>
  522. <br>
  523. <input type="button" value="送出" name="tank_motor_status" onclick="ChangeMotor()">
  524. </td>
  525. <td>
  526. <div class="switch_div">
  527. <div class="switch">
  528. <input id="cmn-toggle-25" class="cmn-toggle cmn-toggle-round" type="checkbox">
  529. <label for="cmn-toggle-25"></label>
  530. </div>
  531. <div class="switch text-center">
  532. {% if output_vacuum== 1 %}
  533. <input id="cmn-toggle-71" class="cmn-toggle cmn-toggle-round-flat" type="checkbox" checked
  534. name="output_vacuum_status" value="ON" onclick="outputVacuum()">
  535. {% else %}
  536. <input id="cmn-toggle-71" class="cmn-toggle cmn-toggle-round-flat" type="checkbox"
  537. name="output_vacuum_status" value="OFF" onclick="outputVacuum()">
  538. {% endif %}
  539. <label for="cmn-toggle-71"></label>
  540. </div>
  541. <div class="switch">
  542. <input id="cmn-toggle-27" class="cmn-toggle cmn-toggle-yes-no" type="checkbox">
  543. <label for="cmn-toggle-27" data-on="Yes" data-off="No"></label>
  544. </div>
  545. </div>
  546. </td>
  547. </tr>
  548. <tr>
  549. <td><span style="color:#008CBA;"><b>ON</b></span></td>
  550. <td><input type="button" value="ON" name="input_vacuum_ON" onclick="inputVacuum_ON()"></td>
  551. <td><input type="button" value="ON" name="tank_vacuum_ON" onclick="tankVacuum_ON()"></td>
  552. <td><input type="button" value="ON" onclick="ChangeMotor_ON()"></td>
  553. <td><input type="button" value="ON" name="output_vacuum_ON" onclick="outputVacuum_ON()"></td>
  554. </tr>
  555. <tr>
  556. <td><span style="color:#C0C0C0;"><b>OFF</b></span></td>
  557. <td><input type="button" value="OFF" name="input_vacuum_OFF" onclick="inputVacuum_OFF()"></td>
  558. <td><input type="button" value="OFF" name="tank_vacuum_OFF" onclick="tankVacuum_OFF()"></td>
  559. <td><input type="button" value="OFF" onclick="ChangeMotor_OFF()"></td>
  560. <td><input type="button" value="OFF" name="output_vacuum_OFF" onclick="outputVacuum_OFF()"></td>
  561. </tr>
  562. </table>
  563. <br>
  564. <h4>感測器</h4>
  565. <table style="font-size:18px; border:2px #cccccc solid;" cellpadding="10" border='1' width=100%>
  566. <tr>
  567. <td>
  568. 暫無
  569. </td>
  570. </tr>
  571. </table>
  572. <br>
  573. <h4>排程測試</h4>
  574. <table style="font-size:18px; border:2px #cccccc solid;" cellpadding="10" border='1' width=100%>
  575. <tr>
  576. <td>暫無</td>
  577. </tr>
  578. </table>
  579. </body>
  580. <script>
  581. // jQuery 更新感測器制動器狀態
  582. function WebUpdate(ptid) {
  583. $.get('/loading/P' + ptid, '', function (res) {
  584. if (res.tank_vacuum == 0) {
  585. $("#cmn-toggle-65").prop('checked', false);
  586. } else if (res.tank_vacuum == 1) {
  587. $("#cmn-toggle-65").prop('checked', true);
  588. }
  589. $("#motor_rpm_data").attr("placeholder", res.tank_motor);
  590. // console.log("res.tank_motor"+res.tank_motor)
  591. }, 'json');
  592. }
  593. </script>
  594. </html>