laiguoran
/
jlzf_web


			
				
					
						
						
							123456789101112131415161718192021222324252627282930313233343536373839404142434445464748495051525354555657585960616263646566676869707172737475767778798081828384858687888990919293949596979899100101102103104105106107108109110111112113114115116117118119120121122123124125126127128129130131132133134135136137138139140141142143144145146147148149150151152153154155156157158159160161162163164165166167168169170171172173174175176177178179180181182183184185186187188189190191192193194195196197198199200201202203204205206207208209210211212213214215216217218219220221222223224225226227228229230231232233234235236237238239240241242243244245246247248249250251252253254255256257258259260261262263264265266267268269270271272273274275276277278279280281282283284285286287288289290291292293294295296297298299300301302303304305306307308309310311312313314315316317318319320321322323324325326327328329330
							<!DOCTYPE html>
<html lang=zh-cn>
<head>
	<meta charset="utf-8">
	<title>纵横计量支付系统</title>
	<meta name=description content=计量支付>
	<meta name=copyright content=smartcost.com.cn>
	<meta name="viewport" content="width=device-width,initial-scale=1.0">
	<link rel=stylesheet href="{{rootUrl}}global/css/bootstrap.css">
	<link rel=stylesheet href={{rootUrl}}global/css/style.css>
</head>
<body>
<!-- include "top" -->
<div class="wrapContent">
	<!-- include "left" -->
	<div class="mainContainer">
		<!--内容-->
		<div class="mainContent">
			<div class="title clearfix">
				<ul class="nav nav-pills">
					<li class="dropdown"><a href="{{rootUrl}}project/index" title="返回"><span class="closePanel" aria-hidden="true" data-icon="Z"></span></a></li>
					<li class="dropdown">
						<a href="{{rootUrl}}project/{{currProID}}/overview" data-toggle="dropdown" class="dropdown-toggle">
							{{currProName}}<b class="caret"></b>
						</a>
						<ul class="dropdown-menu">
							<!-- loop othrPro -->
							<li><a href="{{rootUrl}}project/{{othrPro' value.pid}}/overview">{{othrPro' value.pname}}</a></li>
							<!-- endloop -->
						</ul>
					</li>
				</ul>
				<!--			<div class="fR">
                                <a href="#pojoption" data-toggle="modal"  class="btn"><i class="icon-cog"></i> 项目设置</a>
                            </div>-->
			</div>
			<!--导航-->
			<ul class="nav nav-tabs">
				<li class="active">
					<a href="{{rootUrl}}project/{{pid}}/overview">项目汇总</a>
				</li>
				<li><a href="{{rootUrl}}project/{{pid}}/section">标段列表</a></li>
			</ul>
			<div class="project">
				<div class="proSection clearfix">
					<!--图表1-->
					<div class="fL" style="width:49%">
						<div id="chartContainer" style="height: 300px; width: 100%;">
						</div>
					</div>
					<!--图表1-->
					<!--图表2-->
					<div class="fR" style="width:49%">
						<div id="chartContainer2" style="height: 300px; width: 100%;">
						</div>
					</div>
					<!--图表2-->
				</div>
				<div class="proSection clearfix">
					<!--图表3-->
					<div id="chartContainer3" style="height: 300px; width: 100%;">
					</div>
				</div>
			</div>
			<!--内容-->
		</div>
	</div>
	<!-- 项目设置弹出 -->
	<div id="pojoption" class="modal hide fade" tabindex="-1" role="dialog" aria-labelledby="myModalLabel" aria-hidden="true">
		<div class="modal-header">
			<button type="button" class="close" data-dismiss="modal" aria-hidden="true">×</button>
			<h3 id="myModalLabel">项目设置</h3>
		</div>
		<div class="modal-body">

			<div class="form">
				<form class="form-horizontal">
					<div class="control-group">
						<label class="control-label" for="inputEmail">项目名称</label>
						<div class="controls">
							<input type="text" placeholder="输入项目名称" value="黄金大桥项目">
						</div>
					</div>
					<div class="control-group">
						<label class="control-label" for="inputEmail">颜色标识</label>
						<div class="controls">
							<ul class="pjColorList">
								<li class="pjColor pj-c1 pjSelect"></li>
								<li class="pjColor pj-c2"></li>
								<li class="pjColor pj-c3"></li>
								<li class="pjColor pj-c4"></li>
								<li class="pjColor pj-c5"></li>
								<li class="pjColor pj-c6"></li>
								<li class="pjColor pj-c7"></li>
								<li class="pjColor pj-c8"></li>
							</ul>
						</div>
					</div>
				</form>
			</div>
		</div>
		<div class="modal-footer">
			<button class="btn" data-dismiss="modal" aria-hidden="true">关闭</button>
			<button class="btn btn-primary">保存</button>
		</div>
	</div>
</div>
<!-- 项目设置弹出 -->
<script src={{rootUrl}}global/js/jquery-1.9.1.min.js></script>
<script src={{rootUrl}}global/js/bootstrap.js></script>
<script src={{rootUrl}}global/js/jl.js></script>
<script src={{rootUrl}}global/js/echarts.min.js></script>
<script type="text/javascript">autoFlashHeight();</script>
<!--导航-->
<script type="text/javascript">
// 路径配置
$(function() {
	//1 标段计量分布//
	// 基于准备好的dom，初始化echarts图表
	var myChart = echarts.init(document.getElementById('chartContainer'));
	var option = {
		color: ['#e9af68','#57b7b6','#e4575a','#959eac','#ffa500',
			'#d38b70','#8fb7cf','#cd5c5c','#5c616b','#40e0d0',
			'#1e90ff','#ff6347','#7b68ee','#00fa9a','#ffd700',
			'#6699FF','#ff6666','#3cb371','#b8860b','#30e0e0'],
		title: {
			text: '标段计量分布',
			x: 'left'
		},
		tooltip: {
			trigger: 'item',
			formatter: "{a} <br/>{b}：{c} <br>占总项目：{d} %"
		},
		legend: {
			selectedMode: false,
			orient: 'vertical',
			x: 'left',
			y: 'center',
			data: [
				<!-- loop conArray -->
				'{{conArray' value.stname}}',
				<!-- endloop -->
			]
		},
		calculable: true,
		series: [
			{
				name: '标段计量分布',
				type: 'pie',
				radius: '60%',
				center: ['60%', 175],
				data: [
					<!-- loop conArray -->
					{value: {{conArray' value.total}}, name: '{{conArray' value.stname}}'},
					<!-- endloop -->
				]
			}
		]
	};
	// 为echarts对象加载数据
	myChart.setOption(option);
	//1 标段计量分布//
	//2 标段计量进度//
	var myChart2 = echarts.init(document.getElementById('chartContainer2'));
	var option = {
		color:["#e9af68","#57b7b6","#e4575a"],
		title: {
			text: '标段计量进度'
		},
		tooltip: {
			trigger: 'axis',
			formatter: "{b}  <br/>{a}：{c}元 <br/>{a1}：{c1}元<br/>{a2}：{c2} %"
		},
		legend: {
			data: ['总价', '截止本期完成', '完成进度百分比']
		},
		xAxis: [
			{
				type: 'category',
				data: [
					<!-- loop conArray -->
					'{{conArray' value.stname}}',
					<!-- endloop -->
				]
			}
		],
		yAxis: [
			{
				type: 'value',
				name: '金额(元)',
				position: 'left',
				axisLabel: {
					formatter: '{value}'
				},
				splitArea: {show: true},

			},
			{
				type: 'value',
				position: 'right',
				max: '100',
				axisLabel: {
					formatter: '{value} %'
				},
				splitArea: {show: false},
				splitLine: {show: false}
			}
		],
		series: [
			{
				name: '总价',
				type: 'bar',
				data: [
					<!-- loop conArray -->
					{{conArray' value.total}},
					<!-- endloop -->
				],
			},
			{
				name: '截止本期完成',
				type: 'bar',
				data: [
					<!-- loop conArray -->
					{{conArray' value.stopnow}},
					<!-- endloop -->
			    ],
			},
			{
				name: '完成进度百分比',
				type: 'line',
				yAxisIndex: 1,
				data: [
					<!-- loop conArray -->
					{{conArray' value.pstopnow}},
					<!-- endloop -->
				],
			}
		]
	};
	// 为echarts对象加载数据
	myChart2.setOption(option);
	//2 标段计量进度//
    //3 标段计量分布//
    // 基于准备好的dom，初始化echarts图表
    var myChart3 = echarts.init(document.getElementById('chartContainer3'));
	var option = {
		color:["#e9af68","#57b7b6"],
		title : {
			text: '项目按月进度'
		},
		tooltip : {
			trigger: 'axis',
			formatter: "{b} <br/>{a}：{c} %<br/>{a1}：{c1} %"
		},
		legend: {
			data:['累计完成','本月完成']
		},
		toolbox: {
			show : true,
			feature : {
				magicType : {show: true, type: ['line', 'bar']}
			}
		},
		dataZoom : {
			show : true,
			start : 0,
			end : 100
		},
    	xAxis : [
        	{
				type : 'category',
				boundaryGap : true,
            	data : [
					{{projectDate}}
            	]
			}
    	],
    	yAxis : [
			{
				type : 'value',
				axisLabel : {
					formatter: '{value} %'
				},
				splitArea : {show : true}
			}
		],
    	series : [
			{
				name:'累计完成',
				type:'line',
				itemStyle: {
					normal: {
						lineStyle: {
							shadowColor : 'rgba(0,0,0,0.4)',
							shadowBlur: 5,
							shadowOffsetX: 3,
							shadowOffsetY: 3
						}
					}
				},
				data:[
					{{t1}}
				]
			},
			{
				name:'本月完成',
				type:'line',
                itemStyle: {
                     normal: {
                         lineStyle: {
							 shadowColor : 'rgba(0,0,0,0.4)',
							 shadowBlur: 5,
                             shadowOffsetX: 3,
                             shadowOffsetY: 3
                         }
                     }
                },
                data:[
					{{t2}}
				]
			}
		]
	};
	// 为echarts对象加载数据
	myChart3.setOption(option);
	//3 标段计量分布//
});
</script>
</body>
<html/>