yuanMM
/
html


			
							123456789101112131415161718192021222324252627282930313233343536373839404142434445464748495051525354555657585960616263646566676869707172737475767778798081828384858687888990919293949596979899100101102103104105106107108109110111112113114115116117118119120121122123124125126127128129130131132133134135136137138139140141142143144145146147148149150151152153154155156157158159160161162163164165166167168169170171172173174175176177178179180181182
							<!DOCTYPE html>
<html lang="zh">

<head>
    <meta charset="UTF-8" />
    <meta name="viewport" content="width=device-width, initial-scale=1.0" />
    <title>首页-设施管理系统</title>
    <link rel="shortcut icon" href="favicon.ico">
    <link rel="stylesheet" href="css/common.css" />
    <link rel="stylesheet" href="css/index.css" />

</head>

<body>
    <!--<header>-->
    <!--    <h1>设施管理系统</h1>-->
    <!--</header>-->
    <section class="mainbox">
        <div class="column">
            <div class="panel pie-bar">
                <h2>
                    设备工况
                </h2>
                <div class="pie-bar-container">
                    <div class="pie-bar-top">
                        <div id="loading"></div>
                        <div class="chart">

                        </div>

                    </div>
                    <div class="pie-bar-bottom">
                        <div class="title-btn">异常设备数</div>
                        <div class="chart pie"></div>

                    </div>
                </div>
                <!-- <div class="chart"></div> -->
                <!-- <div class="panel-footer"></div> -->
            </div>
            <div class="panel line">
                <h2>报警处理</h2>
                <div class="chart"></div>
                <!-- <div class="panel-footer"></div> -->
            </div>

        </div>
        <div class="column">

            <div class="map">
                 <iframe style="width:100%;height:100%" src='http://www.thingjs.com/s/ef7ee6a73896c01bda77e679?params=105b0f77fd24654d4eebc434e9'></iframe>
            </div>
            <div class="no panel">
                <h2>实时告警信息</h2>
                <!-- <div class="no-hd">
              <ul>
                <li>125811</li>
                <li>104563</li>
              </ul>
            </div>
            <div class="no-bd">
              <ul>
                <li>前端需求人数</li>
                <li>市场供应人数</li>
              </ul>
            </div> -->

                <table class="pure-table">
                    <thead>
                        <tr>
                            <th>序号</th>
                            <th>告警时间</th>
                            <th>告警类型</th>
                            <th>告警详情</th>
                            <th>告警状态</th>
                        </tr>
                    </thead>
                </table>
                <div class="scroll" style="height: 2.5rem;overflow-y: auto;">
                    <table class="pure-table">

                        <tbody class="warning-info">
                        </tbody>
                    </table>
                </div>
            </div>
        </div>
        <div class="column">
            <div class="panel right-top">

                <h2>园区实时报警统计</h2>

                <div class="total-squares">
                    <!-- <div class="total-square">1</div>
                    <div class="total-square">3</div>
                    <div class="total-square">5</div>
                    <div class="total-square">7</div> -->
                </div>
                <div class="yq-total">当前时间</div>

                <div class="chart"></div>
                <!-- <div class="panel-footer"></div> -->
            </div>
            <div class="panel huan right-bottom">
                <h2>设备隐患处理</h2>
                <ul id="pop">
                    <!-- <li>
                        <p class="num-huan color-green">3</p>
                        <p class="des-huan">巡检人员数量</p>
                    </li>
                    <li>
                        <p class="num-huan color-blue">10</p>
                        <p class="des-huan">今日任务</p>
                    </li>
                    <li>
                        <p class="num-huan color-red">0</p>
                        <p class="des-huan">超时任务</p>
                    </li>
                    <li>
                        <p class="num-huan color-yellow">8</p>
                        <p class="des-huan">今日完成任务</p>
                    </li> -->

                </ul>
                <div class="title-btn">异常设备数</div>
                <table class="pure-table">
                    <thead>
                        <tr>
                            <th>序号</th>
                            <th>任务名称</th>
                            <th>当前状态</th>
                            <th>应完成时间</th>

                        </tr>
                    </thead>

                </table>
                <div class="scroll" style="height: 1.3rem;overflow-y: auto;">
                    <table class="pure-table">

                        <tbody class="abnormal">

                            <tr>
                                <td>1</td>
                                <td>任务111</td>
                                <td class="unprocess">待处理</td>
                                <td>2020-12-15 15:22</td>
                            </tr>
                            <tr>
                                <td>2</td>
                                <td>任务111</td>
                                <td class="unprocess">待处理</td>
                                <td>2020-12-15 15:22</td>
                            </tr>


                        </tbody>
                    </table>

                </div>

                <!-- <div class="chart"></div> -->
                <!-- <div class="panel-footer"></div> -->
            </div>

        </div>
    </section>
    <script src="js/flexible.js"></script>
    <script src="js/jquery.js"></script>
    <script src="api/request.js"></script>

    <!-- <script src="js/china.js"></script> -->
    <!-- <script src="js/myMap.js"></script> -->
    <script src="js/echarts.min.js"></script>
    <script src="js/index.js"></script>

</body>

</html>