ProductionLineMonitor/ProductionLineMonitor.Web/Views/ProductionLine/Index.cshtml

@{
    ViewData["TitleController"] = "产线详情";
    ViewData["TitleAction"] = "";
    ViewData["TitleActionDescription"] = "产线详细信息";
    ViewData["Title"] = "产线详情";
}

@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">
}
<div 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-lg-12">
                    <div class="input-group date" style="width:280px;float:left; padding-left:2px">
                        <div class="input-group-addon">日期</div>
                        <input id="date" type="text" class="form-control" value="@DateTime.Now.AddDays(-1).ToString("yyyy-MM-dd")">
                    </div>
                    <div style="float:left;">
                        <span>&nbsp;&nbsp;</span>
                    </div>
                    <div class="btn-group" style="float:left">
                        <button onclick="shortcut(-2)" class="btn btn-default">前天</button>
                        <button onclick="shortcut(-1)" class="btn btn-default">昨天</button>
                        <button onclick="shortcut(0)" class="btn btn-default">今天</button>
                    </div>
                </div>
                <div class="col-xs-12">
                    <div class="tab-content">
                        <div class="tab-pane" id="line">
                            <div class="col-md-12" style="overflow:auto">
                                <p class="title">
                                    <strong>机台 产能、稼动、OEE</strong>
                                </p>
                                <table id="table1" class="table table-hover">
                                    <thead>
                                        <tr>
                                            <th>序号</th>
                                            <th>机台</th>
                                            <th>类型</th>
                                            <th>机种</th>
                                            <th>产能(pcs)</th>
                                            <th>可用率(%)</th>
                                            <th>表现性(%)</th>
                                            <th>OEE(%)</th>
                                        </tr>
                                    </thead>
                                    <tbody>
                                    </tbody>
                                </table>
                            </div>
                            <div class="col-md-12" style="overflow:auto">
                                <p class="title">
                                    <strong>故障TOP10</strong>
                                </p>
                                <table id="table2" class="table table-hover">
                                    <thead>
                                        <tr>
                                            <th style="width:10%">序号</th>
                                            <th>机台</th>
                                            <th>开始时间</th>
                                            <th>结束时间</th>
                                            <th>机台状态</th>
                                            <th>时长(min)</th>
                                            <th>故障码</th>
                                            <th>故障详情</th>
                                        </tr>
                                    </thead>
                                    <tbody>
                                    </tbody>
                                </table>
                            </div>
                        </div>
                        <div class="tab-pane" id="machine">
                            <div class="col-md-12">
                                <p class="title">
                                    <strong>早班</strong>
                                </p>
                                <table id="table3" class="table table-hover">
                                    <thead>
                                        <tr>
                                            <th>时段</th>
                                            <th>机种</th>
                                            <th>运行</th>
                                            <th>报警</th>
                                            <th>待料</th>
                                            <th>产能</th>
                                            <th>TT</th>
                                            <th>报警次数</th>
                                            <th>换料次数</th>
                                            <th>换料时间</th>
                                        </tr>
                                    </thead>
                                    <tbody>
                                    </tbody>
                                </table>
                                <p class="title">
                                    <strong>夜班</strong>
                                </p>
                                <table id="table4" class="table table-hover">
                                    <thead>
                                        <tr>
                                            <th>时段</th>
                                            <th>机种</th>
                                            <th>运行</th>
                                            <th>报警</th>
                                            <th>待料</th>
                                            <th>产能</th>
                                            <th>TT</th>
                                            <th>报警次数</th>
                                            <th>换料次数</th>
                                            <th>换料时间</th>
                                        </tr>
                                    </thead>
                                    <tbody>
                                    </tbody>
                                </table>
                            </div>
                            <div class="col-md-12" style="overflow:auto">
                                <p class="title">
                                    <strong>机台 产能、稼动、OEE</strong>
                                </p>
                                <table id="machine_oee" class="table table-hover">
                                    <thead>
                                        <tr>
                                            <th>序号</th>
                                            <th>机种</th>
                                            <th>产能(pcs)</th>
                                            <th>可用率(%)</th>
                                            <th>表现性(%)</th>
                                            <th>OEE(%)</th>
                                        </tr>
                                    </thead>
                                    <tbody>
                                    </tbody>
                                </table>
                            </div>
                            <div class="col-md-12" style="overflow:auto">
                                <p class="title">
                                    <strong>故障TOP10</strong>
                                </p>
                                <table id="machine_alarm" class="table table-hover">
                                    <thead>
                                        <tr>
                                            <th>序号</th>
                                            <th>开始时间</th>
                                            <th>结束时间</th>
                                            <th>机台状态</th>
                                            <th>时长(min)</th>
                                            <th>故障码</th>
                                            <th>故障信息</th>
                                        </tr>
                                    </thead>
                                    <tbody>
                                    </tbody>
                                </table>
                            </div>
                        </div>
                    </div>
                </div>
            </div>
        </div>
    </div>
</div>

@section footer{
    <script src="~/lib/zTree.v3/js/jquery.ztree.core.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="~/js/production-line/production-line.js"></script>
    }