<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<title>{{ title }}</title>
<meta name="viewport" content="width=device-width, initial-scale=1, shrink-to-fit=no">
<!-- 新 Bootstrap4 核心 CSS 文件 -->
<link rel="stylesheet" href="https://cdn.bootcss.com/bootstrap/4.1.0/css/bootstrap.min.css">
<!-- jQuery文件。务必在bootstrap.min.js 之前引入 -->
<script src="https://cdn.bootcss.com/jquery/3.2.1/jquery.min.js"></script>
<!-- popper.min.js 用于弹窗、提示、下拉菜单 -->
<script src="https://cdn.bootcss.com/popper.js/1.12.5/umd/popper.min.js"></script>
<!-- 最新的 Bootstrap4 核心 JavaScript 文件 -->
<script src="https://cdn.bootcss.com/bootstrap/4.1.0/js/bootstrap.min.js"></script>
<!--
<script src="../static/js/sign_in.js"></script>
<link rel="stylesheet" href="../static/css/sign_in.css">
-->
<style>
.DryContainer_position {
position: absolute;
top: 180px;
left: 270px;
}
.D1_position {
position: absolute;
top: 130px;
left: 245px;
width: 165px;
height: 50px;
text-align: center;
font-weight: bold;
}
.D2_position {
position: absolute;
top: 130px;
left: 425px;
width: 155px;
height: 50px;
text-align: center;
font-weight: bold;
}
.D3_position {
position: absolute;
top: 130px;
left: 605px;
width: 160px;
height: 50px;
text-align: center;
font-weight: bold;
}
.D4_position {
position: absolute;
top: 130px;
left: 780px;
width: 165px;
height: 50px;
text-align: center;
font-weight: bold;
}
.D5_position {
position: absolute;
top: 130px;
left: 960px;
width: 165px;
height: 50px;
text-align: center;
font-weight: bold;
}
.D6_position {
position: absolute;
top: 130px;
left: 1140px;
width: 165px;
height: 50px;
text-align: center;
font-weight: bold;
}
.D7_position {
position: absolute;
top: 615px;
left: 220px;
width: 165px;
height: 50px;
text-align: center;
font-weight: bold;
}
.D8_position {
position: absolute;
top: 615px;
left: 400px;
width: 165px;
height: 50px;
text-align: center;
font-weight: bold;
}
.D9_position {
position: absolute;
top: 615px;
left: 580px;
width: 165px;
height: 50px;
text-align: center;
font-weight: bold;
}
.D10_position {
position: absolute;
top: 615px;
left: 755px;
width: 160px;
height: 50px;
text-align: center;
font-weight: bold;
}
.D11_position {
position: absolute;
top: 615px;
left: 930px;
width: 170px;
height: 50px;
text-align: center;
font-weight: bold;
}
.D12_position {
position: absolute;
top: 615px;
left: 1115px;
width: 165px;
height: 50px;
text-align: center;
font-weight: bold;
}
.DI1_position {
position: absolute;
top: 130px;
left: 120px;
width: 100px;
height: 140px;
text-align: center;
font-weight: bold;
}
.DI2_position {
position: absolute;
top: 615px;
left: 110px;
width: 100px;
height: 140px;
text-align: center;
font-weight: bold;
}
.DO1_position {
position: absolute;
top: 130px;
left: 1315px;
width: 100px;
height: 140px;
text-align: center;
font-weight: bold;
}
.DO2_position {
position: absolute;
top: 615px;
left: 1315px;
width: 100px;
height: 140px;
text-align: center;
font-weight: bold;
}
.footer{
position: absolute;
bottom: 0px;
width: 100%;
background-color: #eee;
text-align: center;
}
.actuator_status {
width: 18px;
height: 18px;
background-color:black;
border-radius: 50%;
}
</style>
<script language="JavaScript">
// 指定 10秒 刷新網頁一次
var WebRestart
// WebRestart = setTimeout(function () { location.reload() }, 10000);
var status = '{{status}}';
$(document).ready(function(){
$("#coffee_title").text("乾燥貨櫃");
});
</script>
</head>
<body>
<div id="wrapper">
<div id="coffee_header">
<!-- 匯入共同使用的 header.html 內容 -->
{% include 'header.html' %}
</div>
<!--
background-color:rgb(0, 238, 255);
<div style="text-align: left;">
<a href="/index_new" style="float: left;"> 返回貨櫃首頁</a>
</div>
<div style="text-align: right;">
<a href="/camera_dry" style="float: right;">乾燥槽攝影機 </a>
</div>
<div style="text-align: center; margin-top: 30px; font-size: 24px;">
Smart Coffee
</div>
-->
<div>
<!-- 底圖 乾燥貨櫃 12 個乾燥桶槽 -->
<div id="DryContainer_pic" class="DryContainer_position">
<img src="../static/img/web_dry_container.png" style="margin: auto; width: 1000px;" >
</div>
<!-- 乾燥槽 D1 START-->
<div id="D1" tabindex="0" class="D1_position" role="button">
D1 status
<!-- D1 狀態點點-->
<div id="D1_status"
style="width: 100%; height: 20px; border-style: solid; border-color: whitesmoke; background-color: forestgreen;"></div>
</div>
<!-- 乾燥槽 D1 END-->
<!-- 乾燥槽 D2 -->
<div id="D2" tabindex="0" class="D2_position" role="button">
D2 status
<div id="D2_status"
style="width: 100%; height: 20px; border-style: solid; border-color: whitesmoke; background-color: forestgreen;"></div>
</div>
<!-- 乾燥槽 D3 -->
<div id="D3" tabindex="0" class="D3_position" role="button">
D3 status
<div id="D3_status"
style="width: 100%; height: 20px; border-style: solid; border-color: whitesmoke; background-color: forestgreen;"></div>
</div>
<!-- 乾燥槽 D4 -->
<div id="D4" tabindex="0" class="D4_position" role="button">
D4 status
<div id="D4_status"
style="width: 100%; height: 20px; border-style: solid; border-color: whitesmoke; background-color: forestgreen;"></div>
</div>
<!-- 乾燥槽 D5 -->
<div id="D5" tabindex="0" class="D5_position" role="button">
D5 status
<div id="D5_status"
style="width: 100%; height: 20px; border-style: solid; border-color: whitesmoke; background-color: forestgreen;"></div>
</div>
<!-- 乾燥槽 D6 -->
<div id="D6" tabindex="0" class="D6_position" role="button">
D6 status
<div id="D6_status"
style="width: 100%; height: 20px; border-style: solid; border-color: whitesmoke; background-color: forestgreen;"></div>
</div>
<!-- 乾燥槽 D7 -->
<div id="D7" tabindex="0" class="D7_position" role="button">
D7 status
<div id="D7_status"
style="width: 100%; height: 20px; border-style: solid; border-color: whitesmoke; background-color: #C0C0C0;"></div>
</div>
<!-- 乾燥槽 D8 -->
<div id="D8" tabindex="0" class="D8_position" role="button">
D8 status
<div id="D8_status"
style="width: 100%; height: 20px; border-style: solid; border-color: whitesmoke; background-color: #C0C0C0;"></div>
</div>
<!-- 乾燥槽 D9 -->
<div id="D9" tabindex="0" class="D9_position" role="button">
D9 status
<div id="D9_status"
style="width: 100%; height: 20px; border-style: solid; border-color: whitesmoke; background-color: #C0C0C0;"></div>
</div>
<!-- 乾燥槽 D10 -->
<div id="D10" tabindex="0" class="D10_position" role="button">
D10 status
<div id="D10_status"
style="width: 100%; height: 20px; border-style: solid; border-color: whitesmoke; background-color: #C0C0C0;"></div>
</div>
<!-- 乾燥槽 D11 -->
<div id="D11" tabindex="0" class="D11_position" role="button">
D11 status
<div id="D11_status"
style="width: 100%; height: 20px; border-style: solid; border-color: whitesmoke; background-color: #C0C0C0;"></div>
</div>
<!-- 乾燥槽 D12 -->
<div id="D12" tabindex="0" class="D12_position" role="button">
D12 status
<div id="D12_status"
style="width: 100%; height: 20px; border-style: solid; border-color: whitesmoke; background-color: #C0C0C0;"></div>
</div>
<!-- 乾燥槽_入料儲豆槽 DI1 -->
<div id="DI1" tabindex="0" class="DI1_position" role="button">
DI1 status
<div id="DI1_status"
style="width: 100%; height: 20px; border-style: solid; border-color: whitesmoke; background-color: #C0C0C0;"></div>
</div>
<!-- 乾燥槽_入料儲豆槽 DI2 -->
<div id="DI2" tabindex="0" class="DI2_position" role="button">
DI2 status
<div id="DI2_status"
style="width: 100%; height: 20px; border-style: solid; border-color: whitesmoke; background-color: #C0C0C0;"></div>
</div>
<!-- 乾燥槽_入料儲豆槽 DO1 -->
<div id="DO1" tabindex="0" class="DO1_position" role="button">
DO1 status
<div id="DO1_status"
style="width: 100%; height: 20px; border-style: solid; border-color: whitesmoke; background-color: #C0C0C0;"></div>
</div>
<!-- 乾燥槽_入料儲豆槽 DO2 -->
<div id="DO2" tabindex="0" class="DO2_position" role="button">
DO2 status
<div id="DO2_status"
style="width: 100%; height: 20px; border-style: solid; border-color: whitesmoke; background-color: #C0C0C0;"></div>
</div>
</div>
<!-- 乾燥槽互動視窗(模态框) -->
<div class="modal fade" id="D_Modal">
<div class="modal-dialog modal-dialog-centered" style="width: 400px;">
<div class="modal-content">
<!-- 互動視窗 標題 -->
<div class="modal-header">
<h4 id="Modal_title" class="modal-title">乾燥槽 D1 狀態</h4>
<button type="button" class="close" data-dismiss="modal">×</button>
</div>
<!-- 互動視窗 內容 -->
<div class="modal-body">
<table style="border:0px gray solid; width: 100%;" cellpadding="3">
<!--<table style="border:0px gray solid;-->
<tr>
<td><strong><a id="actuator_link" href="">制動器狀態</a></strong></td>
<td><strong><a id="sensor_link" href="">感測器狀態</a></strong></td>
</tr>
<tr>
<td style="vertical-align:text-top;">
<table style="border:0px gray solid;" cellpadding="3">
<!--font-size:12px; -->
<tr>
<td>
<div id="tank_vacuum_status" class="actuator_status">
</div>
</td>
<td>
<a id="Vacuum" href="">真空吸料機</a>
<!--<span id="tank_vacuum_t_status"></span>-->
</td>
</tr>
<tr>
<td>
<div id="tank_threewayvalve_status" class="actuator_status">
</div>
</td>
<td>
<a id="ThreeWayValve" href="">三通閥</a>
<!--<span id="tank_threewayvalve_t_status"></span>-->
</td>
</tr>
<tr>
<td>
<div id="tank_solenoid_disinfect_status" class="actuator_status">
</div>
</td>
<td>
<a id="SolenoidDisinfect" href="">消毒電磁閥</a>
<!--<span id="tank_solenoid_disinfect_t_status"></span>-->
</td>
</tr>
<tr>
<td>
<div id="tank_motor_status" class="actuator_status">
</div>
</td>
<td>
<a id="Motor" href="">馬達</a>
<!--<span id="tank_motor_t_status"></span>-->
</td>
</tr>
<tr>
<td>
<div id="tank_blower_status" class="actuator_status">
</div>
</td>
<td>
<a id="Blower" href="">鼓風機</a>
<!--<span id="tank_blower_t_status"></span>-->
</td>
</tr>
<tr>
<td>
<div id="tank_heater1_status" class="actuator_status">
</div>
</td>
<td>
<a id="Heater1" href="">加熱器 1</a>
<!--<span id="tank_heater1_t_status"></span>-->
</td>
</tr>
<tr>
<td>
<div id="tank_heater2_status" class="actuator_status">
</div>
</td>
<td>
<a id="Heater2" href="">加熱器 2</a>
<!--<span id="tank_heater2_t_status"></span>-->
</td>
</tr>
<tr>
<td>
<div id="tank_temp1_enable_status" class="actuator_status">
</div>
</td>
<td>
<a id="TempEnable" href="">溫控開關</a>
<!--<span id="tank_temp1_enable_t_status"></span>-->
</td>
</tr>
<tr>
<td>
<div id="tank_temp1_status" class="actuator_status">
</div>
</td>
<td>
<a id="Temp" href="">設定溫度</a>
<!--<span id="tank_temp1_t_status"></span>-->
</td>
</tr>
<tr>
<td>
<div id="tank_solenoid_water_status" class="actuator_status">
</div>
</td>
<td>
<a id="SolenoidWater" href="">排水電磁閥</a>
<!--<span id="tank_solenoid_water_t_status"></span>-->
</td>
</tr>
<tr>
<td>
<div id="tank_diskvalve_status" class="actuator_status">
</div>
</td>
<td>
<a id="DiskValve" href="">蝴蝶閥</a>
<!--<span id="tank_diskvalve_t_status"></span>-->
</td>
</tr>
</table>
</td>
<td style="vertical-align:text-top;">
<table style="border:0px gray solid;" cellpadding="3">
<!--font-size:12px; -->
<tr>
<td>
<a id="UltraSonic" href="">咖啡生豆高度</a>
</td>
<td>
<span id="UltraSonic_t_status"></span>
</td>
</tr>
<tr>
<td>
<a id="SHT11_Temp" href="">乾燥槽溫度</a>
</td>
<td>
<span id="SHT11_Temp_t_status"></span>
</td>
</tr>
<tr>
<td>
<a id="SHT11_Humidity" href="">乾燥槽濕度</a>
</td>
<td>
<span id="SHT11_Humidity_t_status"></span>
</td>
</tr>
<tr>
<td>
<a id="soil_Temp" href="">咖啡生豆溫度</a>
</td>
<td>
<span id="soil_Temp_t_status"></span>
</td>
</tr>
<tr>
<td>
<a id="soil_Humidity" href="">咖啡生豆濕度</a>
</td>
<td>
<span id="soil_Humidity_t_status"></span>
</td>
</tr>
<tr>
<td>
<a id="soil_EC" href="">咖啡生豆 EC</a>
</td>
<td>
<span id="soil_EC_t_status"></span>
</td>
</tr>
<tr>
<td>
<a id="PA" href="">桶內壓力</a>
</td>
<td>
<span id="PA_t_status"></span>
</td>
</tr>
<tr>
<td>
<a id="camera_dry_tid" href=""><strong>攝影機畫面</strong></a>
</td>
</tr>
</table>
</td>
</tr>
</table>
</div>
</div>
</div>
</div>
<!-- 乾燥槽入料儲豆槽互動視窗(模态框) -->
<div class="modal fade" id="DI_Modal">
<div class="modal-dialog modal-dialog-centered" style="width: 400px;">
<div class="modal-content">
<!-- 互動視窗 標題 -->
<div class="modal-header">
<h4 id="Modal_title_input" class="modal-title">乾燥入料儲豆槽 DI1 狀態</h4>
<button type="button" class="close" data-dismiss="modal">×</button>
</div>
<!-- 互動視窗 內容 -->
<div class="modal-body">
<table style="border:0px gray solid; width: 100%;" cellpadding="3">
<!--<table style="border:0px gray solid;-->
<tr>
<td><strong><a id="actuator_link_input" href="">制動器狀態</a></strong></td>
<td><strong><a id="sensor_link_input" href="">感測器狀態</a></strong></td>
</tr>
<tr>
<td style="vertical-align:text-top;">
<table style="border:0px gray solid;" cellpadding="3">
<!--font-size:12px; -->
<tr>
<td>
<div id="input_vacuum_status" class="actuator_status">
</div>
</td>
<td>
<a id="Vacuum_input" href="">真空吸料機</a>
<!--<span id="tank_vacuum_t_status"></span>-->
</td>
</tr>
</table>
</td>
<td style="vertical-align:text-top;">
<table style="border:0px gray solid;" cellpadding="3">
<!--font-size:12px; -->
<tr>
<td>
<a id="DI_UltraSonic" href="">咖啡生豆高度</a>
</td>
<td>
<span id="DI_UltraSonic_t_status"></span>
</td>
</tr>
<tr>
<td>
<a id="DI_camera_dry_tid" href=""><strong>攝影機畫面</strong></a>
</td>
</tr>
</table>
</td>
</tr>
</table>
</div>
</div>
</div>
</div>
<!-- 乾燥槽出料儲豆槽互動視窗(模态框) -->
<div class="modal fade" id="DO_Modal">
<div class="modal-dialog modal-dialog-centered" style="width: 400px;">
<div class="modal-content">
<!-- 互動視窗 標題 -->
<div class="modal-header">
<h4 id="Modal_title_output" class="modal-title">乾燥入料儲豆槽 DI1 狀態</h4>
<button type="button" class="close" data-dismiss="modal">×</button>
</div>
<!-- 互動視窗 內容 -->
<div class="modal-body">
<table style="border:0px gray solid; width: 100%;" cellpadding="3">
<!--<table style="border:0px gray solid;-->
<tr>
<td><strong><a id="actuator_link_output" href="">制動器狀態</a></strong></td>
<td><strong><a id="sensor_link_output" href="">感測器狀態</a></strong></td>
</tr>
<tr>
<td style="vertical-align:text-top;">
<table style="border:0px gray solid;" cellpadding="3">
<!--font-size:12px; -->
<tr>
<td>
<div id="output_vacuum_status"
style="width: 18px; height: 18px; background-color:black; border-radius: 50%;">
</div>
</td>
<td>
<a id="Vacuum_output" href="">真空吸料機</a>
<!--<span id="tank_vacuum_t_status"></span>-->
</td>
</tr>
</table>
</td>
<td style="vertical-align:text-top;">
<table style="border:0px gray solid;" cellpadding="3">
<!--font-size:12px; -->
<tr>
<td>
<a id="DO_UltraSonic" href="/chart_DO/UltraSonic/1">咖啡生豆高度</a>
</td>
<td>
<span id="DO_UltraSonic_t_status"></span>
</td>
</tr>
<tr>
<td>
<a id="DO_camera_dry_tid" href=""><strong>攝影機畫面</strong></a>
</td>
</tr>
</table>
</td>
</tr>
</table>
</div>
</div>
</div>
</div>
<script>
function update_data_D(dtid) {
console.log('dry_tank_id:' + dtid)
// dtid = dry_tank_id
$.get('/loading/D' + dtid, '', function (res) {
if (res.tank_vacuum == 0) {
$("#tank_vacuum_status").css("background-color", "#C0C0C0")
} else if (res.tank_vacuum == 1) {
$("#tank_vacuum_status").css("background-color", "forestgreen")
} else { $("#tank_vacuum_status").css("background-color", "crimson") }
if (res.tank_threewayvalve == 0) {
$("#tank_threewayvalve_status").css("background-color", "#C0C0C0")
} else if (res.tank_threewayvalve == 1) {
$("#tank_threewayvalve_status").css("background-color", "forestgreen")
} else { $("#tank_threewayvalve_status").css("background-color", "crimson") }
if (res.tank_diskvalve == 0) {
$("#tank_diskvalve_status").css("background-color", "#C0C0C0")
} else if (res.tank_diskvalve == 1) {
$("#tank_diskvalve_status").css("background-color", "forestgreen")
} else { $("#tank_diskvalve_status").css("background-color", "crimson") }
if (res.tank_solenoid_disinfect == 0) {
$("#tank_solenoid_disinfect_status").css("background-color", "#C0C0C0")
} else if (res.tank_solenoid_disinfect == 1) {
$("#tank_solenoid_disinfect_status").css("background-color", "forestgreen")
} else { $("#tank_solenoid_disinfect_status").css("background-color", "crimson") }
if (res.tank_solenoid_water == 0) {
$("#tank_solenoid_water_status").css("background-color", "#C0C0C0")
} else if (res.tank_solenoid_water == 1) {
$("#tank_solenoid_water_status").css("background-color", "forestgreen")
} else { $("#tank_solenoid_water_status").css("background-color", "crimson") }
if (res.tank_motor == 0) {
$("#tank_motor_status").css("background-color", "#C0C0C0")
} else if (res.tank_motor > 0 || res.tank_motor < 0) {
$("#tank_motor_status").css("background-color", "forestgreen")
} else { $("#tank_motor_status").css("background-color", "crimson") }
if (res.tank_blower == 0) {
$("#tank_blower_status").css("background-color", "#C0C0C0")
} else if (res.tank_blower == 1) {
$("#tank_blower_status").css("background-color", "forestgreen")
} else { $("#tank_blower_status").css("background-color", "crimson") }
if (res.tank_heater1 == 0) {
$("#tank_heater1_status").css("background-color", "#C0C0C0")
} else if (res.tank_heater1 == 1) {
$("#tank_heater1_status").css("background-color", "forestgreen")
} else { $("#tank_heater1_status").css("background-color", "crimson") }
if (res.tank_heater2 == 0) {
$("#tank_heater2_status").css("background-color", "#C0C0C0")
} else if (res.tank_heater2 == 1) {
$("#tank_heater2_status").css("background-color", "forestgreen")
} else { $("#tank_heater2_status").css("background-color", "crimson") }
if (res.tank_temp1_enable == 0) {
$("#tank_temp1_enable_status").css("background-color", "#C0C0C0")
} else if (res.tank_temp1_enable == 1) {
$("#tank_temp1_enable_status").css("background-color", "forestgreen")
} else { $("#tank_temp1_enable_status").css("background-color", "crimson") }
if (res.tank_temp1 == 0) {
$("#tank_temp1_status").css("background-color", "#C0C0C0")
} else if (res.tank_temp1 > 0) {
$("#tank_temp1_status").css("background-color", "forestgreen")
} else { $("#tank_temp1_status").css("background-color", "crimson") }
$("#tank_vacuum_t_status").text(res.tank_vacuum);
$("#tank_threewayvalve_t_status").text(res.tank_threewayvalve);
$("#tank_diskvalve_t_status").text(res.tank_diskvalve);
$("#tank_solenoid_disinfect_t_status").text(res.tank_solenoid_disinfect);
$("#tank_solenoid_water_t_status").text(res.tank_solenoid_water);
$("#tank_motor_t_status").text(res.tank_motor);
$("#tank_blower_t_status").text(res.tank_blower);
$("#tank_heater1_t_status").text(res.tank_heater1);
$("#tank_heater2_t_status").text(res.tank_heater2);
$("#tank_temp1_enable_t_status").text(res.tank_temp1_enable);
$("#tank_temp1_t_status").text(res.tank_temp1);
$("#UltraSonic_t_status").text(res.UltraSonic);
$("#SHT11_Temp_t_status").text(res.SHT11_Temp);
$("#SHT11_Humidity_t_status").text(res.SHT11_Humidity);
$("#soil_Temp_t_status").text(res.soil_Temp);
$("#soil_Humidity_t_status").text(res.soil_Humidity);
$("#soil_EC_t_status").text(res.soil_EC);
$("#PA_t_status").text(res.PA);
}, 'json');
$('#Modal_title').text("乾燥槽 D" + dtid + " 狀態")
if (status == 2) {
$('#actuator_link').attr("title", "使用者無修改權限")
$('#sensor_link').attr("title", "使用者無修改權限")
$('#Vacuum').attr("title", "使用者無修改權限")
$('#ThreeWayValve').attr("title", "使用者無修改權限")
$('#SolenoidDisinfect').attr("title", "使用者無修改權限")
$('#Motor').attr("title", "使用者無修改權限")
$('#Blower').attr("title", "使用者無修改權限")
$('#Heater1').attr("title", "使用者無修改權限")
$('#Heater2').attr("title", "使用者無修改權限")
$('#TempEnable').attr("title", "使用者無修改權限")
$('#Temp').attr("title", "使用者無修改權限")
$('#SolenoidWater').attr("title", "使用者無修改權限")
$('#DiskValve').attr("title", "使用者無修改權限")
} else if ( (status == 0) || (status == 1) ) {
$('#actuator_link').attr("href", "/dry_container_tank/" + dtid)
$('#sensor_link').attr("href", "/dry_container_tank/" + dtid)
$('#Vacuum').attr("href", "/ctrl_D_Vacuum/" + dtid)
$('#ThreeWayValve').attr("href", "/ctrl_D_ThreeWayValve/" + dtid)
$('#SolenoidDisinfect').attr("href", "/ctrl_D_SolenoidDisinfect/" + dtid)
$('#Motor').attr("href", "/ctrl_D_Motor/" + dtid)
$('#Blower').attr("href", "/ctrl_D_Blower/" + dtid)
$('#Heater1').attr("href", "/ctrl_D_Heater1/" + dtid)
$('#Heater2').attr("href", "/ctrl_D_Heater2/" + dtid)
$('#TempEnable').attr("href", "/ctrl_D_TempEnable/" + dtid)
$('#Temp').attr("href", "/ctrl_D_Temp/" + dtid)
$('#SolenoidWater').attr("href", "/ctrl_D_SolenoidWater/" + dtid)
$('#DiskValve').attr("href", "/ctrl_D_DiskValve/" + dtid)
}
$('#SHT11_Temp').attr("href", "/chart_D/SHT11_Temp/" + dtid)
$('#SHT11_Humidity').attr("href", "/chart_D/SHT11_Humidity/" + dtid)
$('#UltraSonic').attr("href", "/chart_D/UltraSonic/" + dtid)
$('#PA').attr("href", "/chart_D/PA/" + dtid)
$('#soil_Temp').attr("href", "/chart_D/soil_Temp/" + dtid)
$('#soil_Humidity').attr("href", "/chart_D/soil_Humidity/" + dtid)
$('#soil_EC').attr("href", "/chart_D/soil_EC/" + dtid)
$('#camera_dry_tid').attr("href", "/camera_D" + dtid)
$('#D_Modal').modal('show');
}
function update_data_DI(ditid){
console.log('dry_input_tank_id:' + ditid)
// ditid = dry_input_tank_id
$.get('/loading/DI' + ditid, '', function (res) {
if (res.input_vacuum == 0) {
$("#input_vacuum_status").css("background-color", "#C0C0C0")
} else if (res.input_vacuum == 1) {
$("#input_vacuum_status").css("background-color", "forestgreen")
} else { $("#input_vacuum_status").css("background-color", "crimson") }
$("#DI_UltraSonic_t_status").text(res.input_UltraSonic);
}, 'json');
$('#Modal_title_input').text("乾燥入料儲豆槽 DI" + ditid + " 狀態")
if (status == 2) {
$('#actuator_link').attr("title", "使用者無修改權限")
$('#sensor_link').attr("title", "使用者無修改權限")
$('#Vacuum_input').attr("title", "使用者無修改權限")
} else if ( (status == 0) || (status == 1) ) {
$('#actuator_link_input').attr("href", "/dry_container_input/" + ditid)
$('#sensor_link_input').attr("href", "/dry_container_input/" + ditid)
$('#Vacuum_input').attr("href", "/ctrl_DI_Vacuum/" + ditid)
}
$('#DI_UltraSonic').attr("href", "/chart_DI/UltraSonic/" + ditid)
$('#DI_camera_dry_tid').attr("href", "/camera_DI" + ditid)
$('#DI_Modal').modal('show');
};
function update_data_DO(dotid){
console.log('dry_output_tank_id:' + dotid)
// dotid = dry_output_tank_id
$.get('/loading/DO' + dotid, '', function (res) {
if (res.output_vacuum == 0) {
$("#output_vacuum_status").css("background-color", "#C0C0C0")
} else if (res.output_vacuum == 1) {
$("#output_vacuum_status").css("background-color", "forestgreen")
} else { $("#output_vacuum_status").css("background-color", "crimson") }
$("#DO_UltraSonic_t_status").text(res.output_UltraSonic);
}, 'json');
$('#Modal_title_output').text("乾燥出料儲豆槽 DO" + dotid + " 狀態")
if (status == 2) {
$('#actuator_link').attr("title", "使用者無修改權限")
$('#sensor_link').attr("title", "使用者無修改權限")
$('#Vacuum_output').attr("title", "使用者無修改權限")
} else if ( (status == 0) || (status == 1) ) {
$('#actuator_link_output').attr("href", "/dry_container_output/" + dotid)
$('#sensor_link_output').attr("href", "/dry_container_output/" + dotid)
$('#Vacuum_output').attr("href", "/ctrl_DO_Vacuum/" + dotid)
}
$('#DO_UltraSonic').attr("href", "/chart_DO/UltraSonic/" + dotid)
$('#DO_camera_dry_tid').attr("href", "/camera_DO" + dotid)
$('#DO_Modal').modal('show');
};
var button_D1 = document.getElementById('D1');
button_D1.addEventListener('click', function () { update_data_D("1") });
var button_D2 = document.getElementById('D2');
button_D2.addEventListener('click', function () { update_data_D("2") });
var button_D3 = document.getElementById('D3');
button_D3.addEventListener('click', function () { update_data_D("3") });
var button_D4 = document.getElementById('D4');
button_D4.addEventListener('click', function () { update_data_D("4") });
var button_D5 = document.getElementById('D5');
button_D5.addEventListener('click', function () { update_data_D("5") });
var button_D6 = document.getElementById('D6');
button_D6.addEventListener('click', function () { update_data_D("6") });
var button_D7 = document.getElementById('D7');
button_D7.addEventListener('click', function () { update_data_D("7") });
var button_D8 = document.getElementById('D8');
button_D8.addEventListener('click', function () { update_data_D("8") });
var button_D9 = document.getElementById('D9');
button_D9.addEventListener('click', function () { update_data_D("9") });
var button_D10 = document.getElementById('D10');
button_D10.addEventListener('click', function () { update_data_D("10") });
var button_D11 = document.getElementById('D11');
button_D11.addEventListener('click', function () { update_data_D("11") });
var button_D12 = document.getElementById('D12');
button_D12.addEventListener('click', function () { update_data_D("12") });
var button_DI1 = document.getElementById('DI1');
button_DI1.addEventListener('click', function () { update_data_DI("1") });
var button_DI2 = document.getElementById('DI2');
button_DI2.addEventListener('click', function () { update_data_DI("2") });
var button_DO1 = document.getElementById('DO1');
button_DO1.addEventListener('click', function () { update_data_DO("1") });
var button_DO2 = document.getElementById('DO2');
button_DO2.addEventListener('click', function () { update_data_DO("2") });
</script>
<!--
<footer class="footer">
<div style="text-align: center; margin-top: 10px; font-size: 13px; margin-bottom: 10px;">
Copyright © 2021 Gold-in Tech. All Rights Reserved. 金子進科技股份有限公司 版權所有
<a href="mailto:service.gitc@gmail.com" target="_blank">service.gitc@gmail.com</a>
</div>
</footer>
-->
<div id="coffee_footer">
<!-- 匯入共同使用的 footer.html 內容 -->
{% include 'footer.html' %}
</div>
</div>
</body>
</html>