duhongyu
/
ShuangHui_UI


			
				
					
						
						
							123456789101112131415161718192021222324252627282930313233343536373839404142434445464748495051525354555657585960616263646566676869707172737475767778798081828384858687888990919293949596979899100101102103104105106107108109110111112113114115116117118119120121122123124125126127128129130131132133134135136137138139140141142143144145146147148149150151152153154155156157158159160161162163164165166167168169170171172173174175176177178179180181182183184185186187188189190191192193194195196197198199200201202203204205206207208209210211212213214215216217218219220221222223224225226227228229230231232233234235236237238239240241242243244245246247248249250251252253254255256257258259260261262263264265266267268269270271272273274275276277278279280281282283284285286287288289290291292293294295296297298299300301302303304305306307308309310311312313314315316317318319320321322323324325326327328329330331332333334335336337338339340341342343344345346347348349350351352353354355356357358359360361362363364365366367
							<!DOCTYPE html>
<html>

	<head>
		<meta charset="utf-8" />
		<meta http-equiv="X-UA-Compatible" content="IE=edge,chrome=1" />
		<!--优先使用 IE 最新版本和 Chrome-->
		<meta name="renderer" content="webkit" />
		<!-- <script type="text/javascript" src="http://echarts.baidu.com/gallery/vendors/echarts/echarts.min.js"></script> -->
		<script src="Script/Common/huayi.load.js"></script>
		<script src="Script/Common/huayi.config.js"></script>
		<link rel="stylesheet" href="css/swiper.min.css" />
		<link rel="stylesheet" href="css/animate.min.css" />
		<link rel="stylesheet" href="plugins/numbergd/globle.css" />
		<link rel="stylesheet" href="css/index.css" />
		<link rel="stylesheet" href="css/homes.css" />
		<title>大数据首页</title>
		<style>
			.slide_right {
				position: relative;
			}
			.slide_right .timeWrap input {
				width: 195px;
			}
			.slide_right .timeWrap {
				position: absolute;
				top: 56px;
				left: -63px;
			}
			.timeWrapPosi {
				top: 160px !important;
			}
			.slide_right .twotimeWarp {
				top: -149px;
				left: -22px;
			}
			.slide_right .lasttimeWrap {
				right: -2px;
			}
			.selects{
				height: 30px;
				line-height: 30px !important;
			}
			.secondPie{
				position: absolute;
				width: 600px;
				height: 600px;
				top: 0;
				left: 0;
				right: 0;
				bottom: 0;
				margin: auto;
				z-index: 333;
			}
			.firstPos{
				position: absolute;
				right: 120px;
				top: 25px;
			}
			#time1{
				width: 220px;
			}
			.secondPos{
				position: absolute;
				right: 170px;
				top: -15px;
				display: none;
			}
			.fivePos{
				position: absolute;
				right: 140px;
				top: -15px;
			}
			.threeChart{
				width: 100%;
				overflow: hidden;
			}
			.threeChart .partL{
				float: left;
				width: 37%;
				height: 300px;
				background: #F05964;
				margin: 30px 3% 0px 10%;
			}
			.threeChart .partR{
				float: left;
				width: 37%;
				height: 300px;
				background: #F05964;
				margin: 30px 10% 0px 3%;
			}
			.threefour{
				width: 90%;
				margin-left:10%;
				overflow: hidden;
			}
			.threefour .partL{
				float: left;
				width: 100%;
				height: 300px;
				background: #F05964;
				margin: 30px 3% 0px 5%;
			}
			.fourSel{
				position: absolute;
				right: 180px;
				top:360px;
				color: #00e9ff;
			}
			.cccbn{
				position: absolute;
				top:-30px;
				left: 380px;
			}
			.oneScrBlla{
				float: right;
			}
			
			.focus-pic{
				width:2000px;
			}
			.tabItems .bacd{
				float:right;
			}
			
			input::-webkit-input-placeholder{
				color:#00E9FF;
			}
		</style>
	</head>
	<body>
		<!--导航栏开始-->
		<div id="nav">
			双汇集团客服中心
		</div>
		<!--导航栏结束-->
		<div id="wrap">
			<div class="swiper-container swiper-no-swiping">
				<div class="swiper-wrapper">
					<!-- 第一屏 -->
					<div class="swiper-slide">
						<div class="slideCon_bg orderType clearfix">
							<p class="slide_title">问题代码一览表</p>
							<div class="timeWrap twotimeWarp" style="float: right; margin-right: 150px; margin-top: 100px;">
								<div class="time_box pull-right form-inline time_box_three">
									日期<input type="text" id="time1" class="times" style="width:206px;" placeholder="请选择日期"/>
								</div>
							</div>
							<div class="orderTtype_Con">
								<ul class="clearfix">
									<li class="active">
										<div class="typeWord"><span class="typeWordNum">1&nbsp;&nbsp;</span><span class="total_title"></span></div>
										<p class="typeWord_line"><span>今日问题量&nbsp;</span><span class="order_count total_problem_1">0</span></p>
										<p class="typeWord_line"><span>本月问题量&nbsp;</span><span class="order_count total_problem_2">0</span></p>
										<p class="typeWord_line"><span>问题总量&nbsp;</span><span class="order_count total_problem_3">0</span></p>
										<div class="persent_box">
											<div class="persent_kuang total_problem_4">0</div>
										</div>
									</li>
									<li class="active">
										<div class="typeWord"><span class="typeWordNum">2&nbsp;&nbsp;</span><span class="b_title"></span></div>
										<p class="typeWord_line"><span>今日问题量&nbsp;</span><span class="order_count b_problem_1">0</span></p>
										<p class="typeWord_line"><span>本月问题量&nbsp;</span><span class="order_count b_problem_2">0</span></p>
										<p class="typeWord_line"><span>问题总量&nbsp;</span><span class="order_count b_problem_3">0</span></p>
										<div class="persent_box">
											<div class="persent_kuang b_problem_4">0</div>
										</div>
									</li>
									<li class="active">
										<div class="typeWord"><span class="typeWordNum">3&nbsp;&nbsp;</span><span class="zbm_title"></span></div>
										<p class="typeWord_line"><span>今日问题量&nbsp;</span><span class="order_count zbm_problem_1">0</span></p>
										<p class="typeWord_line"><span>本月问题量&nbsp;</span><span class="order_count zbm_problem_2">0</span></p>
										<p class="typeWord_line"><span>问题总量&nbsp;</span><span class="order_count zbm_problem_3">0</span></p>
										<div class="persent_box">
											<div class="persent_kuang zbm_problem_4">0</div>
										</div>
									</li>
									<li class="active">
										<div class="typeWord"><span class="typeWordNum">4&nbsp;&nbsp;</span><span class="p_title"></span></div>
										<p class="typeWord_line"><span>今日问题量&nbsp;</span><span class="order_count p_problem_1">0</span></p>
										<p class="typeWord_line"><span>本月问题量&nbsp;</span><span class="order_count p_problem_2">0</span></p>
										<p class="typeWord_line"><span>问题总量&nbsp;</span><span class="order_count p_problem_3">0</span></p>
										<div class="persent_box">
											<div class="persent_kuang p_problem_4">0</div>
										</div>
									</li>
									<li class="active">
										<div class="typeWord"><span class="typeWordNum">5&nbsp;&nbsp;</span><span class="q_title"></span></div>
										<p class="typeWord_line"><span>今日问题量&nbsp;</span><span class="order_count q_problem_1">0</span></p>
										<p class="typeWord_line"><span>本月问题量&nbsp;</span><span class="order_count q_problem_2">0</span></p>
										<p class="typeWord_line"><span>问题总量&nbsp;</span><span class="order_count q_problem_3">0</span></p>
										<div class="persent_box">
											<div class="persent_kuang q_problem_4">0</div>
										</div>
									</li>
									<li class="active">
										<div class="typeWord"><span class="typeWordNum">6&nbsp;&nbsp;</span><span class="zcy_title"></span></div>
										<p class="typeWord_line"><span>今日问题量&nbsp;</span><span class="order_count zcy_problem_1">0</span></p>
										<p class="typeWord_line"><span>本月问题量&nbsp;</span><span class="order_count zcy_problem_2">0</span></p>
										<p class="typeWord_line"><span>问题总量&nbsp;</span><span class="order_count zcy_problem_3">0</span></p>
										<div class="persent_box">
											<div class="persent_kuang zcy_problem_4">0</div>
										</div>
									</li>
									<li class="active">
										<div class="typeWord"><span class="typeWordNum">7&nbsp;&nbsp;</span><span class="ztf_title"></span></div>
										<p class="typeWord_line"><span>今日问题量&nbsp;</span><span class="order_count ztf_problem_1">0</span></p>
										<p class="typeWord_line"><span>本月问题量&nbsp;</span><span class="order_count ztf_problem_2">0</span></p>
										<p class="typeWord_line"><span>问题总量&nbsp;</span><span class="order_count ztf_problem_3">0</span></p>
										<div class="persent_box">
											<div class="persent_kuang ztf_problem_4">0</div>
										</div>
									</li>
									<li class="active">
										<div class="typeWord"><span class="typeWordNum">8&nbsp;&nbsp;</span><span class="zqt_title"></span></div>
										<p class="typeWord_line"><span>今日问题量&nbsp;</span><span class="order_count zqt_problem_1">0</span></p>
										<p class="typeWord_line"><span>本月问题量&nbsp;</span><span class="order_count zqt_problem_2">0</span></p>
										<p class="typeWord_line"><span>问题总量&nbsp;</span><span class="order_count zqt_problem_3">0</span></p>
										<div class="persent_box">
											<div class="persent_kuang zqt_problem_4">0</div>
										</div>
									</li>
									<li class="active">
										<div class="typeWord"><span class="typeWordNum">9&nbsp;&nbsp;</span><span class="qsz_title"></span></div>
										<p class="typeWord_line"><span>今日问题量&nbsp;</span><span class="order_count qsz_problem_1">0</span></p>
										<p class="typeWord_line"><span>本月问题量&nbsp;</span><span class="order_count qsz_problem_2">0</span></p>
										<p class="typeWord_line"><span>问题总量&nbsp;</span><span class="order_count qsz_problem_3">0</span></p>
										<div class="persent_box">
											<div class="persent_kuang qsz_problem_4">0</div>
										</div>
									</li>
									<li class="active">
										<div class="typeWord"><span class="typeWordNum">10&nbsp;&nbsp;</span><span class="qjt_title"></span></div>
										<p class="typeWord_line"><span>今日问题量&nbsp;</span><span class="order_count qjt_problem_1">0</span></p>
										<p class="typeWord_line"><span>本月问题量&nbsp;</span><span class="order_count qjt_problem_2">0</span></p>
										<p class="typeWord_line"><span>问题总量&nbsp;</span><span class="order_count qjt_problem_3">0</span></p>
										<div class="persent_box">
											<div class="persent_kuang qjt_problem_4">0</div>
										</div>
									</li>
								</ul>
							</div>
						</div>
					</div>
					<!--第二屏-->
					<div class="swiper-slide">
						<div class="orderSource slideCon_bg  clearfix orderStatistic" style="position: relative;">
							<p class="slide_title">工单分布情况表</p>
							<div class="timeWrap twotimeWarp" style="float: right; margin-right: 150px; margin-top: 100px;">
								<div class="time_box pull-right form-inline" style="margin-left: 20px;">
									日期<input type="text" id="time2" class="times" style="width:200px;" placeholder="请选择日期"/>
								</div>
							</div>
							<div class="idx-focus" id="j_idx_focus" >
								<div class="idx-foc-tmp b_main" id="banner">
									<div class="oneRog picBox focus-pic pic  content" rel="xtaberItems" id="picBox"  style="width: 800px;height:550px;position: absolute;top:250px;left:500px;">
										<div class="picImg xtaber-item" style="width:750px;height:500px;">
											<div id="sippu" style="width:750px;height:500px;"></div>
										</div>
										<div class="picImg" style="width:750px;height:500px; ">
											<div id="siupi" style="width:750px;height:500px;"></div>
										</div>
										<div class="picImg   aabbcc" style="width:750px;height:500px;">
											<div id="siupiac" style="width:750px;height:500px;"></div>
										</div>
										<div class="picImg" style="width:750px;height:500px;">
											<div id="siyi" style="width:750px;height:500px;"></div>
										</div>	
									</div>
								</div>
								<div class="tabIt xtaber-tabs tabs list-tab" id="listBox">
										<div class="aaa autype">
											<div class="bg" style="display: block;"></div>
											<div id="uction"  class="ccc"></div>
										</div>
										<div class="aaa  active autype active current">
											<div class="bg" style="display: block;"></div>
											<div id="chart" class="ccc" ></div>
										</div>
										<div class="aaa autype">
											<div class="bg" style="display: block;"></div>
											<div id="dback" class="ccc"></div>
										</div>
										<div class="aaa autype">
											<div class="bg" style="display: block;"></div>
											<div id="mold"  class="ccc" ></div>
										</div>
								</div>
							</div>
						    <div class="oneRog" style="margin-left:20px;padding: 0;position: absolute;right: 150px;top:200px;">
						    	<ul >
						    	</ul>
						    </div>
						</div>
					</div>
					<!-- 第三屏 -->
					<div class="swiper-slide">
						<div class="orderSource slideCon_bg  clearfix orderStatistic" style="position: relative;">
							<p class="slide_title">话务数据情况表</p>
							<div class="timeWrap twotimeWarp" style="float: right; margin-right: 150px; margin-top: 100px;">
								<div class="time_box pull-right form-inline" style="margin-left: 20px;">
									日期<input type="text" id="time3" class="times" style="width:200px;" placeholder="请选择日期"/>
								</div>
							</div>
							<div class="idx-focus" id="j_idx_focus" >
								<div class="idx-foc-tmp b_main" id="banner">
									<div class="oneRog picBox focus-pic pic  content" rel="xtaberItems" id="picBox"  style="width: 800px;height:550px;position: absolute;top:250px;left:500px;">
										<div class="trafficImg xtaber-item" style="width:750px;height:500px;">
											<div id="trafficAppeal" style="width:750px;height:500px;"></div>
										</div>
										<div class="trafficImg" style="width:750px;height:500px; ">
											<div id="trafficCallConnected" style="width:750px;height:500px;"></div>
										</div>
										<div class="trafficImg   aabbcc" style="width:750px;height:500px;">
											<div id="trafficAppealTotal" style="width:750px;height:500px;"></div>
										</div>
										<div class="trafficImg" style="width:750px;height:500px;">
											<div id="trafficAgentBusy" style="width:750px;height:500px;"></div>
										</div>	
									</div>
								</div>
								<div class="tabIt xtaber-tabs trafficTabs list-tab" id="listBoxTraffic">
									<div class="aaa autype">
										<div class="trafficBg" style="display: block;"></div>
										<div id="smallAppeal"  class="ccc"></div>
									</div>
									<div class="aaa  active autype active current">
										<div class="trafficBg" style="display: block;"></div>
										<div id="smallCallConnected" class="ccc" ></div>
									</div>
									<div class="aaa autype">
										<div class="trafficBg" style="display: block;"></div>
										<div id="smallAppealTotal" class="ccc"></div>
									</div>
									<div class="aaa autype">
										<div class="trafficBg" style="display: block;"></div>
										<div id="smallAgentBusy"  class="ccc" ></div>
									</div>
								</div>
							</div>
						</div>
					</div>
				</div>
				<div class="swiper-button-prev"></div>
				<div class="swiper-pagination"></div>
				<div class="swiper-button-next"></div>
			</div>
		</div>
		
		<script src="js/swiper.min.js"></script>
		<script src="js/swiper.animate1.0.3.min.js"></script>
		<script src="js/countUp.js"></script>
		<script src="js/tagcloud.js"></script>
		<script src="js/ScrollDiv.js"></script>
		<script src="plugins/numbergd/index.js"></script>
		<!-- <script src="js/jquery.min.js"></script> -->
		<script src="js/index.js"></script>
		<!--<script src="js/liuzhangtu.js"></script>-->
		<script src="js/workOrderDistribution.js"></script>
		<script src="js/trafficDataTable.js"></script>
        <!-- <script src="js/jq.taber.js"></script> -->
		<script src="js/echarts.min.js"></script>
		<!-- <script type="text/javascript" src="http://echarts.baidu.com/gallery/vendors/echarts/echarts.min.js"></script> -->
		<script>
		</script>
	</body>
</html>