{% extends "index.html" %}
{% block title %}水塔監控{% endblock %}
{% block head %}
{{ super() }}
{% endblock %}


{% block body %}
<script src="https://cdnjs.cloudflare.com/ajax/libs/Chart.js/2.6.0/Chart.js"></script>
<script type="text/javascript" src="/static/channel.js"></script>
<div id='select_boxes'>
    <select class="select-item" id="company-list" onChange="onChangeColumn1();">
        <option value=0>公司A</option>
    </select>
    <select class="select-item" id="factory-list" onChange="onChangeColumn2();">
        <option value=0>工廠A</option>
    </select>
    <select class="select-item" id="department-list" onChange="onChangeColumn3();">
        <option value=0>廠區A</option>
    </select>
    <select class="select-item" id="towerGroup-list">
        <option value=0>機組1</option>
    </select>
    <button id="tower_btn" onclick="click_button();"><i class="fas fa-search me-2"></i>搜尋</button>
</div>
<div id="tower-box">
    <div id="tower-img" class="card text-white">
        <select id="tower" onChange="show_tower_info();">
        </select>
    </div>
</div>
<div id='channel'></div>
<div id='channel_health'><p>健康指數:86 預測健康指標:89</p></div>
<div id='chart_info'></div>
<p>預測資訊 預測結果 正常 未來1125筆後CV值 0.801</p>
<canvas id="channel_predict" width="40" height="40"></canvas>
<canvas id="channel_frequency" width="40" height="40"></canvas>
<canvas id="CV_index" width="40" height="40"></canvas>
<canvas id="RPM" width="40" height="40"></canvas>
<canvas id="Vrms" width="40" height="40"></canvas>
<div id='tower_perfrom'></div>
{% endblock %}