You can not select more than 25 topics Topics must start with a letter or number, can include dashes ('-') and can be up to 35 characters long.

313 lines
10 KiB

This file contains ambiguous Unicode characters!

This file contains ambiguous Unicode characters that may be confused with others in your current locale. If your use case is intentional and legitimate, you can safely ignore this warning. Use the Escape button to highlight these characters.

<!doctype html>
<html>
<head>
<meta charset="utf-8">
<title>大数据汇聚与管理系统</title>
<link rel="stylesheet" href="css/comon0.css">
<link href="css/nav_sytle.css" rel="stylesheet">
<!--<link rel="stylesheet" href="./css/bootstrap.min.css">-->
<link rel="stylesheet" href="./css/font-awesome.min.css">
<link rel="stylesheet" href="css/sidebar-menu.css">
<!--<link rel="stylesheet" href="./css/bootstrap.min.css">-->
<!--<link rel="stylesheet" href="https://cdn.staticfile.org/twitter-bootstrap/3.3.7/css/bootstrap.min.css">-->
<!--<script src="https://cdn.staticfile.org/jquery/2.1.1/jquery.min.js"></script>-->
<!--<script src="https://cdn.staticfile.org/twitter-bootstrap/3.3.7/js/bootstrap.min.js"></script>-->
<link rel="stylesheet" href="./css/bootstrap3.3.7.min.css">
<script src="./js/jquery2.1.1.min.js"></script>
<script src="./js/bootstrap3.3.7.min.js"></script>
<!--<script src="js/jquery-2.1.1.min.js"></script>-->
<script src="./js/popper.min.js"></script>
<!--<script src="./js/bootstrap.min.js"></script>-->
<script src="js/utils.js"></script>
<script src="js/nav.js"></script>
<!--统计使用-->
<script src="js/record.js"></script>
<!-- <script src="https://cdnjs.cloudflare.com/ajax/libs/bootstrap-select/1.12.4/js/bootstrap-select.min.js"></script> -->
<style type="text/css">
.main-sidebar {
position: absolute;
top: 0;
left: 0;
height: 100%;
min-height: 100%;
width: 230px;
z-index: 810;
background-color: #07103c;
}
</style>
</head>
<script>
$(window).load(function () {
$(".loading").fadeOut()
})
/****/
$(document).ready(function () {
var whei = $(window).width()
$("html").css({ fontSize: whei / 20 })
$(window).resize(function () {
var whei = $(window).width()
$("html").css({ fontSize: whei / 20 })
});
});
</script>
<script type="text/javascript" src="js/echarts.min.js"></script>
<script language="JavaScript" src="js/js.js"></script>
<body>
<div class="loading">
<div class="loadbox"> <img src="picture/loading.gif"> 页面加载中... </div>
</div>
<div class="head">
<div class="con">
<div class="left" style="font-family:Comic Sans MS;font-size:14px;">
<i class="fa fa-dedent" style="font-size: 24px;"></i>
</div>
</div>
<!-- <a href="">
<i class="fa fa-bars"></i>
</a> -->
<h1 id="title_text">
湘潭市教育发展总体情况
</h1>
<div class="top-config">
<div class="select select--white" id='select-year'>
</div>
<!-- <a href="javasccript:;" class="fullscreen button" onclick="fullScreen()" style="margin-left: 10px;"><i class="fa fa-bar-chart"></i> 三年对比</a> -->
<a href="javasccript:;" class="fullscreen button" onclick="fullScreen()" id="fullScreen"><i class="fa fa-arrows-alt"></i> 全屏</a>
<a href="javasccript:;" class="fullscreen button" onclick="exitScreen()" style="display: none;" id="exitScreen"><i class="fa fa-arrows-alt"></i> 退出全屏</a>
</div>
</div>
<div class="mainbox">
<ul class="clearfix">
<li>
<div>
<div class="boxall" style="height: 3.2rem;width: 49%;display: inline-block;">
<div class="alltitle">各阶段学校数量</div>
<div class="allnav" id="echart_school_number1"></div>
<div class="boxfoot"></div>
</div>
<div class="boxall" style="height: 3.2rem;width: 49%;float: right;">
<div class="alltitle">学校规模情况</div>
<div class="allnav" id="echart_school_size2"></div>
<div class="boxfoot"></div>
</div>
</div>
<div class="boxall" style="height: 3.2rem">
<div class="alltitle">办学条件情况</div>
<!-- <div class="allnav" id="echart3"></div> -->
<div class="allnav" id="echart_school_condition3"></div>
<div class="boxfoot"></div>
</div>
</li>
<li>
<div class="bar">
<div class="barbox2">
<ul class="clearfix">
<li class="pulll_left">
<p>学校总数</p>
<div id="schoolNumber" class="numberStyle"></div>
</li>
<li class="pulll_left">
<p>教职工总数</p>
<div id="teacherNumber" class="numberStyle"></div>
</li>
<li class="pulll_left">
<p>学生总数</p>
<div id="studentNumber" class="numberStyle"></div>
</li>
</ul>
</div>
</div>
<div class="tab">
<button class="active tabbtn" id="cityMap">县市级地图</button>
<button class="tabbtn" id="otherMap">开发区地图</button>
</div>
<div class="map">
<div class="map1"><img src="picture/lbx.png"></div>
<div class="map2"><img src="picture/jt.png"></div>
<!-- <div class="map3"><img src="picture/map.png"></div> -->
<div class="map4" id="map_1"></div>
<!-- <div class="map4" id="map_2" style="display: none;"></div> -->
</div>
</li>
<li>
<div class="boxall" style="height: 3.2rem">
<div class="alltitle">专任教师师生比</div>
<div class="sy" id="taacher_and_student1"></div>
<div class="sy" id="taacher_and_student2"></div>
<div class="sy" id="taacher_and_student3"></div>
</div>
<div class="boxall" style="height:3.2rem">
<div class="alltitle">城乡专任教师师生比</div>
<div class="allnav" id="city_taacher_and_student6"></div>
<div class="boxfoot"></div>
</div>
</li>
</ul>
<ul class="clearfix">
<li style="width: 30%;">
<div class="boxall" style="height: 3rem">
<div class="alltitle">学生情况</div>
<div class="allnav" id="student_situation9"></div>
<div class="boxfoot"></div>
</div>
</li>
<li style="width: 20%;">
<div class="boxall" style="height: 3rem">
<div class="alltitle">班额情况</div>
<div class="tab" style="margin: 0.1rem auto;">
<button class="active tabbtn" id='BExiaoxue'>小学</button>
<button class="tabbtn" id='BEchuzhong'>初中</button>
<button class="tabbtn" id='BEgaozhong'>高中</button>
</div>
<div class="allnav" id="class_capacity10"></div>
<div class="boxfoot"></div>
</div>
</li>
<li style="width: 20%;">
<div class="boxall" style="height: 3rem">
<div class="alltitle">留守儿童情况</div>
<div class="allnav" id="left_behind_children11"></div>
<div class="boxfoot"></div>
</div>
</li>
<li style="width: 30%;">
<div class="boxall" style="height:3rem">
<div class="alltitle">随迁子女情况</div>
<div class="tab" style="margin: 0.1rem auto">
<button class="active tabbtn" id='SQxiaoxue'>小学</button>
<button class="tabbtn" id='SQchuzhong'>初中</button>
<button class="tabbtn" id='SQgaozhong'>高中</button>
</div>
<div class="allnav" style="width: 40%; float: left;" id="echart8"></div>
<div class="allnav" style="width: 60%; float: left;" id="echart7"></div>
<div class="boxfoot"></div>
</div>
</li>
</ul>
</div>
<!-- 模态框Modal -->
<div class="modal fade" id="myModal" tabindex="-1" role="dialog" aria-labelledby="myModalLabel" aria-hidden="true">
<div id="modalDialog" class="modal-dialog">
<div class="modal-content">
<div id="modalBody" class="modal-body">
<div class="close-box-style">
<button type="button" class="close" data-dismiss="modal" aria-hidden="true">×</button>
</div>
<div class="table-responsive" id="tableBox">
</div>
</div>
</div><!-- /.modal-content -->
</div><!-- /.modal-dialog -->
</div><!-- /.modal -->
<div class="back"></div>
<div class="bgDiv"></div>
<div class="leftNav">
<aside class="main-sidebar">
<section class="sidebar">
<ul class="sidebar-menu" id="menu_list">
</ul>
</section>
</aside>
</div>
<script type="text/javascript" src="js/china.js"></script>
<script type="text/javascript" src="js/china2.js"></script>
<script type="text/javascript" src="js/area_echarts.js"></script>
<script>
var pageIndex = ["BasicEducation","BaseEduMEduData","index"];
</script>
<script src="js/menu.js"></script>
<script src="./js/sidebar-menu.js"></script>
<script src="js/jquery.timers-1.2.js"></script>
<!-- <script>
$('.tab button').click(function (event) {
$(this).addClass('active');
$(this).siblings().removeClass('active');
// $('.map div.map4').eq($(this).index()).removeClass('div_show');
// $('.map div.map4').eq($(this).index()).siblings().addClass('div_show');
})
</script> -->
<script>
$.sidebarMenu($('.sidebar-menu'))
//获取弹出框宽高
var modalSize = autoWinSize()
//console.log("a:",a)
// $("#modalDialog").css({"width":modalSize.width + "px","height":modalSize.height + "px"});
// $("#modalBody").css({"width":modalSize.width + "px","height":modalSize.height + "px"});
$("#modalDialog").css({"width":1200 + "px","height":800 + "px"});
$("#modalBody").css({"width":1200 + "px","height":800 + "px"});
// $('.dropdown-menu').selectpicker();
// $('body').everyTime('10s', function () {
// E_chart.map((item, index) => {
// var opt = E_chart[index].getOption();
// E_chart[index].clear();
// E_chart[index].setOption(opt)
// });
// });
</script>
<style>
.modal-body{
width: 100%;
display: flex;
flex-direction: column;
}
.close-box-style{
width: 100%;
height: 20px;
display: flex;
justify-content: flex-end;
align-items: center;
}
.table-responsive{
width: 100%;
height: calc(100% - 20px);
padding: 20px;
}
.table thead tr th{
text-align: center;
border: 1px solid;
font-size: 20px;
}
.table tbody tr td{
text-align: center;
border: 1px solid;
padding: 0 !important;
font-family: ;
}
.table tbody tr .td-title-style{
font-weight: bolder;
}
</style>
</body>
</html>