dry_block_empty.html 87 KB

12345678910111213141516171819202122232425262728293031323334353637383940414243444546474849505152535455565758596061626364656667686970717273747576777879808182838485868788899091929394959697989910010110210310410510610710810911011111211311411511611711811912012112212312412512612712812913013113213313413513613713813914014114214314414514614714814915015115215315415515615715815916016116216316416516616716816917017117217317417517617717817918018118218318418518618718818919019119219319419519619719819920020120220320420520620720820921021121221321421521621721821922022122222322422522622722822923023123223323423523623723823924024124224324424524624724824925025125225325425525625725825926026126226326426526626726826927027127227327427527627727827928028128228328428528628728828929029129229329429529629729829930030130230330430530630730830931031131231331431531631731831932032132232332432532632732832933033133233333433533633733833934034134234334434534634734834935035135235335435535635735835936036136236336436536636736836937037137237337437537637737837938038138238338438538638738838939039139239339439539639739839940040140240340440540640740840941041141241341441541641741841942042142242342442542642742842943043143243343443543643743843944044144244344444544644744844945045145245345445545645745845946046146246346446546646746846947047147247347447547647747847948048148248348448548648748848949049149249349449549649749849950050150250350450550650750850951051151251351451551651751851952052152252352452552652752852953053153253353453553653753853954054154254354454554654754854955055155255355455555655755855956056156256356456556656756856957057157257357457557657757857958058158258358458558658758858959059159259359459559659759859960060160260360460560660760860961061161261361461561661761861962062162262362462562662762862963063163263363463563663763863964064164264364464564664764864965065165265365465565665765865966066166266366466566666766866967067167267367467567667767867968068168268368468568668768868969069169269369469569669769869970070170270370470570670770870971071171271371471571671771871972072172272372472572672772872973073173273373473573673773873974074174274374474574674774874975075175275375475575675775875976076176276376476576676776876977077177277377477577677777877978078178278378478578678778878979079179279379479579679779879980080180280380480580680780880981081181281381481581681781881982082182282382482582682782882983083183283383483583683783883984084184284384484584684784884985085185285385485585685785885986086186286386486586686786886987087187287387487587687787887988088188288388488588688788888989089189289389489589689789889990090190290390490590690790890991091191291391491591691791891992092192292392492592692792892993093193293393493593693793893994094194294394494594694794894995095195295395495595695795895996096196296396496596696796896997097197297397497597697797897998098198298398498598698798898999099199299399499599699799899910001001100210031004100510061007100810091010101110121013101410151016101710181019102010211022102310241025102610271028102910301031103210331034103510361037103810391040104110421043104410451046104710481049105010511052105310541055105610571058105910601061106210631064106510661067106810691070107110721073107410751076107710781079108010811082108310841085108610871088108910901091109210931094109510961097109810991100110111021103110411051106110711081109111011111112111311141115111611171118111911201121112211231124112511261127112811291130113111321133113411351136113711381139114011411142114311441145114611471148114911501151115211531154115511561157115811591160116111621163116411651166116711681169117011711172117311741175117611771178117911801181118211831184118511861187118811891190119111921193119411951196119711981199120012011202120312041205120612071208120912101211121212131214121512161217121812191220122112221223122412251226122712281229123012311232123312341235123612371238123912401241124212431244124512461247124812491250125112521253125412551256125712581259126012611262126312641265126612671268126912701271127212731274127512761277127812791280128112821283128412851286128712881289129012911292129312941295129612971298129913001301130213031304130513061307130813091310131113121313131413151316131713181319132013211322132313241325132613271328132913301331133213331334133513361337133813391340134113421343134413451346134713481349135013511352135313541355135613571358135913601361136213631364136513661367136813691370137113721373137413751376137713781379138013811382138313841385138613871388138913901391139213931394139513961397139813991400140114021403140414051406140714081409141014111412141314141415141614171418141914201421142214231424142514261427142814291430
  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. <!-- W3 CSS 樣式 -->
  18. <link rel="stylesheet" href="https://www.w3schools.com/w3css/4/w3.css">
  19. <script language="JavaScript">
  20. // 指定 秒 刷新網頁一次
  21. var dtn = '{{tid}}';
  22. var status = '{{status}}';
  23. console.log('dtn:' + dtn)
  24. $(function(){
  25. $("#coffee_title_pc").text("乾燥槽積木程式介面");
  26. $("#coffee_title_phone").text("乾燥槽積木");
  27. if (status == 2) {
  28. $('input').prop('disabled', true);
  29. $('button').prop('disabled', true);
  30. } else if ( (status == 0) || (status == 1) ) {
  31. $('input').prop('disabled', false);
  32. $('button').prop('disabled', false);
  33. }
  34. });
  35. var Z;
  36. var X;
  37. var Y;
  38. var TT = {}; // 將總條件句/附加條件句/物件動作句存入 字典, 後續傳給 dry_block_format 再組合
  39. // DRY_CONTAINER_STATUS 讓 do_act / dry_object 判斷用
  40. const DRY_CONTAINER_STATUS = {'空桶等待':'D_Waiting',
  41. '入豆中':'D_InputtingBean',
  42. '入豆暫停':'D_InputtingBean_Pause',
  43. '入豆完成':'D_InputtingBean_Finish',
  44. '夾層入水':'D_InputtingWater',
  45. '乾燥':'D_Drying',
  46. '可出豆':'D_OutputtingBean'}
  47. </script>
  48. <style>
  49. .newcondition_css {
  50. padding: 10px;
  51. margin-top: 10px;
  52. background-color:honeydew;
  53. }
  54. hr {
  55. margin-top: 5px;
  56. margin-bottom: 5px;
  57. }
  58. .input-cond-delete {
  59. background: #E43030;
  60. border: 1px solid #CFCFCF;
  61. box-sizing: border-box;
  62. border-radius: 5px;
  63. margin-left: 5px;
  64. width: 65px;
  65. height: 33px;
  66. font-size: 16px;
  67. text-align: center;
  68. line-height: 16px;
  69. color: #FFFFFF;
  70. }
  71. .input-cond-add {
  72. background: #008CBA;
  73. border: 1px solid #CFCFCF;
  74. box-sizing: border-box;
  75. border-radius: 5px;
  76. margin-left: 5px;
  77. width: 65px;
  78. height: 33px;
  79. font-size: 16px;
  80. text-align: center;
  81. line-height: 16px;
  82. color: #FFFFFF;
  83. }
  84. .input-act-add {
  85. background: #008CBA;
  86. border: 1px solid #CFCFCF;
  87. box-sizing: border-box;
  88. border-radius: 5px;
  89. margin-left: 5px;
  90. width: 100px;
  91. height: 33px;
  92. font-size: 16px;
  93. text-align: center;
  94. line-height: 16px;
  95. color: #FFFFFF;
  96. }
  97. .input-act-delete {
  98. background: #E43030;
  99. border: 1px solid #CFCFCF;
  100. box-sizing: border-box;
  101. border-radius: 5px;
  102. margin-left: 5px;
  103. width: 100px;
  104. height: 33px;
  105. font-size: 16px;
  106. text-align: center;
  107. line-height: 16px;
  108. color: #FFFFFF;
  109. }
  110. .input-add {
  111. background: #008CBA;
  112. border: 1px solid #CFCFCF;
  113. box-sizing: border-box;
  114. border-radius: 5px;
  115. margin-left: 5px;
  116. margin-top: 5px;
  117. width: 150px;
  118. height: 40px;
  119. font-size: 18px;
  120. text-align: center;
  121. line-height: 16px;
  122. color: #FFFFFF;
  123. }
  124. .input-delete {
  125. background: #E43030;
  126. border: 1px solid #CFCFCF;
  127. box-sizing: border-box;
  128. border-radius: 5px;
  129. margin-left: 5px;
  130. margin-top: 5px;
  131. width: 150px;
  132. height: 40px;
  133. font-size: 18px;
  134. text-align: center;
  135. line-height: 16px;
  136. color: #FFFFFF;
  137. }
  138. select {
  139. font-size: 24px;
  140. height: 30px;
  141. padding: 2px 5px;
  142. margin-left: 5px;
  143. }
  144. .input-sensor-text {
  145. width: 80px;
  146. height: 25px;
  147. text-align: center;
  148. }
  149. .input-actuator-text {
  150. width: 80px;
  151. height: 25px;
  152. text-align: center;
  153. }
  154. /* 0325 radio button 測試 */
  155. #radio input[type="radio"] {display: none; }
  156. #radio input:checked + .button {background: #5e7380; color: #fff; cursor: default; }
  157. #radio .button {display: inline-block; margin: 0 5px 10px 0; padding: 5px 10px; background: #f7f7f7; color: #333; cursor: pointer; }
  158. #radio .button:hover {background: #bbb; color: #fff; }
  159. #radio .round {border-radius: 5px; }
  160. /* 0325 radio button 測試 */
  161. /* https://rookiesavior.net/2020/12/08/css-accordion-effect/ */
  162. * {
  163. box-sizing: border-box;
  164. }
  165. .accordion {
  166. width: auto;
  167. /* width: 600px; */
  168. /* margin: 80px auto 0; */
  169. }
  170. .accordion label {
  171. display: block;
  172. width: 100%;
  173. text-align: left;
  174. border-radius: 5px;
  175. background-color: #ccc;
  176. margin-top: 10px;
  177. padding: 6px 10px;
  178. cursor: pointer;
  179. }
  180. .content {
  181. height: 0px;
  182. background-color: #fff;
  183. overflow: hidden;
  184. transition: 0.5s;
  185. }
  186. input[type=checkbox]{
  187. display: none;
  188. }
  189. input[type=checkbox]:checked + .content {
  190. /* 被選取的input[type=checkbox]
  191. 的下一個 .content 背景變成橘色。 #fa0; */
  192. background-color: rgb(255, 198, 83);
  193. height: auto;
  194. /* height: 100px; */
  195. padding: 10px 10px 10px 20px;
  196. }
  197. .content00 {
  198. height: 0px;
  199. background-color: #fff;
  200. overflow: hidden;
  201. transition: 0.5s;
  202. }
  203. input[type=checkbox]:checked + .content00 {
  204. /* 被選取的input[type=checkbox]
  205. 的下一個 .content 背景變成橘色。 */
  206. background-color: rgb(255, 236, 199);
  207. height: auto;
  208. /* height: 100px; */
  209. }
  210. label {
  211. content: "+";
  212. }
  213. </style>
  214. </head>
  215. <body style="font-size: 18px;">
  216. <div id="wrapper">
  217. <div id="coffee_header">
  218. <!-- 匯入共同使用的 header.html 內容 -->
  219. {% include 'header.html' %}
  220. </div>
  221. <!-- [物件]文字輸入框 選擇後連結 [動作]文字輸入框 -->
  222. <script>
  223. dry_object = new Array();
  224. dry_object[0] = ["-"]; // 制動器 / 感測器
  225. dry_object[1] = ["on", "off"]; // 入料儲豆槽真空吸料機
  226. dry_object[2] = ["on", "off"]; // 真空吸料機
  227. dry_object[3] = ["ON 吸料", "OFF 排氣"]; // 吸料機三通閥
  228. dry_object[4] = ["on", "off"]; // 消毒電磁閥
  229. // dry_object[5] = ["0", "10", "20", "30", "40", "50"]; // 馬達
  230. dry_object[6] = ["on", "off"]; // 桶外進水電磁閥
  231. dry_object[7] = ["on", "off"]; // 廢水排水電磁閥
  232. dry_object[8] = ["on", "off"]; // 加熱棒 1
  233. dry_object[9] = ["on", "off"]; // 加熱棒 2
  234. dry_object[10] = ["on", "off"]; // 溫控開關
  235. // dry_object[11] = ["on", "off"]; // 溫度設定
  236. dry_object[12] = ["on", "off"]; // 蝴蝶閥
  237. dry_object[13] = ["on", "off"]; // 出料儲豆槽真空吸料機
  238. dry_object[14] = ["on", "off"]; // 電磁開關
  239. dry_object[15] = ["on", "off"]; // 緊急開關
  240. dry_object[16] = ["on", "off"]; // 攝影機
  241. dry_object[17] = ["on", "off"]; // 警示燈
  242. // dry_object[18] = ["1", "5", "10", "30", "60"]; // 暫停秒數
  243. dry_object[19] = ["空桶等待", "入豆中", "入豆暫停", "入豆完成", "夾層入水", "乾燥", "可出豆"]; // 暫停秒數
  244. function renew(obj_num, index) {
  245. var Value = '';
  246. try {
  247. Value = '<select id="do_act' + obj_num + '">';
  248. for(var i=0; i<dry_object[index].length; i++){
  249. Value += '<option value=' + dry_object[index][i] + '>' + dry_object[index][i] + '</option>';
  250. }
  251. Value += '</select>';
  252. } catch (e) {
  253. if (e.name == 'TypeError' && index == '5') {
  254. Value = ' 轉速 : ' +
  255. ' <input type="range" style="cursor: pointer;" id="do_act' + obj_num + '" min="-50" max="50" step="5" value="0" oninput="showMotorValue(\'' + obj_num + '\', this.value)" onchange="showMotorValue(\'' + obj_num + '\', this.value)">' +
  256. ' <span id="motorValue_text' + obj_num + '">0</span>';
  257. } else if (e.name == 'TypeError' && index == '11') {
  258. Value = ' 目標溫度 : ' +
  259. ' <input type="range" style="cursor: pointer;" id="do_act' + obj_num + '" min="20.0" max="50.0" step="0.5" value="28.0" oninput="showTempValue(\'' + obj_num + '\', this.value)" onchange="showTempValue(\'' + obj_num + '\', this.value)">' +
  260. ' <span id="tempValue_text' + obj_num + '">28.0</span>';
  261. } else if (e.name == 'TypeError' && index == '18') {
  262. Value = ' 暫停秒數 : ' +
  263. ' <input type="range" style="cursor: pointer;" id="do_act' + obj_num + '" min="5" max="60" step="5" value="10" oninput="showSleepValue(\'' + obj_num + '\', this.value)" onchange="showSleepValue(\'' + obj_num + '\', this.value)">' +
  264. ' <span id="sleepValue_text' + obj_num + '">10s</span>';
  265. }
  266. }
  267. var sectorSelect = document.getElementById("do_action" + obj_num);
  268. if (sectorSelect != null) {
  269. sectorSelect.innerHTML = Value;
  270. }
  271. }
  272. </script>
  273. <!-- 0225 手風琴測試 start -->
  274. - - - 手風琴測試 - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - -<br>
  275. <div class="accordion" style="text-align: left;">
  276. <label for="tab1">乾燥槽 - 空桶等待</label>
  277. <div class="box">
  278. <input type="checkbox" name="tab" id="tab1">
  279. <div class="content">
  280. <!-- Title : <br> -->
  281. <label for="tab1-1">● 制動器初始狀態</label>
  282. <div class="box">
  283. <input type="checkbox" name="tab1" id="tab1-1">
  284. <div class="content00">
  285. 入料儲豆槽真空吸料機
  286. <input type="text" class="input-actuator-text" id="actuatorInput_DW_0" value="off"><br>
  287. <br>
  288. <!-- 0325 radio button 測試 -->
  289. <div id="radio">
  290. <label style="width:fit-content; height: fit-content;"><input type="radio" name="label" value="on" checked="checked"><span class="round button">on</span></label>
  291. <label style="width:fit-content; height: fit-content;"><input type="radio" name="label" value="off"><span class="round button">off</span></label>
  292. </div>
  293. <!-- 0325 radio button 測試 -->
  294. <br>
  295. 真空吸料機<br>
  296. 吸料機三通閥<br>
  297. 消毒電磁閥<br>
  298. 馬達<br>
  299. 桶外進水電磁閥<br>
  300. 廢水排水電磁閥<br>
  301. 加熱棒 1<br>
  302. 加熱棒 2<br>
  303. 溫控開關<br>
  304. 溫度設定<br>
  305. 蝴蝶閥<br>
  306. 出料儲豆槽真空吸料機<br>
  307. 電磁開關<br>
  308. 緊急開關<br>
  309. 攝影機<br>
  310. 警示燈<br>
  311. </div>
  312. </div>
  313. <label for="tab1-2">● 感測器取值頻率 (設定 0 時不取值)</label>
  314. <div class="box">
  315. <input type="checkbox" name="tab1" id="tab1-2">
  316. <div class="content00">
  317. <s>tt溫度擷取頻率
  318. <input type="number" class="input-sensor-text" id="sensorInput_DW_0" min="0" max="3600" step="5" value="10"> 秒</s><br>
  319. 超音波感測器
  320. <input type="number" class="input-sensor-text" id="sensorInput_DW_1" min="0" max="3600" step="5" value="10"> 秒<br>
  321. 大氣壓力計
  322. <input type="number" class="input-sensor-text" id="sensorInput_DW_2" min="0" max="3600" step="5" value="10"> 秒<br>
  323. 馬達編碼器
  324. <input type="number" class="input-sensor-text" id="sensorInput_DW_3" min="0" max="3600" step="5" value="10"> 秒<br>
  325. 溫溼度計_溫度/濕度
  326. <input type="number" class="input-sensor-text" id="sensorInput_DW_4" min="0" max="3600" step="5" value="10"> 秒<br>
  327. 三合一土壤感測器_溫度/濕度/EC
  328. <input type="number" class="input-sensor-text" id="sensorInput_DW_5" min="0" max="3600" step="5" value="10"> 秒<br>
  329. 蝴蝶閥狀態顯示器
  330. <input type="number" class="input-sensor-text" id="sensorInput_DW_6" min="0" max="3600" step="5" value="10"> 秒<br>
  331. 夾層水位計
  332. <input type="number" class="input-sensor-text" id="sensorInput_DW_7" min="0" max="3600" step="5" value="10"> 秒<br>
  333. </div>
  334. </div>
  335. <label for="tab1-3">● 條件動作</label>
  336. <div class="box">
  337. <input type="checkbox" name="tab1" id="tab1-3">
  338. <div class="content00">
  339. <div id="box">
  340. <div id="newcondition_1" class="newcondition_css">
  341. <!-- 總 條件 -->
  342. <div id="condition1">
  343. <!-- 子條件 1_1-->
  344. <div id="condition1_1">
  345. 條件
  346. <select id="cond_z1_1">
  347. <option value="if">if</option>
  348. <option value="elif">elif</option>
  349. <option value="else">else</option>
  350. </select>
  351. <select id="cond_tank1_1">
  352. <option value="D1">乾燥桶 D1</option>
  353. <option value="D2">乾燥桶 D2</option>
  354. <option value="D3">乾燥桶 D3</option>
  355. <option value="D4">乾燥桶 D4</option>
  356. <option value="D5">乾燥桶 D5</option>
  357. <option value="D6">乾燥桶 D6</option>
  358. <option value="D7">乾燥桶 D7</option>
  359. <option value="D8">乾燥桶 D8</option>
  360. <option value="D9">乾燥桶 D9</option>
  361. <option value="D10">乾燥桶 D10</option>
  362. <option value="D11">乾燥桶 D11</option>
  363. <option value="D12">乾燥桶 D12</option>
  364. </select>
  365. <select id="cond_a1_1">
  366. <option value="">制動器 / 感測器</option>
  367. <optgroup label="制動器狀態">
  368. <option value="input_vacuum_status">入料儲豆槽真空吸料機</option>
  369. <option value="tank_vacuum_status">真空吸料機</option>
  370. <option value="tank_threewayvalve_vacuum_status">吸料機三通閥</option>
  371. <option value="tank_solenoid_disinfect_status">消毒電磁閥</option>
  372. <option value="tank_motor_status">馬達</option>
  373. <option value="outer_solenoid_water_status">桶外進水電磁閥</option>
  374. <option value="tank_solenoid_water_out_status">廢水排水閥</option>
  375. <option value="tank_heater1_status">加熱棒 1</option>
  376. <option value="tank_heater2_status">加熱棒 2</option>
  377. <option value="tank_temp_enable">溫控開關</option>
  378. <option value="tank_temp">溫度設定</option>
  379. <option value="tank_diskvalve_status">蝴蝶閥</option>
  380. <option value="output_vacuum_status">出料儲豆槽真空吸料機</option>
  381. <option value="tank_magneticSwitch_status">電磁開關</option>
  382. <option value="tank_emergencySwitch_status">緊急開關</option>
  383. <option value="tank_camera_status">攝影機</option>
  384. <option value="tank_warningLight_status">警示燈</option>
  385. </optgroup>
  386. <optgroup label="感測器數值">
  387. <option value="tank_ultrasonic_status">超音波感測器</option>
  388. <option value="tank_pa_status">大氣壓力計</option>
  389. <option value="tank_motorencoder_status">馬達編碼器</option>
  390. <option value="tank_sht11_temp_status">溫溼度計_溫度</option>
  391. <option value="tank_sht11_humidity_status">溫溼度計_濕度</option>
  392. <option value="tank_soil_temp_status">三合一土壤感測器_溫度</option>
  393. <option value="tank_soil_humidity_status">三合一土壤感測器_濕度</option>
  394. <option value="tank_soil_ec_status">三合一土壤感測器_EC</option>
  395. <option value="tank_diskvalve_monitor_status">蝴蝶閥狀態顯示器</option>
  396. <option value="outer_waterlevel_status">夾層水位計</option>
  397. </optgroup>
  398. </select>
  399. <select id="cond_b1_1">
  400. <!-- <option value="equal">==</option>
  401. <option value="morethan">&gt;=</option>
  402. <option value="lessthan">&lt;=</option> -->
  403. <option value="MoreThan">&gt;</option>
  404. <option value="MoreThanEqualTo">&gt;=</option>
  405. <option value="Equal" selected>==</option>
  406. <option value="LessThanEqualTo">&lt;=</option>
  407. <option value="LessThan">&lt;</option>
  408. </select>
  409. <input list="cond_list_c1_1" id="cond_c1_1">
  410. <datalist id="cond_list_c1_1">
  411. <option value="on">
  412. <option value="off">
  413. <option value="(或請自行輸入數值)">
  414. </datalist>
  415. <input type="button" class="input-cond-add" id="cond_add1_1" value="條件++" onclick="cond_add(cond_add1_1);"><br>
  416. <script>
  417. var cond_add_child_i = 1 // 這是子條件
  418. function cond_add(evt) { // cond_add1_1 下一個是 cond_add1(條件)_2(子條件)
  419. evt.style.display = "none"; // 不顯示原按鈕
  420. var condadd_parent_num = String(evt.id).split('_')[1].slice(3, ) // 把第一個條件的編號記下
  421. // console.log("condadd_parent_num: " + condadd_parent_num)
  422. cond_add_child_i++
  423. var html = '';
  424. html +=
  425. '<div id="condition' + condadd_parent_num + '_' + cond_add_child_i + '">' +
  426. '<select id="cond_d' + condadd_parent_num + '_' + cond_add_child_i + '">' +
  427. '<option value="and">and</option>' +
  428. '<option value="or">or</option>' +
  429. '</select> ' +
  430. '<select id="cond_a' + condadd_parent_num + '_' + cond_add_child_i + '">' +
  431. '<option value="">制動器 / 感測器</option>' +
  432. '<optgroup label="制動器狀態">' +
  433. '<option value="input_vacuum_status">入料儲豆槽真空吸料機</option>' +
  434. '<option value="tank_vacuum_status">真空吸料機</option>' +
  435. '<option value="tank_threewayvalve_vacuum_status">吸料機三通閥</option>' +
  436. '<option value="tank_solenoid_disinfect_status">消毒電磁閥</option>' +
  437. '<option value="tank_motor_status">馬達</option>' +
  438. '<option value="outer_solenoid_water_status">桶外進水電磁閥</option>' +
  439. '<option value="tank_solenoid_water_out_status">廢水排水閥</option>' +
  440. '<option value="tank_heater1_status">加熱棒 1</option>' +
  441. '<option value="tank_heater2_status">加熱棒 2</option>' +
  442. '<option value="tank_temp_enable">溫控開關</option>' +
  443. '<option value="tank_temp">溫度設定</option>' +
  444. '<option value="tank_diskvalve_status">蝴蝶閥</option>' +
  445. '<option value="output_vacuum_status">出料儲豆槽真空吸料機</option>' +
  446. '<option value="tank_magneticSwitch_status">電磁開關</option>' +
  447. '<option value="tank_emergencySwitch_status">緊急開關</option>' +
  448. '<option value="tank_camera_status">攝影機</option>' +
  449. '<option value="tank_warningLight_status">警示燈</option>' +
  450. '</optgroup>' +
  451. '<optgroup label="感測器數值">' +
  452. '<option value="tank_ultrasonic_status">超音波感測器</option>' +
  453. '<option value="tank_pa_status">大氣壓力計</option>' +
  454. '<option value="tank_motorencoder_status">馬達編碼器</option>' +
  455. '<option value="tank_sht11_temp_status">溫溼度計_溫度</option>' +
  456. '<option value="tank_sht11_humidity_status">溫溼度計_濕度</option>' +
  457. '<option value="tank_soil_temp_status">三合一土壤感測器_溫度</option>' +
  458. '<option value="tank_soil_humidity_status">三合一土壤感測器_濕度</option>' +
  459. '<option value="tank_soil_ec_status">三合一土壤感測器_EC</option>' +
  460. '<option value="tank_diskvalve_monitor_status">蝴蝶閥狀態顯示器</option>' +
  461. '<option value="outer_waterlevel_status">夾層水位計</option>' +
  462. '</optgroup>' +
  463. '</select> ' +
  464. '<select id="cond_b' + condadd_parent_num + '_' + cond_add_child_i + '">' +
  465. // '<option value="equal">==</option>' +
  466. // '<option value="morethan">&gt;=</option>' +
  467. // '<option value="lessthan">&lt;=</option>' +
  468. '<option value="MoreThan">&gt;</option>' +
  469. '<option value="MoreThanEqualTo">&gt;=</option>' +
  470. '<option value="Equal" selected>==</option>' +
  471. '<option value="LessThanEqualTo">&lt;=</option>' +
  472. '<option value="LessThan">&lt;</option>' +
  473. '</select> ' +
  474. '<input list="cond_list_c' + condadd_parent_num + '_' + cond_add_child_i + '" id="cond_c' + condadd_parent_num + '_' + cond_add_child_i + '">' +
  475. '<datalist id="cond_list_c' + condadd_parent_num + '_' + cond_add_child_i + '">' +
  476. '<option value="on">' +
  477. '<option value="off">' +
  478. '<option value="(或請自行輸入數值)">' +
  479. '</datalist> ' +
  480. '<input type="button" class="input-cond-delete" id="cond_del' + condadd_parent_num + '_' + cond_add_child_i + '" value="條件--" onclick="cond_del(\'' + condadd_parent_num + '_' + cond_add_child_i + '\');">' +
  481. '<input type="button" class="input-cond-add" id="cond_add' + condadd_parent_num + '_' + cond_add_child_i + '" value="條件++" onclick="cond_add(cond_add' + condadd_parent_num + '_' + cond_add_child_i + ');"><br>' +
  482. '</div>';
  483. var divbox = document.getElementById('condition' + condadd_parent_num);
  484. divbox.insertAdjacentHTML('beforeend', html);
  485. }
  486. function cond_del(evt) {
  487. // console.log('evt: ' + evt)
  488. var del_cond_child = document.getElementById('condition' + evt);
  489. // console.log("del_cond_child: " + del_cond_child)
  490. del_cond_child.innerHTML = ""
  491. var parentObj = del_cond_child.parentNode; // 取得欲刪除 div 的父類別
  492. parentObj.removeChild(del_cond_child) // 刪除 div
  493. // 上一個按鈕要顯示出來
  494. var del_cond_parent_num = String(evt).split('_')[0]
  495. var del_cond_child_num = String(evt).split('_')[1]
  496. // console.log('del_cond_parent_num: ' + del_cond_parent_num)
  497. // console.log('del_cond_child_num: ' + del_cond_child_num)
  498. var button_return_id = document.getElementById('cond_add' + del_cond_parent_num + '_' + String(parseInt(del_cond_child_num)-1));
  499. // console.log("test: " + 'cond_add' + del_cond_parent_num + '_' + String(parseInt(del_cond_child_num)-1))
  500. // console.log("button_return_id: " + button_return_id) // null
  501. if (button_return_id == null) {
  502. var button_return_id = document.getElementById('cond_add' + del_cond_parent_num + '_1');
  503. }
  504. button_return_id.style.display = "inline";
  505. }
  506. </script>
  507. </div>
  508. </div>
  509. <div id="action1">
  510. <div id="action1_1">
  511. 物件
  512. <select id="do_obj1_1" onChange="renew('1_1', this.selectedIndex);">
  513. <option value="">制動器 / 暫停秒數 / 桶槽狀態</option>
  514. <option value="input_vacuum_status">入料儲豆槽真空吸料機</option>
  515. <option value="tank_vacuum_status">真空吸料機</option>
  516. <option value="tank_threewayvalve_vacuum_status">吸料機三通閥</option>
  517. <option value="tank_solenoid_disinfect_status">消毒電磁閥</option>
  518. <option value="tank_motor_status">馬達</option>
  519. <option value="outer_solenoid_water_status">桶外進水電磁閥</option>
  520. <option value="tank_solenoid_water_out_status">廢水排水電磁閥</option>
  521. <option value="tank_heater1_status">加熱棒 1</option>
  522. <option value="tank_heater2_status">加熱棒 2</option>
  523. <option value="tank_temp_enable">溫控開關</option>
  524. <option value="tank_temp">溫度設定</option>
  525. <option value="tank_diskvalve_status">蝴蝶閥</option>
  526. <option value="output_vacuum_status">出料儲豆槽真空吸料機</option>
  527. <option value="tank_magneticSwitch_status">電磁開關</option>
  528. <option value="tank_emergencySwitch_status">緊急開關</option>
  529. <option value="tank_camera_status">攝影機</option>
  530. <option value="tank_warningLight_status">警示燈</option>
  531. <option value="time.sleep">暫停秒數</option>
  532. <option value="dry_container_status">桶槽狀態</option>
  533. </select>
  534. 動作
  535. <!-- <select id="do_act1_1">
  536. <option value="">請由左方選取物件
  537. </select> -->
  538. <div id="do_action1_1" style="display: inline-block;">
  539. </div>
  540. <input type="button" class="input-act-add" id="act_add1_1" value="物件動作++" onclick="act_add(act_add1_1);"><br>
  541. </div>
  542. <script>
  543. var act_add_child_i = 1
  544. function act_add(evt) {
  545. evt.style.display = "none";
  546. var actadd_parent_num = String(evt.id).split('_')[1].slice(3, )
  547. // console.log("actadd_parent_num: " + actadd_parent_num)
  548. act_add_child_i++;
  549. var html = '';
  550. html +=
  551. '<div id="action' + actadd_parent_num + '_' + act_add_child_i + '">' +
  552. '物件 ' +
  553. '<select id="do_obj' + actadd_parent_num + '_' + act_add_child_i + '" onChange="renew(\'' + actadd_parent_num + '_' + act_add_child_i + '\', this.selectedIndex);">' +
  554. '<option value="">制動器 / 暫停秒數 / 桶槽狀態</option>' +
  555. '<option value="input_vacuum_status">入料儲豆槽真空吸料機</option>' +
  556. '<option value="tank_vacuum_status">真空吸料機</option>' +
  557. '<option value="tank_threewayvalve_vacuum_status">吸料機三通閥</option>' +
  558. '<option value="tank_solenoid_disinfect_status">消毒電磁閥</option>' +
  559. '<option value="tank_motor_status">馬達</option>' +
  560. '<option value="outer_solenoid_water_status">桶外進水電磁閥</option>' +
  561. '<option value="tank_solenoid_water_out_status">廢水排水電磁閥</option>' +
  562. '<option value="tank_heater1_status">加熱棒 1</option>' +
  563. '<option value="tank_heater2_status">加熱棒 2</option>' +
  564. '<option value="tank_temp_enable">溫控開關</option>' +
  565. '<option value="tank_temp">溫度設定</option>' +
  566. '<option value="tank_diskvalve_status">蝴蝶閥</option>' +
  567. '<option value="output_vacuum_status">出料儲豆槽真空吸料機</option>' +
  568. '<option value="tank_magneticSwitch_status">電磁開關</option>' +
  569. '<option value="tank_emergencySwitch_status">緊急開關</option>' +
  570. '<option value="tank_camera_status">攝影機</option>' +
  571. '<option value="tank_warningLight_status">警示燈</option>' +
  572. '<option value="time.sleep">暫停秒數</option>' +
  573. '<option value="dry_container_status">桶槽狀態</option>' +
  574. '</select> ' +
  575. '動作 ' +
  576. '<div id="do_action' + actadd_parent_num + '_' + act_add_child_i + '" style="display: inline-block;">' +
  577. '</div>' +
  578. // '<select id="do_act' + actadd_parent_num + '_' + act_add_child_i + '">' +
  579. // '<option value="">請由左方選取物件</option>' +
  580. // '</select> ' +
  581. '<input type="button" class="input-act-delete" id="act_del' + actadd_parent_num + '_' + act_add_child_i + '" value="物件動作--" onclick="act_del(\'' + actadd_parent_num + '_' + act_add_child_i + '\');">' +
  582. '<input type="button" class="input-act-add" id="act_add' + actadd_parent_num + '_' + act_add_child_i + '" value="物件動作++" onclick="act_add(act_add' + actadd_parent_num + '_' + act_add_child_i + ');"><br>' +
  583. '</div>';
  584. var divbox = document.getElementById('action' + actadd_parent_num);
  585. divbox.insertAdjacentHTML('beforeend', html);
  586. }
  587. function act_del(evt) {
  588. var del_action = document.getElementById('action' + evt);
  589. del_action.innerHTML = ""
  590. var parentObj = del_action.parentNode; // 取得欲刪除 div 的父類別
  591. parentObj.removeChild(del_action) // 刪除 div
  592. var del_act_parent_num = String(evt).split('_')[0]
  593. var del_act_child_num = String(evt).split('_')[1]
  594. // console.log('del_act_parent_num: ' + del_act_parent_num)
  595. // console.log('del_act_child_num: ' + del_act_child_num)
  596. var button_return_id = document.getElementById('act_add' + del_act_parent_num + '_' + String(parseInt(del_act_child_num)-1));
  597. // console.log("test: " + 'cond_add' + del_act_parent_num + '_' + String(parseInt(del_act_child_num)-1))
  598. // console.log("button_return_id: " + button_return_id) // null
  599. if (button_return_id == null) {
  600. var button_return_id = document.getElementById('act_add' + del_act_parent_num + '_1');
  601. }
  602. button_return_id.style.display = "inline";
  603. }
  604. </script>
  605. </div>
  606. <input type="button" class="input-add" id="add1" value="條件物件動作++" onclick="Add(add1);">
  607. </div>
  608. </div>
  609. </div>
  610. </div>
  611. </div>
  612. </div>
  613. <label for="tab2">乾燥槽 - 入豆</label>
  614. <div class="box">
  615. <input type="checkbox" name="tab" id="tab2">
  616. <div class="content">
  617. hello<br>
  618. hello<br>
  619. hello<br>
  620. </div>
  621. </div>
  622. <label for="tab3">乾燥槽 - 入豆暫停</label>
  623. <div class="box">
  624. <input type="checkbox" name="tab" id="tab3">
  625. <div class="content">
  626. hello<br>
  627. hello<br>
  628. hello<br>
  629. </div>
  630. </div>
  631. <label for="tab4">乾燥槽 - 入豆完成</label>
  632. <div class="box">
  633. <input type="checkbox" name="tab" id="tab4">
  634. <div class="content">
  635. hello<br>
  636. hello<br>
  637. hello<br>
  638. </div>
  639. </div>
  640. <label for="tab5">乾燥槽 - 乾燥</label>
  641. <div class="box">
  642. <input type="checkbox" name="tab" id="tab5">
  643. <div class="content">
  644. hello<br>
  645. hello<br>
  646. hello<br>
  647. </div>
  648. </div>
  649. <label for="tab6">乾燥槽 - 可出豆</label>
  650. <div class="box">
  651. <input type="checkbox" name="tab" id="tab6">
  652. <div class="content">
  653. hello<br>
  654. hello<br>
  655. hello<br>
  656. </div>
  657. </div>
  658. </div>
  659. <script>
  660. var new_condition_i = 1
  661. function Add(evt) { // 網頁初始按鈕 onclick="Add(add1);
  662. evt.style.display = "none"; // 元素不顯示。將 add1 的 input-button 不顯示
  663. new_condition_i++; // 設定編號用
  664. // var div = document.createElement('div'); // 輸出 <div></div>。此時並不會顯示,
  665. // 需透過 appendChild()、insertBefore() 或 replaceChild() 等方法將新元素加入至指定的位置之後才會顯示。
  666. // var cond_number = String(evt).slice(3, ) // 目前的 condition 條件物件動作 數 (最外層)
  667. // var cond_a = 'cond_a' + cond_number + '_' + new_condition_i; // [條件] 左方 : 制動器感測器
  668. // var cond_b = 'cond_b' + cond_number + '_' + new_condition_i; // [條件] 中間 : > / = / <
  669. // var cond_c = 'cond_c' + cond_number + '_' + new_condition_i; // [條件] 右方 : ON / OFF / 數值
  670. // var cond_d = 'cond_d' + cond_number + '_' + new_condition_i; // 條件] 最左方條件連接 : and / or
  671. // div.id = 'newcondition_' + new_condition_i; // 設定 div 的 id
  672. // div.style.marginTop = "10px"; // 新增的 div 設定 marginTop 屬性值
  673. var html = ''
  674. // 新增的條件
  675. html +=
  676. '<div id="newcondition_' + new_condition_i + '" class="newcondition_css">' +
  677. // 新增的分隔線
  678. // '<hr size="50" width="100%">' +
  679. '<div id="condition' + new_condition_i + '">' +
  680. '<div id="condition' + new_condition_i + '_1">' +
  681. '條件 ' +
  682. '<select id="cond_z' + new_condition_i + '_1">' +
  683. '<option value="if">if</option>' +
  684. '<option value="elif">elif</option>' +
  685. '<option value="else">else</option>' +
  686. '</select> ' +
  687. '<select id="cond_tank' + new_condition_i + '_1">' +
  688. '<option value="D1">乾燥桶 D1</option>' +
  689. '<option value="D2">乾燥桶 D2</option>' +
  690. '<option value="D3">乾燥桶 D3</option>' +
  691. '<option value="D4">乾燥桶 D4</option>' +
  692. '<option value="D5">乾燥桶 D5</option>' +
  693. '<option value="D6">乾燥桶 D6</option>' +
  694. '<option value="D7">乾燥桶 D7</option>' +
  695. '<option value="D8">乾燥桶 D8</option>' +
  696. '<option value="D9">乾燥桶 D9</option>' +
  697. '<option value="D10">乾燥桶 D10</option>' +
  698. '<option value="D11">乾燥桶 D11</option>' +
  699. '<option value="D12">乾燥桶 D12</option>' +
  700. '</select> ' +
  701. '<select id="cond_a' + new_condition_i + '_1">' +
  702. '<option value="">制動器 / 感測器</option>' +
  703. '<optgroup label="制動器狀態">' +
  704. '<option value="input_vacuum_status">入料儲豆槽真空吸料機</option>' +
  705. '<option value="tank_vacuum_status">真空吸料機</option>' +
  706. '<option value="tank_threewayvalve_vacuum_status">吸料機三通閥</option>' +
  707. '<option value="tank_solenoid_disinfect_status">消毒電磁閥</option>' +
  708. '<option value="tank_motor_status">馬達</option>' +
  709. '<option value="outer_solenoid_water_status">桶外進水電磁閥</option>' +
  710. '<option value="tank_solenoid_water_out_status">廢水排水閥</option>' +
  711. '<option value="tank_heater1_status">加熱棒 1</option>' +
  712. '<option value="tank_heater2_status">加熱棒 2</option>' +
  713. '<option value="tank_temp_enable">溫控開關</option>' +
  714. '<option value="tank_temp">溫度設定</option>' +
  715. '<option value="tank_diskvalve_status">蝴蝶閥</option>' +
  716. '<option value="output_vacuum_status">出料儲豆槽真空吸料機</option>' +
  717. '<option value="tank_magneticSwitch_status">電磁開關</option>' +
  718. '<option value="tank_emergencySwitch_status">緊急開關</option>' +
  719. '<option value="tank_camera_status">攝影機</option>' +
  720. '<option value="tank_warningLight_status">警示燈</option>' +
  721. '</optgroup>' +
  722. '<optgroup label="感測器數值">' +
  723. '<option value="tank_ultrasonic_status">超音波感測器</option>' +
  724. '<option value="tank_pa_status">大氣壓力計</option>' +
  725. '<option value="tank_motorencoder_status">馬達編碼器</option>' +
  726. '<option value="tank_sht11_temp_status">溫溼度計_溫度</option>' +
  727. '<option value="tank_sht11_humidity_status">溫溼度計_濕度</option>' +
  728. '<option value="tank_soil_temp_status">三合一土壤感測器_溫度</option>' +
  729. '<option value="tank_soil_humidity_status">三合一土壤感測器_濕度</option>' +
  730. '<option value="tank_soil_ec_status">三合一土壤感測器_EC</option>' +
  731. '<option value="tank_diskvalve_monitor_status">蝴蝶閥狀態顯示器</option>' +
  732. '<option value="outer_waterlevel_status">夾層水位計</option>' +
  733. '</optgroup>' +
  734. '</select> ' +
  735. '<select id="cond_b' + new_condition_i + '_1">' +
  736. // '<option value="equal">==</option>' +
  737. // '<option value="morethan">&gt;=</option>' +
  738. // '<option value="lessthan">&lt;=</option>' +
  739. '<option value="MoreThan">&gt;</option>' +
  740. '<option value="MoreThanEqualTo">&gt;=</option>' +
  741. '<option value="Equal" selected>==</option>' +
  742. '<option value="LessThanEqualTo">&lt;=</option>' +
  743. '<option value="LessThan">&lt;</option>' +
  744. '</select> ' +
  745. '<input list="cond_list_c' + new_condition_i + '_1" id="cond_c' + new_condition_i + '_1">' +
  746. '<datalist id="cond_list_c' + new_condition_i + '_1">' +
  747. '<option value="on">' +
  748. '<option value="off">' +
  749. '<option value="(或請自行輸入數值)">' +
  750. '</datalist> ' +
  751. '<input type="button" class="input-cond-add" id="cond_add' + new_condition_i + '_1" value="條件++" onclick="cond_add(cond_add' + new_condition_i + '_1)"><br>' +
  752. '</div></div>';
  753. // 新增的物件動作
  754. html +=
  755. '<div id="action' + new_condition_i + '">' +
  756. '<div id="action' + new_condition_i + '_1">' +
  757. '物件 ' +
  758. '<select id="do_obj' + new_condition_i + '_1" onChange="renew(\''+ new_condition_i + '_1\', this.selectedIndex);">' +
  759. '<option value="">制動器 / 暫停秒數 / 桶槽狀態</option>' +
  760. '<option value="input_vacuum_status">入料儲豆槽真空吸料機</option>' +
  761. '<option value="tank_vacuum_status">真空吸料機</option>' +
  762. '<option value="tank_threewayvalve_vacuum_status">吸料機三通閥</option>' +
  763. '<option value="tank_solenoid_disinfect_status">消毒電磁閥</option>' +
  764. '<option value="tank_motor_status">馬達</option>' +
  765. '<option value="outer_solenoid_water_status">桶外進水電磁閥</option>' +
  766. '<option value="tank_solenoid_water_out_status">廢水排水電磁閥</option>' +
  767. '<option value="tank_heater1_status">加熱棒 1</option>' +
  768. '<option value="tank_heater2_status">加熱棒 2</option>' +
  769. '<option value="tank_temp_enable">溫控開關</option>' +
  770. '<option value="tank_temp">溫度設定</option>' +
  771. '<option value="tank_diskvalve_status">蝴蝶閥</option>' +
  772. '<option value="output_vacuum_status">出料儲豆槽真空吸料機</option>' +
  773. '<option value="tank_magneticSwitch_status">電磁開關</option>' +
  774. '<option value="tank_emergencySwitch_status">緊急開關</option>' +
  775. '<option value="tank_camera_status">攝影機</option>' +
  776. '<option value="tank_warningLight_status">警示燈</option>' +
  777. '<option value="time.sleep">暫停秒數</option>' +
  778. '<option value="dry_container_status">桶槽狀態</option>' +
  779. '</select>' +
  780. ' 動作 ' +
  781. '<div id="do_action' + new_condition_i + '_1" style="display: inline-block;">' +
  782. '</div>' +
  783. // '<select id="do_act' + new_condition_i + '_1">' +
  784. // '<option value="">請由左方選取物件' +
  785. // '</select> ' +
  786. '<input type="button" class="input-act-add" id="act_add' + new_condition_i + '_1" value="物件動作++" onclick="act_add(act_add' + new_condition_i + '_1);"><br>' +
  787. '</div>' +
  788. '</div>' +
  789. // 新增的 條件物件動作++ 條件物件動作-- 按鈕
  790. '<input type="button" class="input-delete" id="del' + new_condition_i + '" value="條件物件動作--" onclick="Delete(' + new_condition_i + ');"><br>' +
  791. '<input type="button" class="input-add" id="add' + new_condition_i + '" value="條件物件動作++" onclick="Add(add' + new_condition_i + ');">' +
  792. '</div>' ;
  793. var divbox = document.getElementById('box');
  794. divbox.insertAdjacentHTML('beforeend', html);
  795. };
  796. function Delete(evt) {
  797. var del_condition = document.getElementById('newcondition_' + evt);
  798. del_condition.innerHTML = ""
  799. var parentObj = del_condition.parentNode; // 取得欲刪除 div 的父類別
  800. parentObj.removeChild(del_condition) // 刪除 div
  801. // 上一個按鈕要顯示出來
  802. var button_return_id = document.getElementById('add' + String(parseInt(evt)-1));
  803. if (button_return_id == null) {
  804. var button_return_id = document.getElementById('add1');
  805. }
  806. // console.log('button_return_id: ' + button_return_id)
  807. button_return_id.style.display = "block"; // 元素顯示。顯示前一個 input-button
  808. };
  809. </script>
  810. - - - 手風琴測試 - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - -<br>
  811. <!-- 0225 手風琴測試 end -->
  812. 原本 BOX 的位置<br>
  813. - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - -
  814. <br>
  815. <input type="button" id="test" value="取值測試" onclick="test();">
  816. <input type="button" id="test" value="MQTT" onclick="MQTTtest();"><br>
  817. <span id="value_test"> ( 取值測試 ) </span><br>
  818. <span id="command_test"> ( command 測試 ) </span><br>
  819. <script>
  820. var set_Schedule = '{ '; // 紀錄 變數名稱 + 值
  821. var cond_main = ''; // 主條件
  822. var cond_add_list = []; // 附加條件 List
  823. var cond_add_data = ''; // 欲加入附加條件的資料
  824. var cond_com_list = []; // 動作 List
  825. var cond_com_data = ''; // 欲加入動作的資料
  826. var cond_item = []; // 主條件+附加條件+動作 List
  827. var cond_all = []; // cond_item List (未用)
  828. // function test(){
  829. // // console.log("new_condition_i: " + new_condition_i) // 總數 : 條件物件動作
  830. // // console.log("cond_add_child_i: " + cond_add_child_i) // 總數 : 子 條件
  831. // // console.log("act_add_child_i: " + act_add_child_i) // 總數 : 子 物件動作
  832. // // set_Schedule += 'set_Schedule = { ';
  833. // set_Schedule = '{ ';
  834. // var command_test = '';
  835. // // 條件物件動作 取值
  836. // for (let z = 1; z <= new_condition_i; z++) {
  837. // // if-while 取值
  838. // try {
  839. // var cond_z_value = document.getElementById("cond_z" + z + "_1").value;
  840. // // console.log("cond_z" + z + "_1: " + cond_z_value)
  841. // set_Schedule += '"cond_z' + z + '_1": "' + cond_z_value + '", ' ;
  842. // } catch (error) {
  843. // if (error.name == 'TypeError') {
  844. // console.log("cond_z" + z + "_1: null")
  845. // set_Schedule += '"cond_z' + z + '_1": "", ' ;
  846. // } else {
  847. // alert("cond_z" + z + "_1: " + error.name)
  848. // break
  849. // }
  850. // }
  851. // // 桶槽號碼 取值
  852. // try {
  853. // var cond_tank_value = document.getElementById("cond_tank" + z + "_1").value;
  854. // // console.log("cond_tank" + z + "_1: " + cond_tank_value)
  855. // set_Schedule += '"cond_tank' + z + '_1": "' + cond_tank_value + '", ' ;
  856. // } catch (error) {
  857. // if (error.name == 'TypeError') {
  858. // console.log("cond_tank" + z + "_1: null")
  859. // set_Schedule += '"cond_tank' + z + '_1": "", ' ;
  860. // } else {
  861. // alert("cond_tank" + z + "_1: " + error.name)
  862. // break
  863. // }
  864. // }
  865. // // 子 條件 取值
  866. // for (let x = 1; x <= cond_add_child_i; x++) {
  867. // // 子條件取值 : 條件連接 and or
  868. // if (x > 1) {
  869. // try {
  870. // var cond_d_value = document.getElementById("cond_d" + z + "_" + x).value;
  871. // // console.log("cond_d" + z + "_" + x + ": " + cond_d_value)
  872. // set_Schedule += '"cond_d' + z + '_' + x + '": "' + cond_d_value + '", ' ;
  873. // } catch (error) {
  874. // if (error.name == 'TypeError') {
  875. // // console.log("cond_d" + z + "_" + x + ": null")
  876. // set_Schedule += '"cond_d' + z + '_' + x + '": "", ' ;
  877. // } else {
  878. // alert("cond_d" + z + "_" + x + ": " + error.name)
  879. // break
  880. // }
  881. // }
  882. // }
  883. // try {
  884. // var cond_a_value = document.getElementById("cond_a" + z + "_" + x).value;
  885. // // console.log("cond_a" + z + "_" + x + ": " + cond_a_value)
  886. // set_Schedule += '"cond_a' + z + '_' + x + '": "' + cond_a_value + '", ' ;
  887. // if (cond_a_value == '') {
  888. // alert('條件欄位輸入有誤, 請再次確認')
  889. // break
  890. // }
  891. // } catch (error) {
  892. // if (error.name == 'TypeError') {
  893. // // console.log("cond_a" + z + "_" + x + ": null")
  894. // set_Schedule += '"cond_a' + z + '_' + x + '": "", ' ;
  895. // } else {
  896. // alert("cond_a" + z + "_" + x + ": " + error.name)
  897. // break
  898. // }
  899. // }
  900. // // 子條件取值 : 條件中 > = <
  901. // try {
  902. // var cond_b_value = document.getElementById("cond_b" + z + "_" + x).value;
  903. // // console.log("cond_b" + z + "_" + x + ": " + cond_b_value)
  904. // set_Schedule += '"cond_b' + z + '_' + x + '": "' + cond_b_value + '", ' ;
  905. // if (cond_b_value == '') {
  906. // alert('條件欄位輸入有誤, 請再次確認')
  907. // break
  908. // }
  909. // } catch (error) {
  910. // if (error.name == 'TypeError') {
  911. // // console.log("cond_b" + z + "_" + x + ": null")
  912. // set_Schedule += '"cond_b' + z + '_' + x + '": "", ' ;
  913. // } else {
  914. // alert("cond_b" + z + "_" + x + ": " + error.name)
  915. // break
  916. // }
  917. // }
  918. // // 子條件取值 : 條件右 ON / OFF / 輸入數值
  919. // try {
  920. // var cond_c_value = document.getElementById("cond_c" + z + "_" + x).value;
  921. // // console.log("cond_c" + z + "_" + x + ": " + cond_c_value)
  922. // set_Schedule += '"cond_c' + z + '_' + x + '": "' + cond_c_value + '", ' ;
  923. // if (cond_c_value == '') {
  924. // alert('條件欄位輸入有誤, 請再次確認')
  925. // break
  926. // }
  927. // } catch (error) {
  928. // if (error.name == 'TypeError') {
  929. // // console.log("cond_c" + z + "_" + x + ": null")
  930. // set_Schedule += '"cond_c' + z + '_' + x + '": "", ' ;
  931. // } else {
  932. // alert("cond_c" + z + "_" + x + ": " + error.name)
  933. // break
  934. // }
  935. // }
  936. // }
  937. // // 子 物件動作 取值
  938. // for (let y = 1; y <= act_add_child_i; y++) {
  939. // // 子物件動作取值 : 物件 do_obj1_1
  940. // try {
  941. // var do_obj_value = document.getElementById("do_obj" + z + "_" + y).value;
  942. // if (do_obj_value == '') {
  943. // alert('物件欄位輸入有誤, 請再次確認')
  944. // break
  945. // }
  946. // // console.log("do_obj" + z + "_" + y + ": " + do_obj_value)
  947. // set_Schedule += '"do_obj' + z + '_' + y + '": "' + do_obj_value + '", ' ;
  948. // command_test += '{"tank_num": "' + cond_tank_value + '", "command": "' + do_obj_value + '", "value":"';
  949. // } catch (error) {
  950. // if (error.name == 'TypeError') {
  951. // // console.log("do_obj" + z + "_" + y + ": null")
  952. // set_Schedule += '"do_obj' + z + '_' + y + '": "", ' ;
  953. // } else {
  954. // alert("do_obj" + z + "_" + y + ": " + error.name)
  955. // break
  956. // }
  957. // }
  958. // // 子物件動作取值 : 動作 do_act1_1
  959. // try {
  960. // var do_act_value = document.getElementById("do_act" + z + "_" + y).value;
  961. // if (do_act_value == '') {
  962. // alert('動作欄位輸入有誤, 請再次確認')
  963. // break
  964. // }
  965. // // console.log("do_act" + z + "_" + y + ": " + do_act_value)
  966. // set_Schedule += '"do_act' + z + '_' + y + '": "' + do_act_value + '", ' ;
  967. // command_test += do_act_value + '" }';
  968. // } catch (error) {
  969. // if (error.name == 'TypeError') {
  970. // // console.log("do_obj" + z + "_" + y + ": null")
  971. // set_Schedule += '"do_act' + z + '_' + y + '": "", ' ;
  972. // } else {
  973. // alert("do_act" + z + "_" + y + ": " + error.name)
  974. // break
  975. // }
  976. // }
  977. // }
  978. // }
  979. // // 整理資料用
  980. // set_Schedule += '"": ""}' ;
  981. // // console.log('set_Schedule: ' + set_Schedule)
  982. // $('#value_test').text('set_Schedule: ' + set_Schedule)
  983. // $('#command_test').text('command_test: ' + command_test)
  984. // }
  985. function test(){
  986. // console.log("new_condition_i: " + new_condition_i) // 總數 : 條件物件動作
  987. // console.log("cond_add_child_i: " + cond_add_child_i) // 總數 : 子 條件
  988. // console.log("act_add_child_i: " + act_add_child_i) // 總數 : 子 物件動作
  989. // set_Schedule += 'set_Schedule = { ';
  990. cond_item = [];
  991. var command_test = '';
  992. Z = 0;
  993. TT = {}; // 將總條件句/附加條件句/物件動作句存入 字典, 後續傳給 dry_block_format 再組合
  994. var set_key = []; // List 加入變數名稱, INSERT DB 用
  995. var set_value = []; // List 加入值, INSERT DB 用
  996. // 條件物件動作 取值
  997. for (let z = 1; z <= new_condition_i; z++) {
  998. // 初始清空
  999. cond_main = '';
  1000. // if-while 取值
  1001. try {
  1002. var cond_z_value = document.getElementById("cond_z" + z + "_1").value;
  1003. // console.log("cond_z" + z + "_1: " + cond_z_value)
  1004. if (cond_z_value == '') {
  1005. alert('if/while 欄位未輸入')
  1006. } else {
  1007. Z = Z + 1;
  1008. set_Schedule += '"cond_z' + Z + '_1": "' + cond_z_value + '", ' ;
  1009. set_key.push('cond_z' + Z + '_1');
  1010. set_value.push(cond_z_value);
  1011. cond_main += cond_z_value + ' ';
  1012. }
  1013. } catch (error) {
  1014. if (error.name == 'TypeError') {
  1015. // 跳號時, 不寫入 DB、不顯示條件
  1016. // console.log("cond_z" + z + "_1: null")
  1017. // set_Schedule += '"cond_z' + Z + '_1": "", ' ;
  1018. } else {
  1019. alert("cond_z" + z + "_1: " + error.name)
  1020. }
  1021. }
  1022. // 桶槽號碼 取值
  1023. try {
  1024. var cond_tank_value = document.getElementById("cond_tank" + z + "_1").value;
  1025. // console.log("cond_tank" + z + "_1: " + cond_tank_value)
  1026. if (cond_tank_value == '') {
  1027. alert('桶槽 欄位未輸入')
  1028. } else {
  1029. set_Schedule += '"cond_tank' + Z + '_1": "' + cond_tank_value + '", ' ;
  1030. set_key.push('cond_tank' + Z + '_1');
  1031. set_value.push(cond_tank_value);
  1032. cond_main += cond_tank_value + ' ';
  1033. }
  1034. } catch (error) {
  1035. if (error.name == 'TypeError') {
  1036. // console.log("cond_tank" + z + "_1: null")
  1037. // set_Schedule += '"cond_tank' + Z + '_1": "", ' ;
  1038. } else {
  1039. alert("cond_tank" + z + "_1: " + error.name)
  1040. }
  1041. }
  1042. // 子 條件 取值
  1043. X = 1;
  1044. cond_add_list = []; // 附加條件 List 清空
  1045. for (let x = 1; x <= cond_add_child_i; x++) {
  1046. cond_add_data = ''; // 附加條件資料 清空
  1047. if (x == 1) {
  1048. // 主條件
  1049. try {
  1050. var cond_a_value = document.getElementById("cond_a" + z + "_" + x).value;
  1051. // console.log("cond_a" + z + "_" + x + ": " + cond_a_value)
  1052. if (cond_a_value == '') {
  1053. alert('主條件 感測器 欄位未輸入')
  1054. } else {
  1055. set_Schedule += '"cond_a' + Z + '_' + X + '": "' + cond_a_value + '", ' ;
  1056. set_key.push('cond_a' + Z + '_' + X);
  1057. set_value.push(cond_a_value);
  1058. cond_main += cond_a_value + ' ';
  1059. }
  1060. } catch (error) {
  1061. if (error.name == 'TypeError') {
  1062. // console.log("cond_a" + z + "_" + x + ": null")
  1063. // set_Schedule += '"cond_a' + z + '_' + x + '": "", ' ;
  1064. } else {
  1065. alert("cond_a" + z + "_" + x + ": " + error.name)
  1066. }
  1067. }
  1068. // 子條件取值 : 條件中 > = <
  1069. try {
  1070. var cond_b_value = document.getElementById("cond_b" + z + "_" + x).value;
  1071. // console.log("cond_b" + z + "_" + x + ": " + cond_b_value)
  1072. if (cond_b_value == '') {
  1073. alert('主條件 比較運算子 欄位未輸入')
  1074. } else {
  1075. set_Schedule += '"cond_b' + Z + '_' + X + '": "' + cond_b_value + '", ' ;
  1076. set_key.push('cond_b' + Z + '_' + X);
  1077. set_value.push(cond_b_value);
  1078. if (cond_b_value == 'MoreThan') { cond_main += '> '; }
  1079. else if (cond_b_value == 'MoreThanEqualTo') { cond_main += '>= '; }
  1080. else if (cond_b_value == 'Equal') { cond_main += '== '; }
  1081. else if (cond_b_value == 'LessThanEqualTo') { cond_main += '<= '; }
  1082. else if (cond_b_value == 'LessThan') { cond_main += '< '; }
  1083. }
  1084. } catch (error) {
  1085. if (error.name == 'TypeError') {
  1086. // console.log("cond_b" + z + "_" + x + ": null")
  1087. // set_Schedule += '"cond_b' + z + '_' + x + '": "", ' ;
  1088. } else {
  1089. alert("cond_b" + z + "_" + x + ": " + error.name)
  1090. }
  1091. }
  1092. // 子條件取值 : 條件右 ON / OFF / 輸入數值
  1093. try {
  1094. var cond_c_value = document.getElementById("cond_c" + z + "_" + x).value;
  1095. // console.log("cond_c" + z + "_" + x + ": " + cond_c_value)
  1096. if (cond_c_value == '') {
  1097. alert('主條件 數值 欄位未輸入')
  1098. } else {
  1099. set_Schedule += '"cond_c' + Z + '_' + X + '": "' + cond_c_value + '", ' ;
  1100. set_key.push('cond_c' + Z + '_' + X);
  1101. set_value.push(cond_c_value);
  1102. cond_main += cond_c_value;
  1103. }
  1104. } catch (error) {
  1105. if (error.name == 'TypeError') {
  1106. // console.log("cond_c" + z + "_" + x + ": null")
  1107. // set_Schedule += '"cond_c' + z + '_' + x + '": "", ' ;
  1108. } else {
  1109. alert("cond_c" + z + "_" + x + ": " + error.name)
  1110. }
  1111. }
  1112. } else {
  1113. // 附加條件 x > 1
  1114. // 子條件取值 : 條件連接 and or
  1115. try {
  1116. var cond_d_value = document.getElementById("cond_d" + z + "_" + x).value;
  1117. // console.log("cond_d" + z + "_" + x + ": " + cond_d_value)
  1118. if (cond_d_value == '') {
  1119. alert('附加條件 and/or 欄位未輸入')
  1120. } else {
  1121. X = X + 1;
  1122. // console.log("X: " + X)
  1123. set_Schedule += '"cond_d' + Z + '_' + X + '": "' + cond_d_value + '", ' ;
  1124. set_key.push('cond_d' + Z + '_' + X);
  1125. set_value.push(cond_d_value);
  1126. cond_add_data += cond_d_value + ' ';
  1127. }
  1128. } catch (error) {
  1129. if (error.name == 'TypeError') {
  1130. // console.log("cond_d" + z + "_" + x + ": null")
  1131. // set_Schedule += '"cond_d' + Z + '_' + x + '": "", ' ;
  1132. } else {
  1133. alert("cond_d" + z + "_" + x + ": " + error.name)
  1134. }
  1135. }
  1136. // 感測器取值 :
  1137. try {
  1138. var cond_a_value = document.getElementById("cond_a" + z + "_" + x).value;
  1139. // console.log("cond_a" + z + "_" + x + ": " + cond_a_value)
  1140. if (cond_a_value == '') {
  1141. alert('附加條件 感測器 欄位未輸入')
  1142. } else {
  1143. set_Schedule += '"cond_a' + Z + '_' + X + '": "' + cond_a_value + '", ' ;
  1144. set_key.push('cond_a' + Z + '_' + X);
  1145. set_value.push(cond_a_value);
  1146. cond_add_data += cond_a_value + ' ';
  1147. }
  1148. } catch (error) {
  1149. if (error.name == 'TypeError') {
  1150. // console.log("cond_a" + z + "_" + x + ": null")
  1151. // set_Schedule += '"cond_a' + z + '_' + x + '": "", ' ;
  1152. } else {
  1153. alert("cond_a" + z + "_" + x + ": " + error.name)
  1154. }
  1155. }
  1156. // 子條件取值 : 條件中 > = <
  1157. try {
  1158. var cond_b_value = document.getElementById("cond_b" + z + "_" + x).value;
  1159. // console.log("cond_b" + z + "_" + x + ": " + cond_b_value)
  1160. if (cond_b_value == '') {
  1161. alert('附加條件 比較運算子 欄位未輸入')
  1162. } else {
  1163. set_Schedule += '"cond_b' + Z + '_' + X + '": "' + cond_b_value + '", ' ;
  1164. set_key.push('cond_b' + Z + '_' + X);
  1165. set_value.push(cond_b_value);
  1166. if (cond_b_value == 'MoreThan') { cond_add_data += '> '; }
  1167. else if (cond_b_value == 'MoreThanEqualTo') { cond_add_data += '>= '; }
  1168. else if (cond_b_value == 'Equal') { cond_add_data += '== '; }
  1169. else if (cond_b_value == 'LessThanEqualTo') { cond_add_data += '<= '; }
  1170. else if (cond_b_value == 'LessThan') { cond_add_data += '< '; }
  1171. }
  1172. } catch (error) {
  1173. if (error.name == 'TypeError') {
  1174. // console.log("cond_b" + z + "_" + x + ": null")
  1175. // set_Schedule += '"cond_b' + z + '_' + x + '": "", ' ;
  1176. } else {
  1177. alert("cond_b" + z + "_" + x + ": " + error.name)
  1178. }
  1179. }
  1180. // 子條件取值 : 條件右 ON / OFF / 輸入數值
  1181. try {
  1182. var cond_c_value = document.getElementById("cond_c" + z + "_" + x).value;
  1183. // console.log("cond_c" + z + "_" + x + ": " + cond_c_value)
  1184. if (cond_c_value == '') {
  1185. alert('附加條件 數值 欄位未輸入')
  1186. } else {
  1187. set_Schedule += '"cond_c' + Z + '_' + X + '": "' + cond_c_value + '", ' ;
  1188. set_key.push('cond_c' + Z + '_' + X);
  1189. set_value.push(cond_c_value);
  1190. cond_add_data += cond_c_value;
  1191. }
  1192. } catch (error) {
  1193. if (error.name == 'TypeError') {
  1194. // console.log("cond_c" + z + "_" + x + ": null")
  1195. // set_Schedule += '"cond_c' + z + '_' + x + '": "", ' ;
  1196. } else {
  1197. alert("cond_c" + z + "_" + x + ": " + error.name)
  1198. }
  1199. }
  1200. if (cond_add_data != '') {
  1201. console.log("cond_add_list: " + cond_add_list)
  1202. console.log("cond_add_data: " + cond_add_data)
  1203. cond_add_list.push(cond_add_data)
  1204. }
  1205. }
  1206. }
  1207. // 子 物件動作 取值
  1208. Y = 0;
  1209. cond_com_list = [];
  1210. for (let y = 1; y <= act_add_child_i; y++) {
  1211. cond_com_data = '';
  1212. // 子物件動作取值 : 物件 do_obj1_1
  1213. try {
  1214. var do_obj_value = document.getElementById("do_obj" + z + "_" + y).value;
  1215. if (do_obj_value == '') {
  1216. alert('物件 欄位未輸入')
  1217. } else {
  1218. // console.log("do_obj" + z + "_" + y + ": " + do_obj_value)
  1219. Y = Y + 1;
  1220. set_Schedule += '"do_obj' + Z + '_' + Y + '": "' + do_obj_value + '", ' ;
  1221. // command_test += '{"tank_num": "' + cond_tank_value + '", "command": "' + do_obj_value + '", "value":"';
  1222. set_key.push('do_obj' + Z + '_' + Y);
  1223. set_value.push(do_obj_value);
  1224. cond_com_data += do_obj_value + ' ';
  1225. }
  1226. } catch (error) {
  1227. if (error.name == 'TypeError') {
  1228. // console.log("do_obj" + z + "_" + y + ": null")
  1229. // set_Schedule += '"do_obj' + z + '_' + y + '": "", ' ;
  1230. } else {
  1231. alert("do_obj" + z + "_" + y + ": " + error.name)
  1232. }
  1233. }
  1234. // 子物件動作取值 : 動作 do_act1_1
  1235. try {
  1236. var do_act_value = document.getElementById("do_act" + z + "_" + y).value;
  1237. if (do_act_value == '') {
  1238. alert('動作 欄位未輸入')
  1239. } else {
  1240. // console.log("do_act" + z + "_" + y + ": " + do_act_value)
  1241. set_Schedule += '"do_act' + Z + '_' + Y + '": "' + do_act_value + '", ' ;
  1242. // command_test += do_act_value + '" }';
  1243. set_key.push('do_act' + Z + '_' + Y);
  1244. if (DRY_CONTAINER_STATUS[do_act_value] != undefined ) {
  1245. // alert("!= undefined")
  1246. set_value.push(DRY_CONTAINER_STATUS[do_act_value]);
  1247. cond_com_data += DRY_CONTAINER_STATUS[do_act_value];
  1248. cond_com_list.push(cond_com_data);
  1249. } else {
  1250. // alert("== undefined")
  1251. set_value.push(do_act_value);
  1252. cond_com_data += do_act_value;
  1253. cond_com_list.push(cond_com_data);
  1254. }
  1255. // console.log("cond_com_list: " + cond_com_list)
  1256. // console.log("cond_com_data: " + cond_com_data)
  1257. }
  1258. } catch (error) {
  1259. if (error.name == 'TypeError') {
  1260. // console.log("do_obj" + z + "_" + y + ": null")
  1261. // set_Schedule += '"do_act' + z + '_' + y + '": "", ' ;
  1262. } else {
  1263. alert("do_act" + z + "_" + y + ": " + error.name)
  1264. }
  1265. }
  1266. }
  1267. // ===== 0324 測試 OK 勿刪 ===================================================
  1268. var A = 1;
  1269. var B = 1;
  1270. console.log("cond_add_list: " + cond_add_list);
  1271. console.log("cond_com_list: " + cond_com_list);
  1272. if (cond_main != '') {
  1273. TT['cond_main' + Z] = cond_main;
  1274. for (let a = 0; a < cond_add_list.length; a++) {
  1275. TT['cond_add'+ Z + '_' + A] = cond_add_list[a];
  1276. A = A + 1;
  1277. }
  1278. for (let b = 0; b < cond_com_list.length; b++) {
  1279. TT['cond_com'+ Z + '_' + B] = cond_com_list[b];
  1280. B = B + 1;
  1281. }
  1282. }
  1283. // ===== 0324 測試 OK 勿刪 ===================================================
  1284. cond_item.push(
  1285. "{'cond_main':'" + cond_main + "'}, " +
  1286. "{'cond_add':['" + cond_add_list.join("', '") + "']}, " +
  1287. "{'cond_com':['" + cond_com_list.join("', '") + "']}"
  1288. )
  1289. console.log("cond_item: [" + cond_item + "]")
  1290. }
  1291. // ===== 0324 測試 OK 勿刪 ===================================================
  1292. TT['mainLength'] = Z
  1293. TT['addLength'] = cond_add_list.length
  1294. TT['comLength'] = cond_com_list.length
  1295. // ===== 0324 測試 OK 勿刪 ===================================================
  1296. // 整理資料用
  1297. // set_Schedule += '"": ""}' ;
  1298. // console.log('set_Schedule: ' + set_Schedule)
  1299. // 0321 測試 new
  1300. $('#value_test').text("[{" + cond_item.join('}, {') + "}]")
  1301. // $('#command_test').text('command_test: ' + command_test)
  1302. var SQL_insert = 'INSERT INTO `dry_block_waiting` (' +
  1303. '`datetime`, `' + set_key.join("`, `") + '`) VALUES (' +
  1304. 'current_timestamp(), "' + set_value.join('", "') + '")';
  1305. var sql_data = { "sql":SQL_insert };
  1306. console.log("sql_data: ", sql_data)
  1307. $.get('/sql_get', sql_data, function (res) {
  1308. alert("OK")
  1309. }, 'json');
  1310. }
  1311. function MQTTtest() {
  1312. test();
  1313. // ===== 0324 測試 OK 勿刪 ===================================================
  1314. $.get('/dry_block_format', TT, function (res) {
  1315. alert("MQTT OK")
  1316. }, 'json');
  1317. // ===== 0324 測試 OK 勿刪 ===================================================
  1318. }
  1319. </script>
  1320. <div id="coffee_footer">
  1321. <!-- 匯入共同使用的 footer.html 內容 -->
  1322. {% include 'footer.html' %}
  1323. </div>
  1324. </div>
  1325. <script>
  1326. function showMotorValue(obj_num, value){
  1327. // document.getElementById("do_act1_1").innerHTML = value;
  1328. // console.log("newVal: " + newVal)
  1329. document.getElementById("motorValue_text" + obj_num).innerText = value;
  1330. }
  1331. function showTempValue(obj_num, value) {
  1332. document.getElementById("tempValue_text" + obj_num).innerText = value;
  1333. }
  1334. function showSleepValue(obj_num, value) {
  1335. document.getElementById("sleepValue_text" + obj_num).innerText = value + 's';
  1336. }
  1337. </script>
  1338. </body>
  1339. </html>