<%@ page language="C#" autoeventwireup="true" inherits="sysadmin_Equipment_UseStatistics, App_Web_equipment_usestatistics.aspx.a929186b" enableEventValidation="false" %>

<%@ Register Src="~/sadmin/NewHeader.ascx" TagPrefix="uc1" TagName="NewHeader" %>

<!DOCTYPE html >
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
    <title>网上预约系统</title>
    <meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
    <meta http-equiv="X-UA-Compatible" content="IE=edge" />
    <link href="/control/plugin/bootstrap3/css/bootstrap.min.css" rel="stylesheet" />
    <script src="/control/js/jquery.js"></script>
    <!-- ionicons -->
    <link href="/lib/ionicons/ionicons.min.css" rel="stylesheet" />
    <!-- Animate -->
    <link href="/lib/animate/animate.min.css" rel="stylesheet" />
    <!-- base -->
    <link href="/css/base.css" rel="stylesheet" />
    
    <!--[if lt IE 9]>
      <script src="/js/html5shiv.min.js"></script>
      <script src="/js/respond.min.js"></script>
    <![endif]-->
</head>
<body>
    <div class="wrapper">
        <uc1:NewHeader runat="server" ID="NewHeader" />
        <div class="container">
            <div class="row">
                <div class="col-lg-12">
                    <h3 class="page-header"><i class="glyphicon glyphicon-envelope"></i>预约设备分配统计 <small>统计预约设备累计时长，预约设备累计分配次数 </small></h3>
                    <div class="panel panel-default">
                        <div class="panel-body">
                            <!-- Nav tabs -->
                            <ul class="nav nav-tabs" role="tablist">
                                <li role="presentation" class="active"><a href="#home" role="tab" data-toggle="tab">累计时长</a></li>
                                <li role="presentation"><a href="#profile" role="tab" data-toggle="tab">累计次数</a></li>
                            </ul>
                            <!-- Tab panes -->
                            <div class="tab-content">
                                <div role="tabpanel" class="tab-pane active" id="home">
                                    <div id="container"></div>

                                    <script type="text/javascript">
                                        $(function () {
                                            Highcharts.chart('container', {
                                                
                                                data: {
                                                    table: 'dataView'
                                                },
                                                chart: {
                                                    type: 'bar'
                                                },
                                                title: {
                                                    text: '累计时长统计'
                                                },
                                                subtitle: {
                                                    text: '网上预约平台'
                                                },
                                                yAxis: {
                                                    min: 0,
                                                    title: {
                                                        text: '累计时长',
                                                        align: 'high'
                                                    },
                                                    labels: {
                                                        overflow: 'justify'
                                                    }
                                                },
                                                tooltip: {
                                                    valueSuffix: ' 小时'
                                                },
                                                plotOptions: {
                                                    bar: {
                                                        dataLabels: {
                                                            enabled: true
                                                        }
                                                    }
                                                },
                                                legend: {
                                                    layout: 'vertical',
                                                    align: 'right',
                                                    verticalAlign: 'top',
                                                    x: -40,
                                                    y: 100,
                                                    floating: true,
                                                    borderWidth: 1,
                                                    backgroundColor: ((Highcharts.theme && Highcharts.theme.legendBackgroundColor) || '#FFFFFF'),
                                                    shadow: true
                                                },
                                                credits: {
                                                    enabled: false
                                                }
                                            });
                                        });
                                    </script>

                                    <div class=" panel-heading">
                                         累计时长
                                    </div>
                                    <div class="panel-body">
                                       <div class="table-responsive">
                                            <asp:Repeater ID="rptData" runat="server">
                                                <HeaderTemplate>
                                                    <table id="dataView" class="table table-hover ">
                                                        <thead>
                                                            <tr class='table-heading'>
                                                                <th>预约设备</th>
                                                                <th>累计时长</th>

                                                            </tr>
                                                        </thead>
                                                        <tbody>
                                                </HeaderTemplate>
                                                <ItemTemplate>
                                                    <tr>
                                                        <th><%#Eval("e_name") %></th>
                                                        <td><%#(Convert.ToDecimal(Eval("useHour")) / 60M).ToString("0.00") %></td>

                                                    </tr>
                                                </ItemTemplate>
                                                <FooterTemplate>
                                                    </tbody> 
                                                    </table>
                
                                                     <div class="alert alert-warning" style="display: <%#bool.Parse((rptData.Items.Count==0).ToString())?"block":"none"%>">

                                                         <strong>暂无预约</strong>

                                                     </div>

                                                </FooterTemplate>
                                            </asp:Repeater>
                                        </div>
                                    </div>
                                </div>
                                <div role="tabpanel" class="tab-pane" id="profile">
                                      <div id="container2" style="width:1068px"></div>
                                        <script type="text/javascript">
                                            $(function () {
                                                Highcharts.chart('container2', {
                                                    data: {
                                                        table: 'dataCount'
                                                    },
                                                    chart: {
                                                        type: 'bar'
                                                    },
                                                    title: {
                                                        text: '累计次数'
                                                    },
                                                    subtitle: {
                                                        text: '网上预约平台'
                                                    },
                                                    yAxis: {
                                                        min: 0,
                                                        title: {
                                                            text: '累计次数',
                                                            align: 'high'
                                                        },
                                                        labels: {
                                                            overflow: 'justify'
                                                        }
                                                    },
                                                    tooltip: {
                                                        valueSuffix: '次'
                                                    },
                                                    plotOptions: {
                                                        bar: {
                                                            dataLabels: {
                                                                enabled: true
                                                            }
                                                        }
                                                    },
                                                    legend: {
                                                        layout: 'vertical',
                                                        align: 'right',
                                                        verticalAlign: 'top',
                                                        x: -40,
                                                        y: 100,
                                                        floating: true,
                                                        borderWidth: 1,
                                                        backgroundColor: ((Highcharts.theme && Highcharts.theme.legendBackgroundColor) || '#FFFFFF'),
                                                        shadow: true
                                                    },
                                                    credits: {
                                                        enabled: false
                                                    }
                                                });
                                            });
                                        </script>
                                    <div class=" panel-heading">
                                        累计次数
                                    </div>
                                    <div class="panel-body">
                                          <div class="table-responsive">
                                            <asp:Repeater ID="rptCount" runat="server">
                                                <HeaderTemplate>
                                                    <table id="dataCount" class="table table-hover ">
                                                        <thead>
                                                            <tr class='table-heading'>
                                                                <th>预约设备</th>
                                                                <th>累计次数</th>
                                                            </tr>
                                                        </thead>
                                                        <tbody>
                                                </HeaderTemplate>
                                                <ItemTemplate>
                                                    <tr>
                                                        <th><%#Eval("e_name") %></th>
                                                        <td><%#Eval("useCount") %></td>
                                                    </tr>
                                                </ItemTemplate>
                                                <FooterTemplate>
                                                    </tbody> 
                                                    </table>
                
                                                     <div class="alert alert-warning" style="display: <%#bool.Parse((rptData.Items.Count==0).ToString())?"block":"none"%>">
                                                         <strong>暂无预约</strong>
                                                     </div>

                                                </FooterTemplate>
                                            </asp:Repeater>
                                        </div>
                                    </div>
                                </div>
                            </div>
                        </div>
                    </div>
                </div>
            </div>

        </div>
    </div>
    <script src="/control/plugin/bootstrap3/js/bootstrap.min.js"></script>
    <script src="/control/plugin/Highcharts/highcharts.js?v=20160102"></script>
    <script src="/control/plugin/Highcharts/data.js"></script>
    <script src="/control/plugin/Highcharts/exporting.js?v=20160101"></script>
</body>
</html>
