shuochen
/
LargeScreenVisualization


			
				
					
						
						
							123456789101112131415161718192021222324252627282930313233343536373839404142434445464748495051525354555657585960616263646566676869707172737475767778798081828384858687888990919293949596979899100101102103104105106107108109110111112113114115116117118119120121122123124125126127128129130131132133134135136137138139140141142143144145146147148149150151152153154155156157158159160161162163164165166167168169170171172173174175176177178179180181182183184185186187188189190191192193194195196197198199200201202203204205206207208209210211212213214215216217218219220221222223224225226227228229230231232233234235236237238239240241242243244245246247248249250251252253254255256257258259260261262263264265266267268269270271272273274275276277278279280281282283284285286287288289290291292293294295296297298299300301302303304305306307308309310311312313314315316317318319320321322323324325326327328329330331332333334335336337338339340
							<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <title>某某市某某区办税渠道运行状态大数据监控平台</title>
    <link rel="stylesheet" href="css/index.css">
</head>
<body>
    <header>
        <div class="headerLeft">
            <h3>服务数据</h3>
        </div>
        <div class="headerCenter">
            <h1>某某市某某区办税渠道运行状态大数据监控平台</h1>
        </div>
        <div class="headerRight">
            <h3>业务数据</h3>
        </div>

    </header>
    <section>
        <div class="firstCon">
            <div class="firstCon-left">
                <h4>各业务平均办理时间/分钟</h4>
                <div class="firstLeftsec">
                    <div class="contain">
                        <div class="firsttab" id="firsttab1"></div>
                        <p>综合业务</p>
                    </div>
                    <div class="contain">
                        <div class="firsttab" id="firsttab2"></div>
                        <p>综合业务</p>
                    </div>
                    <div class="contain">
                        <div class="firsttab" id="firsttab3"></div>
                        <p>综合业务</p>
                    </div>
                    <div class="contain">
                        <div class="firsttab" id="firsttab4"></div>
                        <p>综合业务</p>
                    </div>
                </div>
            </div>
            <div class="first-center">
                <h3>当前大厅等候人数</h3>
                <div class="firstcenLeft">
                    <div class="flag">
                        <strong>35</strong>
                        <p>综合业务</p>
                    </div>
                    <div class="flag">
                        <strong>35</strong>
                        <p>综合业务</p>
                    </div>
                    <div class="flag">
                        <strong>35</strong>
                        <p>综合业务</p>
                    </div>
                </div>
                <div class="firstcenCen">
                    <span>1</span>
                    <span>4</span>
                    <span>9</span>
                </div>
                <div class="firstcenRight">
                    <div class="flag">
                        <strong>35</strong>
                        <p>综合业务</p>
                    </div>
                    <div class="flag">
                        <strong>35</strong>
                        <p>综合业务</p>
                    </div>
                    <div class="flag">
                        <strong>35</strong>
                        <p>综合业务</p>
                    </div>
                </div>
            </div>
            <div class="firstCon-right">
                <h4>各业务平均办理时间/分钟</h4>
                <div class="firstLeftsec">
                    <div class="contain">
                        <div class="firsttab" id="firsttab5"></div>
                        <p>综合业务</p>
                    </div>
                    <div class="contain">
                        <div class="firsttab" id="firsttab6"></div>
                        <p>综合业务</p>
                    </div>
                    <div class="contain">
                        <div class="firsttab" id="firsttab7"></div>
                        <p>综合业务</p>
                    </div>
                    <div class="contain">
                        <div class="firsttab" id="firsttab8"></div>
                        <p>综合业务</p>
                    </div>
                </div>
            </div>
        </div>
        <div class="line"></div>
        <div class="secondCon">
            <div class="secondLeft">
                <div class="secondLeftCon">
                    <div class="secondLeftTab">
                        <div class="fig">
                            <p>各办税渠道使用情况</p>
                        </div>
                        <div class="fig">
                            <p>各办税渠道使用情况</p>
                            <em>80人</em>
                        </div>
                        <div class="fig">
                            <p>各办税渠道使用情况</p>
                            <em>120人</em>
                        </div>
                        <div class="fig">
                            <p>各办税渠道使用情况</p>
                            <em>70人</em>
                        </div>
                    </div>

                    <div class="secondLeftTab">
                        <div class="fig">
                            <p>接待情况</p>
                        </div>
                        <div class="reception">
                            <div class="recetit">
                                <strong>40人</strong>
                                <span></span>
                                <span></span>
                                <span></span>
                                <span></span>
                                <span></span>
                                <span class="changecolor"></span>
                                <span class="changecolor"></span>
                                <span class="changecolor"></span>
                                <span class="changecolor"></span>
                                <p>本月新办户数</p>
                            </div>
                            <div class="recetit">
                                <strong>40人</strong>
                                <span></span>
                                <span></span>
                                <span></span>
                                <span></span>
                                <span></span>
                                <span class="changecolor"></span>
                                <span class="changecolor"></span>
                                <span class="changecolor"></span>
                                <span class="changecolor"></span>
                                <p>本月新办户数</p>
                            </div>
                            <div class="recetit">
                                <strong>40人</strong>
                                <span></span>
                                <span></span>
                                <span></span>
                                <span class="changecolor"></span>
                                <span class="changecolor"></span>
                                <span class="changecolor"></span>
                                <span class="changecolor"></span>
                                <span class="changecolor"></span>
                                <span class="changecolor"></span>
                                <p>本月新办户数</p>
                            </div>
                        </div>
                    </div>
                </div>
            </div>
            <div class="secondCen">
                <div class="secondCenCon">
                    <h3>业务办理实时监控</h3>
                    <div class="secondContit">
                        <div class="secondContitleft">
                            <p>今日累计业务办理量</p>
                            <img src="image/line.png" alt="">
                            <ul class="china">
                                <li><a href="">发票代开</a></li>
                                <li><a href="">发票发售</a></li>
                                <li><a href="">纳税申报</a></li>
                                <li><a href="">发票验旧</a></li>
                                <li><a href="">发票认证</a></li>
                            </ul>
                            <img src="image/line.png" alt="">
                            <ul class="number">
                                <li><a href="">20</a></li>
                                <li><a href="">40</a></li>
                                <li><a href="">32</a></li>
                                <li><a href="">34</a></li>
                                <li><a href="">30</a></li>
                            </ul>
                            <img src="image/line.png" alt="">
                        </div>
                        <div class="secondContitright" id="secondContitright">
                            <div class="charbar" id="charbar"></div>
                        </div>
                    </div>
                    <div class="secondContit">
                        <div class="secondContitleft">
                            <p>今日累计业务办理量</p>
                            <img src="image/line.png" alt="">
                            <ul class="china">
                                <li><a href="">发票代开</a></li>
                                <li><a href="">发票发售</a></li>
                                <li><a href="">纳税申报</a></li>
                                <li><a href="">发票验旧</a></li>
                                <li><a href="">发票认证</a></li>
                            </ul>
                            <img src="image/line.png" alt="">
                            <ul class="number">
                                <li><a href="">20</a></li>
                                <li><a href="">40</a></li>
                                <li><a href="">32</a></li>
                                <li><a href="">34</a></li>
                                <li><a href="">30</a></li>
                            </ul>
                            <img src="image/line.png" alt="">
                        </div>
                        <div class="secondContitright" id="secondContitright2">
                            <div class="charbar" id="charbar2"></div>
                        </div>
                    </div>
                </div>
            </div>
            <div class="secondRight">
                <div class="secondRightCon">
                    <div class="secondLeftTab">
                        <div class="fig">
                            <p>区域收入情况</p>
                        </div>
                        <div class="secondRighttit">
                            <div class="secondRighttext">
                                <div class="text">
                                    <p>省级以上</p>
                                    <span>442户</span>
                                </div>
                                <div class="text">
                                    <p>省级以上</p>
                                    <span>442户</span>
                                </div>
                                <h4>重点税源户数</h4>
                            </div>
                            <div class="secondRighttext">
                                <div class="secondRighttextChar" id="secondRighttextChar">

                                </div>
                                <h4 class="sec">重点税源户数</h4>
                            </div>
                            <div class="secondRighttext">
                                <div class="secondRighttextChar" id="secondRighttextChar1">

                                </div>
                                <h4 class="sec">税收占比</h4>
                            </div>
                        </div>
                    </div>
                    <div class="secondLeftTab">
                        <div class="fig">
                            <p>数据统计分析</p>
                        </div>
                        <div class="secondChar" id="secondChar">

                        </div>
                    </div>
                </div>
            </div>
        </div>
        <div class="thirdCon">
            <div class="thirdLeft">
                <div class="thirdLeftCon">
                    <div class="secondLeftTab">
                        <div class="fig">
                            <p>当日纳税人咨询最热问题 TOP5</p>
                        </div>
                        <ul class="hottop">
                            <li><span>1</span><p>如何代开发票？</p><a href="">了解详情</a></li>
                            <li><span>2</span><p>如何代开发票？</p><a href="">了解详情</a></li>
                            <li><span>3</span><p>如何代开发票？</p><a href="">了解详情</a></li>
                            <li><span>4</span><p>如何代开发票？</p><a href="">了解详情</a></li>
                            <li><span>5</span><p>如何代开发票？</p><a href="">了解详情</a></li>
                        </ul>
                    </div>
                </div>
            </div>
            <div class="thirdCen">
                <div class="thirdCenCon">
                    <div class="txt txtleft">
                        <div class="content">
                            <h4>当日各时段大厅人流量曲线图</h4>
                            <div class="contentChar" id="contentChar1"></div>
                        </div>
                    </div>
                    <div class="txt txtright">
                        <div class="content">
                            <h4>当日各时段大厅人流量曲线图</h4>
                            <div class="contentChar" id="contentChar2"></div>
                        </div>
                    </div>
                </div>
            </div>
            <div class="thirdRight">
                <div class="thirdRightCon">
                    <div class="secondLeftTab">
                        <div class="fig">
                            <p>当日纳税人咨询最热问题 TOP5</p>
                        </div>
                        <ul class="hottop">
                            <li><span>1</span><p>如何代开发票？</p><a href="">了解详情</a></li>
                            <li><span>2</span><p>如何代开发票？</p><a href="">了解详情</a></li>
                            <li><span>3</span><p>如何代开发票？</p><a href="">了解详情</a></li>
                            <li><span>4</span><p>如何代开发票？</p><a href="">了解详情</a></li>
                            <li><span>5</span><p>如何代开发票？</p><a href="">了解详情</a></li>
                        </ul>
                    </div>
                </div>
            </div>
        </div>
    </section>
    <footer>
        <div class="footerleft">
            <img src="image/right.png" alt="" class="rightimg">
            <div class="home">
                <img src="image/home.png" alt="">
                <button id="homebtn" value="首页">首页</button>
            </div>
            <div class="con">
                <p>当前时间</p>
                <h4>2018年1月9日 星期四 15:00</h4>
            </div>
        </div>
        <div class="footercen"></div>
        <div class="footerright"></div>
    </footer>
</body>
</html>
<script src="https://www.jq22.com/jquery/echarts-4.2.1.min.js"></script>
<script src="js/jquery.1.10.min.js"></script>
<script src="js/chars.js"></script>