<!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>
<!--可用來建立使用者小圖示-->
<link rel="stylesheet" href="https://cdnjs.cloudflare.com/ajax/libs/font-awesome/4.7.0/css/font-awesome.min.css">
<style>
.newcondition_css {
padding: 10px;
margin-top: 10px;
background-color: honeydew;
}
hr {
margin-top: 5px;
margin-bottom: 5px;
}
</style>
</head>
<body>
<!--
<script>
// [系統]更新: Array / renew_system function
system_object = new Array();
system_object[0] = [" "];
system_object[1] = [" ", "清洗槽組立"];
system_object[2] = [" ", "發酵桶組立"];
system_object[3] = [" ", "乾燥桶組立"];
function renew_system(index) {
var Value="";
for(var i=0; i<system_object[index].length; i++){
Value = Value + '<option value=' + system_object[index][i] + '> ' + system_object[index][i] + '</option>';
}
var sectorSelect = document.getElementById("system");
sectorSelect.innerHTML = Value;
$('#product_index').text(index)
}
// [模組]更新: Array / renew_system function
module_object = new Array();
module_object[0] = [" "];
module_object[1] = [" ", "c1上蓋組立", "c2內桶槽組立"];
module_object[2] = [" ", "f1上蓋組立", "f2控制盒組立"];
module_object[3] = [" ", "d1上蓋組立", "d2控制盒組立"];
function renew_module(index) {
var Value="";
for(var i=0; i<module_object[index].length; i++){
Value = Value + '<option value=' + module_object[index][i] + '>' + module_object[index][i] + '</option>';
}
var sectorSelect = document.getElementById("module");
sectorSelect.innerHTML = Value;
$('#system_index').text(index)
}
// // [零件]更新: Array / renew_system function
component_object = new Array();
component_object[0] = [" "];
component_object[1][1] = [" ", "c1_M10平墊圈", "c1_M10螺帽"];
component_object[1][2] = [" ", "c2_內桶槽", "c2_內桶槽固定環"];
component_object[2][1] = [" ", "f1_吸料機入料管", "f1_入料斗擋板"];
component_object[2][2] = [" ", "f2_LED指示燈 綠色 TB12LED-G0201", "f2_K3 LED指示燈-主板"];
component_object[3][1] = [" ", "d1_軸心(單邊出軸)", "d1_墊片M18x25x1.5"];
component_object[3][2] = [" ", "d2_M3x5螺絲", "d2_M3x5銅柱 1公1母"];
function renew_component(product_index, index) {
var Value="";
for(var i=0; i<component_object[product_index][index].length; i++){
Value = Value + '<option value=' + component_object[product_index][index] + '>' + component_object[index][i] + '</option>';
}
var sectorSelect = document.getElementById("component");
sectorSelect.innerHTML = Value;
$('#module_index').text(index)
}
// // 輸出零件 index
function renew_item(index) {
$('#component_index').text(index)
}
</script>
-->
<br>
產品:
<select id="product" onChange="renew_system(this.selectedIndex);">
</select>
系統:
<select id="system" onChange="renew_module(this.selectedIndex);">
</select>
模組:
<select id="module" onChange="renew_component(this.selectedIndex);">
</select>
零件:
<select id="component" onChange="">
<input type="button" id="input_value" value="取值" onclick="printValue();"><br>
取值: <span id="span_value"></span>
</select><br>
<script>
// 輸出關鍵字
function printValue() {
// database 取值語法
var data = 'select * from teststock1213';
// 取得下拉式選單選擇的 value
var product_value = $("#product").val();
var system_value = $("#system").val();
var module_value = $("#module").val();
var component_value = $("#component").val();
if (product_value != '*' || system_value != '*' || module_value != '*' || component_value != '*') {
data += ' WHERE ';
if (product_value != '*') {
data += '`產品` = ' + product_value;
if (system_value != '*' || module_value != '*' || component_value != '*') {
data += ' AND ';
}
}
if (system_value != '*') {
data += '`系統` = ' + system_value;
if (module_value != '*' || component_value != '*') {
data += ' AND ';
}
}
if (module_value != '*') {
data += '`模組` = ' + module_value;
if (component_value != '*') {
data += ' AND ';
}
}
if (component_value != '*') {
data += '`零件` = ' + component_value;
}
}
// if product_value
$("#span_value").text(data)
}
// 資料庫中的所有 [產品]
var product_item = ["*", "清洗貨櫃", "發酵貨櫃", "乾燥貨櫃"]
var inner = '';
for (let i = 0; i < product_item.length; i++) {
inner += '<option value="' + product_item[i] + '">' + product_item[i] + '</option>';
}
var sectorSelect = document.getElementById("product");
sectorSelect.innerHTML = inner;
// 資料庫中的所有 [系統]
var system_item = ["*", "清洗槽組立", "發酵桶組立", "乾燥桶組立"]
var inner = '';
for (let i = 0; i < system_item.length; i++) {
inner += '<option value="' + system_item[i] + '">' + system_item[i] + '</option>';
}
var sectorSelect = document.getElementById("system");
sectorSelect.innerHTML = inner;
// 資料庫中的所有 [模組]
var module_item = ["*", "上蓋組立", "內桶槽組立", "控制盒組立"]
var inner = '';
for (let i = 0; i < module_item.length; i++) {
inner += '<option value="' + module_item[i] + '">' + module_item[i] + '</option>';
}
var sectorSelect = document.getElementById("module");
sectorSelect.innerHTML = inner;
// 資料庫中的所有 [零件]
var component_item = ["*", "M10平墊圈", "M10螺帽", "內桶槽", "內桶槽固定環", "吸料機入料管",
"入料斗擋板", "LED指示燈_綠色 TB12LED-G0201", "K3 LED指示燈-主板",
"軸心(單邊出軸)", "墊片M18x25x1.5", "M3x5螺絲", "M3x5銅柱 1公1母"]
var inner = '';
for (let i = 0; i < component_item.length; i++) {
inner += '<option value="' + component_item[i] + '">' + component_item[i] + '</option>';
}
var sectorSelect = document.getElementById("component");
sectorSelect.innerHTML = inner;
// !!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!
// 系統的 index
var sysIndex;
// [系統]更新: Array / renew_system function
system_object = new Array();
system_object[0] = ["*"];
system_object[1] = ["*", "清洗槽組立"];
system_object[2] = ["*", "發酵桶組立"];
system_object[3] = ["*", "乾燥桶組立"];
function renew_system(index) {
sysIndex = index
var inner = '';
for (let i = 0; i < system_object[index].length; i++) {
inner += '<option value="' + system_object[index][i] + '">' + system_object[index][i] + '</option>';
}
var sectorSelect = document.getElementById("system");
sectorSelect.innerHTML = inner;
}
// 模組的 index
var moIndex;
// [模組]更新: Array / renew_system function
module_object = new Array();
module_object[0] = ["*"];
module_object[1] = ["*", "清洗槽組立"];
module_object[2] = ["*", "發酵桶組立"];
module_object[3] = ["*", "乾燥桶組立"];
module_object[0][0] = ["*"];
module_object[1][1] = ["*", "c1上蓋組立", "c2內桶槽組立"];
module_object[2][1] = ["*", "f1上蓋組立", "f2控制盒組立"];
module_object[3][1] = ["*", "d1上蓋組立", "d2控制盒組立"];
function renew_module(index) {
moIndex = index
var inner = '';
for (let i = 0; i < module_object[sysIndex][index].length; i++) {
inner += '<option value="' + module_object[sysIndex][index][i] + '">' + module_object[sysIndex][index][i] + '</option>';
}
var sectorSelect = document.getElementById("module");
sectorSelect.innerHTML = inner;
}
// 零件
// // [零件]更新: Array / renew_system function
component_object = new Array();
component_object[0] = ["*"];
component_object[1] = ["*", "清洗槽組立"];
component_object[2] = ["*", "發酵桶組立"];
component_object[3] = ["*", "乾燥桶組立"];
component_object[0][0] = ["*"];
component_object[1][1] = ["*", "c1上蓋組立", "c2內桶槽組立"];
component_object[2][1] = ["*", "f1上蓋組立", "f2控制盒組立"];
component_object[3][1] = ["*", "d1上蓋組立", "d2控制盒組立"];
component_object[0][0][0] = ["*"];
component_object[1][1][0] = ["*"];
component_object[1][1][1] = ["*", "c1_M10平墊圈", "c1_M10螺帽"];
component_object[1][1][2] = ["*", "c2_內桶槽", "c2_內桶槽固定環"];
component_object[2][1][0] = ["*"];
component_object[2][1][1] = ["*", "f1_吸料機入料管", "f1_入料斗擋板"];
component_object[2][1][2] = ["*", "f2_LED指示燈 綠色 TB12LED-G0201", "f2_K3 LED指示燈-主板"];
component_object[3][1][0] = ["*"];
component_object[3][1][1] = ["*", "d1_軸心(單邊出軸)", "d1_墊片M18x25x1.5"];
component_object[3][1][2] = ["*", "d2_M3x5螺絲", "d2_M3x5銅柱 1公1母"];
function renew_component(index) {
var Value = "";
for (var i = 0; i < component_object[sysIndex][moIndex][index].length; i++) {
Value = Value + '<option value="' + component_object[sysIndex][moIndex][index][i] + '">' + component_object[sysIndex][moIndex][index][i] + '</option>';
}
var sectorSelect = document.getElementById("component");
sectorSelect.innerHTML = Value;
}
</script>
<!-- // 資料庫中的所有 [產品]
var product_item = ["*", "清洗貨櫃", "發酵貨櫃", "乾燥貨櫃"]
var inner = '';
for (let i = 0; i < product_item.length; i++) {
inner += '<option value="' + product_item[i] + '">' + product_item[i] + '</option>';
}
var sectorSelect = document.getElementById("product");
sectorSelect.innerHTML = inner; -->
<table class="table table-bordered">
<tr>
{% for i1 in labels %}
<th>{{i1}}</th>
{% endfor %}
</tr>
{% for i in content %}
<tr id="tr_content">
<td>{{ i[0] }}</td>
<td>{{ i[1] }}</td>
<td>{{ i[2] }}</td>
<td>{{ i[3] }}</td>
<td>{{ i[4] }}</td>
<td>{{ i[5] }}</td>
<td>{{ i[6] }}</td>
<td>{{ i[7] }}</td>
<td>{{ i[8] }}</td>
<td>{{ i[9] }}</td>
<td>{{ i[10] }}</td>
<td>{{ i[11] }}</td>
<td>{{ i[12] }}</td>
<td>{{ i[13] }}</td>
<td>{{ i[14] }}</td>
<td>{{ i[15] }}</td>
</tr>
{% endfor %}
</table>
</body>
</html>