@{
    ViewData["TitleController"] = "OEE";
    ViewData["TitleAction"] = "";
    ViewData["TitleActionDescription"] = "机台OEE详情";
    ViewData["Title"] = "OEE Machine";
}

@section header {
    <link rel="stylesheet" href="~/lib/zTree.v3/css/zTreeStyle/zTreeStyle.min.css">
    <link rel="stylesheet" href="~/lib/adminlte/bower/bootstrap-datepicker/dist/css/bootstrap-datepicker.min.css" />
    <style>
        table {
            border-right: 1px solid WhiteSmoke;
            border-bottom: 1px solid WhiteSmoke;
            text-align: center;
        }

            table th {
                border-left: 1px solid WhiteSmoke;
                border-top: 1px solid WhiteSmoke;
                text-align: center;
            }

            table td {
                border-left: 1px solid WhiteSmoke;
                border-top: 1px solid WhiteSmoke;
            }
    </style>
}
<div id="app" class="col-md-12">
    <div class="box box-primary">
        <div class="box-body">
            <div class="col-md-2">
                <div class="over">
                    <ul id="productionLineTree" class="ztree"></ul>
                </div>
            </div>
            <div class="col-md-10">
                <div class="col-md-12">
                    <div class="input-group input-daterange" style="width:400px;float:left;padding:0px">
                        <div class="input-group-addon">起止日期</div>
                        <input id="date1" type="text" class="form-control" value="@DateTime.Now.AddDays(-7).ToString("yyyy-MM-dd")">
                        <div class="input-group-addon">-</div>
                        <input id="date2" type="text" class="form-control" value="@DateTime.Now.AddDays(-1).ToString("yyyy-MM-dd")">
                    </div>
                    <div class="col-md-1">
                        <div class="btn-group">
                            <button type="button" class="btn btn-block btn-default"
                                    v-on:click="getOEES()">
                                <i class="fa fa-search"></i> 查询
                            </button>
                        </div>
                    </div>
                </div>
                <div class="col-md-12" style="padding-top: 20px;">
                    <div class="box-body">
                        <p class="text-center">
                            <strong>稼动曲线</strong>
                        </p>
                        <div id="container1" 
                            style="height: 400px;">
                        </div>
                       @*  <div id="container2" style="height: 280px">
                        </div> *@
                    </div>
                </div>
                <div class="col-md-6" style="padding-top: 10px;">
                    <p class="text-center">
                        日期：{{ outputInfo }}
                    </p>
                    <table id="data" height="300px" style="margin-left: 4px">
                        <thead>
                            <tr>
                                <th style="width: 10%">时段</th>
                                <th style="width: 10%">机种</th>
                                <th style="width: 10%">运行时间</th>
                                <th style="width: 10%">报警时间</th>
                                <th style="width: 10%">待料时间</th>
                                <th style="width: 10%">产能</th>
                                <th style="width: 10%">TT</th>
                                <th style="width: 10%">报警次数</th>
                            </tr>
                        </thead>
                        <tbody>
                            <tr v-for="(output, index) in outputs">
                                <td>{{ output.period }}</td>
                                <td>{{ output.moduleType }}</td>
                                <td>{{ output.autoRunTime / 60 }}</td>
                                <td>{{ output.alarmTime / 60 }}</td>
                                <td>{{ output.idleTime / 60 }}</td>
                                <td>{{ output.outPut }}</td>
                                <td>{{ output.tt }}</td>
                                <td>{{ output.alarmSum }}</td>
                            </tr>
                        </tbody>
                    </table>
                </div>
            </div>
        </div>
    </div>
</div>

    @section footer {
        <script src="/lib/zTree.v3/js/jquery.ztree.core.min.js"></script>
        <script src="~/lib/xlsx/xlsx.full.min.js"></script>
        <script src="~/lib/adminlte/bower/bootstrap-datepicker/js/bootstrap-datepicker.js"></script>
        <script src="~/lib/adminlte/bower/bootstrap-datepicker/js/locales/bootstrap-datepicker.zh-cn.js"></script>
        <script src="~/lib/echarts/echarts.min.js"></script>
        <script src="~/js/report-form/report-form-v1.js"></script>
    }