parkingmonitoring.html 15.4 KB


    <div class="container">
        <!--/*侧栏*/-->
        <!--<div class="nav-bar">
            <ul class="nav-bar-main">
                <li>
                    <span>停车场</span>
                </li>
                <li onclick="window.location.href='padifo.html'">
                    <span>PDA</span>
                </li>
                <li onclick="window.location.href='guidescreen.html'">
                    <span>诱导屏</span>
                </li>
            </ul>
            <div class="nav-bar-b">
                监控分析平台
            </div>
        </div>-->

        <!--/*搜索*/-->
        <div class="main-wrap" id="main-wrap">
            <div class="main-left float-left">
                <div id="main-left"></div>
            </div>
            <div class="main-right float-left" id="main-right">
                <div class="ser-inp">
                    <input type="text" maxlength="30" placeholder="搜停车场名称" class="ser-input" id="ser-input" data-provide="typeahead">
                    <span class="bg-green" id="ser-button" title="搜索"></span>
                    <div class="cancelBtn" title="清除"></div>
                </div>
                <div class="ser-resPanel" id="ser-resPanel"></div>
                <div class="ser-wrap ser-Res ser-wrap-panel" id="ser-wrap">
                    <div class="ser-main">
                        <div class="content">
                            <div class="select float-left">
                                <p data-value="">全部</p>
                                <ul>
                                    <li data-value="" class="Selected">全部</li>
                                    <li data-value="1">西城区</li>
                                    <li data-value="2">东城区</li>
                                </ul>
                            </div>
                            <div class="select2 float-left display-none">
                                <p data-value="">全部</p>
                                <ul>
                                    <li data-value="" class="Selected">全部</li>
                                    <li data-value="1">路侧</li>
                                    <li data-value="2">封闭</li>
                                </ul>
                            </div>
                        </div>

                        <ul class="ser-result-wrap" id="result">
                            <!--<li>-->
                            <!--<div>1.中兴智能交通停车场</div>-->
                            <!--<div>类型 : 停车场</div>-->
                            <!--<div>车位总数 : 260</div>-->
                            <!--</li>-->
                        </ul>
                        <div id="pageGro" class="pageGro">
                            <div class="pageUp">《上一页</div>
                            <div class="pageList">
                                <ul>
                                    <li>1</li>
                                    <li>2</li>
                                    <li>3</li>
                                    <li>4</li>
                                    <li>5</li>
                                </ul>
                            </div>
                            <div class="pageDown">下一页》</div>
                        </div>

                    </div>
                </div>
            </div>

        </div>



        <!--/*地图*/-->
        <div class="map-wrap" id="allmap"></div>
        <!--停车场弹窗-->
        <!--<div class="parkpop-content">
            <div class="parkpop-tit">哈达西街停车场</div>
            <div class="parkpop-cont">
                <div class="parkpop-freecont">
                    <ul class="freenum-cont">
                        <li class="freespace-num">0</li>
                        <li class="freespace-num">9</li>
                        <li class="freespace-num">0</li>
                        <li class="freespace-num">9</li>
                    </ul>
                    <div class="freespace-numtit">空闲车位数</div>
                </div>
                <div class="parkpop-allnumcont">
                    <div class="allnum-Num">5890</div>
                    <div class="allspace-tit">总车位</div>
                </div>
            </div>
        </div>-->
        <!--右下角图例 sta -->
        <div class="freespace">
            <div class="freespace-tit">车位饱和状态</div>
            <ul class="freespace-content">
                <li class="freespace-msg"><span class="msg-common msg-bgfull"></span>已满:0</li>
                <li class="freespace-msg"><span class="msg-common msg-bgfew"></span>有空位:1-30%</li>
                <li class="freespace-msg"><span class="msg-common msg-bgeough"></span>空闲:>30%</li>
            </ul>
        </div>
        <!--右下角图例 end -->
        <!--停车场详细信息-->
        <!--停车场详细信息-->
        <div class="modal fade in" id="parkmon_alertmodel" style="display: none;" tabindex="-1" role="dialog" aria-labelledby="myModalLabel" aria-hidden="true">
            <div class="ITD-modal-dialog ITD-model-773">
                <div class="modal-content">
                    <div class="modal-header ITD-model-header">
                        <button type="button" class="close ITD-model-close" data-dismiss="modal" aria-hidden="true">×</button>
                        <input hidden="" id="dataplno">
                        <input hidden="" id="dataplname">
                        <ul class="ITD-alert-tab-wrap ITD-common-fontsize14 ITD-common-color060" id="ITD-alert-tab-wrap">
                            <li class="ITD-alert-tab-active">基本信息</li>
                            <li>停车数据</li>
                        </ul>
                    </div>
                    <div class="modal-body ITD-modal-body">
                        <ul id="ITD-alertcon-tab-wrap">
                            <li class="">
                                <div class="caryard-basic-ino-name ITD-common-fontsize18 ITD-common-color000"><span id="basePlName">创业东路</span></div>
                                <div class="ITD-common-fontsize14 ITD-common-color080 caryard-basic-ifo-park caryard-basic-ifo-park-height caryard-basic-borderbototm"><span></span>车场信息</div>
                                <ul class="caryard-basic-ifo-park-wrap">
                                    <li class="ITD-common-fontsize12 ITD-common-color000 caryard-basic-ifo-park-height caryard-basic-borderbototm">
                                        <div class="float-left"><span class="caryard-basic-ifo-type"></span><span>类型</span>&nbsp;&nbsp;:&nbsp;&nbsp;<span id="basePlType">路侧</span> </div>
                                        <div class="float-left"><span class="caryard-basic-ifo-device"></span><span>使用设备</span>&nbsp;&nbsp;:&nbsp;&nbsp;<span id="baseDeviceType">地磁</span> </div>
                                    </li>

                                    <li class="ITD-common-fontsize12 ITD-common-color000 caryard-basic-ifo-park-height caryard-basic-borderbototm">
                                        <div class="float-left"><span class="caryard-basic-ifo-total"></span><span>车位总数</span>&nbsp;&nbsp;:&nbsp;&nbsp;<span id="baseBerthNum">38个</span> </div>
                                        <div class="float-left"><span class="caryard-basic-ifo-entrance"></span><span>出入口数量</span>&nbsp;&nbsp;:&nbsp;&nbsp;<span id="baseInOutNum">1出1入</span> </div>
                                    </li>
                                    <li class="ITD-common-fontsize12 ITD-common-color000 caryard-basic-ifo-park-height caryard-basic-borderbototm">
                                        <div class="float-left"><span class="caryard-basic-ifo-business"></span><span>商圈属性</span>&nbsp;&nbsp;:&nbsp;&nbsp;<span id="baseBusiCircle">其他</span> </div>
                                        <div class="float-left ITD-hidden-nowrap caryard-basic-ifo-address-wrap"><span class="caryard-basic-ifo-address "></span><span>地址</span>&nbsp;&nbsp;:&nbsp;&nbsp;<span class="ITD-hidden-nowrap" id="baseAddress">水岸天街街道创业东路</span> </div>
                                    </li>
                                </ul>
                                <div class="ITD-common-fontsize14 ITD-common-color080 caryard-basic-ifo-fees  caryard-basic-borderbototm"><span></span>收费标准</div>
                                <ul class="caryard-basic-ifo-fees-wrap" style="max-height: 200px;overflow-y: auto" id="plRate">

                                </ul>
                                <div class="ITD-common-fontsize14 ITD-common-color080 caryard-basic-ifo-photo  caryard-basic-borderbototm"><span></span>停车照片</div>
                                <ul class=" caryard-basic-ifo-photo-wrap" id="baseParkImg">
                                </ul>

                            </li>
                            <li class="display-none">
                                <div class="caryard-basic-ino-name ITD-common-fontsize18 ITD-common-color000"><span id="parkDataPlName">创业东路</span></div>
                                <ul class="caryard-parking-ifo">
                                    <li>
                                        <div class="float-left caryard-parking-ifo-icon">

                                        </div>
                                        <div class="float-left">
                                            <div class="ITD-common-fontsize12 ITD-common-color050 caryard-parking-ifo-title">总泊位</div>
                                            <div class="ITD-common-fontsize12 ITD-common-color050"><span class="ITD-common-fontsize18 ITD-common-color000" id="parkDataFreeBerthNum">0</span>&nbsp;</div>
                                        </div>
                                        <div class="clearfix"></div>
                                    </li>
                                    <li>
                                        <div class="float-left caryard-parking-ifo-icon">

                                        </div>
                                        <div class="float-left">
                                            <div class="ITD-common-fontsize12 ITD-common-color050 caryard-parking-ifo-title">周转次数</div>
                                            <div class="ITD-common-fontsize12 ITD-common-color050"><span class="ITD-common-fontsize18 ITD-common-color000" id="turnOverRate">43</span>&nbsp;</div>
                                        </div>
                                        <div class="clearfix"></div>
                                    </li>
                                    <li>
                                        <div class="float-left caryard-parking-ifo-icon">

                                        </div>
                                        <div class="float-left">
                                            <div class="ITD-common-fontsize12 ITD-common-color050 caryard-parking-ifo-title">占用率</div>
                                            <div class="ITD-common-fontsize12 ITD-common-color050"><span class="ITD-common-fontsize18 ITD-common-color000" id="occupyRate">30</span>&nbsp;%</div>
                                        </div>
                                        <div class="clearfix"></div>
                                    </li>
                                    <li>
                                        <div class="float-left caryard-parking-ifo-icon">

                                        </div>
                                        <div class="float-left">
                                            <div class="ITD-common-fontsize12 ITD-common-color050 caryard-parking-ifo-title">空置率</div>
                                            <div class="ITD-common-fontsize12 ITD-common-color050"><span class="ITD-common-fontsize18 ITD-common-color000" id="freeRate">20</span>&nbsp;%</div>
                                        </div>
                                        <div class="clearfix"></div>
                                    </li>
                                    <div class="clearfix"></div>
                                </ul>
                                <ul class="caryard-parking-detail-wrap">
                                    <li>
                                        <div class="caryard-parking-detail-rate caryard-basic-ifo-park-height caryard-basic-borderbototm ITD-common-fontsize14 ITD-common-color080">
                                            <span></span>24小时占用率
                                        </div>
                                        <div class="caryard-parking-echart" id="caryard-parking-echart"></div>
                                    </li>
                                    <li>
                                        <div class="caryard-parking-detail-monitor caryard-basic-ifo-park-height caryard-basic-borderbototm ITD-common-fontsize14 ITD-common-color080">
                                            <span></span>设备监控
                                        </div>
                                        <div class="list_lh " style="height: 140px;overflow: hidden">
                                            <ul class="caryard-monitor-main ITD-common-fontsize12" id="eqpInfo" >
                                                <li><span class="ITD-common-color000 ITD-hidden-nowrap">岗亭服务器</span><span class="ITD-common-color000 ITD-hidden-nowrap" "="">  正常	</span></li>
                                                <li><span class="ITD-common-color000 ITD-hidden-nowrap">道闸设备</span><span class="ITD-common-color000 ITD-hidden-nowrap" "="">   正常	</span></li>
                                                <li><span class="ITD-common-color000 ITD-hidden-nowrap">摄像机1</span><span class="ITD-common-color000 ITD-hidden-nowrap" "="">   正常	</span></li>
                                                <li><span class="ITD-common-color000 ITD-hidden-nowrap">摄像机2</span><span class="ITD-color-red ITD-hidden-nowrap" "=""> 进口1设备异常	</span></li>
                                            </ul>
                                        </div>
                                    </li>
                                    <div class="clearfix"></div>
                                </ul>
                                <div class="caryard-parking-berth-usage caryard-basic-ifo-park-height  ITD-common-fontsize14 ITD-common-color080">
                                    <span></span>24小时周转次数
                                </div>
                                <div class="berth-usage-echart" id="berth-usage-echart"></div>
                            </li>
                        </ul>

                    </div>
                </div>
            </div>
        </div>
        <div class="loading-wrap" id="loading-wrap">
            <div class="spinner"><div class="spinner-container container1"><div class="circle1"></div><div class="circle2"></div><div class="circle3"></div><div class="circle4"></div></div><div class="spinner-container container2"><div class="circle1"></div><div class="circle2"></div><div class="circle3"></div><div class="circle4"></div></div><div class="spinner-container container3"><div class="circle1"></div><div class="circle2"></div><div class="circle3"></div><div class="circle4"></div></div></div>

        </div>
    </div>

<script src='../../assets/pages/scripts/operMonFile/parkingMon/parkingmonitoring.js'></script>