|
@@ -0,0 +1,364 @@
|
|
|
+<!DOCTYPE html>
|
|
|
+<html lang=zh-cn>
|
|
|
+<head>
|
|
|
+ <meta charset=utf-8>
|
|
|
+ <title>纵横计量支付系统</title>
|
|
|
+ <meta name=description content=计量支付>
|
|
|
+ <meta name=copyright content=smartcost.com.cn>
|
|
|
+ <link rel=stylesheet href=css/bootstrap.css>
|
|
|
+ <link rel=stylesheet href=css/style.css>
|
|
|
+ <script src=js/jquery-1.9.1.min.js></script>
|
|
|
+ <script src=js/bootstrap.js></script>
|
|
|
+ <script src=js/jl.js></script>
|
|
|
+ <script src=js/echarts.min.js></script>
|
|
|
+</head>
|
|
|
+<body style="overflow:auto">
|
|
|
+ <div class="wrapHeader"><h1 title="纵横计量支付" class="mainLogo"></h1></div>
|
|
|
+ <div class="mainContent">
|
|
|
+ <div class="row-fluid">
|
|
|
+ <div class="span7"><h2>黄金大桥项目</h2>
|
|
|
+ <p><span data-icon="n"></span> <a href="http://g1506.6jlzf.cn/share?pid=1212">http://g1506.6jlzf.cn/share?pid=1212</a></p></div>
|
|
|
+ <div class="span5">
|
|
|
+ <div class="detail">
|
|
|
+ <h5>总价:¥500,000,000.00元 (<span class="colRed">+¥500,000.00</span>)</h5>
|
|
|
+ <div class="progress">
|
|
|
+ <div class="bar bar-success" style="width: 65%;">65%</div>
|
|
|
+ </div>
|
|
|
+ </div>
|
|
|
+ </div>
|
|
|
+ </div>
|
|
|
+ <!--项目汇总-->
|
|
|
+ <ul class="nav nav-tabs">
|
|
|
+ <li class="active">
|
|
|
+ <a href="w-project-detail.html">项目汇总</a>
|
|
|
+ </li>
|
|
|
+ </ul>
|
|
|
+ <div class="project">
|
|
|
+ <div class="proSection clearfix">
|
|
|
+ <!--图表1-->
|
|
|
+ <div class="fL" style="width:39%">
|
|
|
+ <div id="chartContainer" style="height: 300px; width: 100%;">
|
|
|
+ </div>
|
|
|
+ </div>
|
|
|
+ <!--图表1-->
|
|
|
+ <!--图表2-->
|
|
|
+ <div class="fR" style="width:59%">
|
|
|
+ <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>
|
|
|
+ <!--图表3-->
|
|
|
+ </div>
|
|
|
+ </div>
|
|
|
+ <!--标段列表-->
|
|
|
+ <ul class="nav nav-tabs">
|
|
|
+ <li class="active"><a>标段列表</a></li>
|
|
|
+ </ul>
|
|
|
+ <div class="project">
|
|
|
+ <div class="proSection">
|
|
|
+ <table class="table">
|
|
|
+ <thead>
|
|
|
+ <tr>
|
|
|
+ <td width="150"><span aria-hidden="true" data-icon="u"></span> 土建合同</td>
|
|
|
+ <td width="50">总价:</td><td width="165">¥<b style="font-size:16px">123,122,212.00</b></td>
|
|
|
+ <td width="60">完成进度:</td><td><div class="progress">
|
|
|
+ <div class="bar bar-success" style="width:65%;" data-placement="bottom" data-toggle="tooltip" data-original-title="累计完成:¥731,121,121.00">65%</div>
|
|
|
+ <div class="bar bar-danger" style="width:35%;" data-placement="bottom" data-toggle="tooltip" data-original-title="未完成:¥71,121,121.00">35%</div>
|
|
|
+ </div></td>
|
|
|
+ </tr>
|
|
|
+ </thead>
|
|
|
+ </table>
|
|
|
+ <table class="table table-striped table-hover">
|
|
|
+ <thead>
|
|
|
+ <tr><th class="taC" width="225">标段名</th><th class="taC" width="140">计量期数</th><th width="115" class="taC">总价</th><th class="taC" width="">截止上期累计完成/本期完成/未完成</th></tr></thead>
|
|
|
+ <tbody>
|
|
|
+ <tr>
|
|
|
+ <td><a href="w-share-project-section-detail.html" target="_blank">GZ-HJDQ-JL-001(点我)</a></td>
|
|
|
+ <td class="">共 5 期(本期 <span class="colOrange">审批中</span>)</td>
|
|
|
+ <td class="taR">¥5,000,000.00</td>
|
|
|
+ <td>
|
|
|
+ <div class="progress">
|
|
|
+ <div class="bar bar-success" style="width: 45%;" data-placement="bottom" data-toggle="tooltip" data-original-title="截止上期累计完成:¥731,121,121.00">45%</div>
|
|
|
+ <div class="bar" style="width:25%;" data-placement="bottom" data-toggle="tooltip" data-original-title="本期完成:¥31,121,121.00">25%</div>
|
|
|
+ <div class="bar bar-gary" style="width:30%;" data-placement="bottom" data-toggle="tooltip" data-original-title="未完成:¥71,121,121.00">30%</div>
|
|
|
+ </div>
|
|
|
+ </td>
|
|
|
+ </tr>
|
|
|
+ <tr>
|
|
|
+ <td><a href="w-share-project-section-detail.html" target="_blank">GZ-HJDQ-JL-002</a></td>
|
|
|
+ <td class="">共 2 期(本期 <span class="colGreen">已完成</span>)</td>
|
|
|
+ <td class="taR">¥233,453,000.00</td>
|
|
|
+ <td>
|
|
|
+ <div class="progress">
|
|
|
+ <div class="bar bar-success" style="width: 29%;" data-placement="bottom" data-toggle="tooltip" data-original-title="截止上期累计完成:¥731,121,121.00">29%</div>
|
|
|
+ <div class="bar" style="width:5%;" data-placement="bottom" data-toggle="tooltip" data-original-title="本期完成:¥31,121,121.00">5%</div>
|
|
|
+ <div class="bar bar-gary" style="width:66%;" data-placement="bottom" data-toggle="tooltip" data-original-title="未完成:¥71,121,121.00">66%</div>
|
|
|
+ </div>
|
|
|
+ </td>
|
|
|
+ </tr>
|
|
|
+ <tr>
|
|
|
+ <td><a href="w-share-project-section-detail.html" target="_blank">GZ-HJDQ-JL-003</a></td>
|
|
|
+ <td class="">共 0 期(本期 <span class="colGray">未上报</span>)</td>
|
|
|
+ <td class="taR">¥0.00</td>
|
|
|
+ <td>
|
|
|
+ <div class="progress">
|
|
|
+ <div class="bar bar-success" style="width:0%;" data-placement="bottom" data-toggle="tooltip" data-original-title="截止上期累计完成:¥0.00">15%</div>
|
|
|
+ <div class="bar" style="width:0" data-placement="bottom" data-toggle="tooltip" data-original-title="本期完成:¥0.00">0%</div>
|
|
|
+ <div class="bar bar-gary" style="width:0" data-placement="bottom" data-toggle="tooltip" data-original-title="未完成:¥0.00">0%</div>
|
|
|
+ </div>
|
|
|
+ </td>
|
|
|
+ </tr>
|
|
|
+ </tbody></table>
|
|
|
+ </div>
|
|
|
+ <div class="proSection">
|
|
|
+ <table class="table">
|
|
|
+ <thead>
|
|
|
+ <tr>
|
|
|
+ <td width="150"><span aria-hidden="true" data-icon="u"></span> 监理合同</td>
|
|
|
+ <td width="90">累计合同计量:</td><td width="165">¥<b style="font-size:16px">123,122,212.00</b></td>
|
|
|
+ <td width="60">完成进度:</td><td><div class="progress">
|
|
|
+ <div class="bar bar-success" style="width:25%;" data-placement="bottom" data-toggle="tooltip" data-original-title="累计完成:¥731,121,121.00">25%</div>
|
|
|
+ <div class="bar bar-danger" style="width:75%;" data-placement="bottom" data-toggle="tooltip" data-original-title="未完成:¥71,121,121.00">75%</div>
|
|
|
+ </div></td>
|
|
|
+ </tr>
|
|
|
+ </thead>
|
|
|
+ </table>
|
|
|
+ <table class="table table-striped table-hover">
|
|
|
+ <thead>
|
|
|
+ <tr><th class="taC" width="225">标段名</th><th class="taC" width="140">计量期数</th><th width="115" class="taC">累计合同计量</th><th class="taC" width="">截止上期累计完成/本期完成/未完成</th></tr></thead>
|
|
|
+ <tbody>
|
|
|
+ <tr>
|
|
|
+ <td><a href="w-project-section-detail.html" target="_blank">GZ-HJDQ-JL-001</a></td>
|
|
|
+ <td class="">共 5 期(本期 <span class="colOrange">审批中</span>)</td>
|
|
|
+ <td class="taR">¥5,000,000.00</td>
|
|
|
+ <td>
|
|
|
+ <div class="progress">
|
|
|
+ <div class="bar bar-success" style="width: 45%;" data-placement="bottom" data-toggle="tooltip" data-original-title="截止上期累计完成:¥731,121,121.00">45%</div>
|
|
|
+ <div class="bar" style="width:25%;" data-placement="bottom" data-toggle="tooltip" data-original-title="本期完成:¥31,121,121.00">25%</div>
|
|
|
+ <div class="bar bar-gary" style="width:30%;" data-placement="bottom" data-toggle="tooltip" data-original-title="未完成:¥71,121,121.00">30%</div>
|
|
|
+ </div>
|
|
|
+ </td>
|
|
|
+ </tr>
|
|
|
+ <tr>
|
|
|
+ <td><a href="w-share-project-section-detail.html" target="_blank">GZ-HJDQ-JL-002</a></td>
|
|
|
+ <td class="">共 2 期(本期 <span class="colGreen">已完成</span>)</td>
|
|
|
+ <td class="taR">¥233,453,000.00</td>
|
|
|
+ <td>
|
|
|
+ <div class="progress">
|
|
|
+ <div class="bar bar-success" style="width: 29%;" data-placement="bottom" data-toggle="tooltip" data-original-title="截止上期累计完成:¥731,121,121.00">29%</div>
|
|
|
+ <div class="bar" style="width:5%;" data-placement="bottom" data-toggle="tooltip" data-original-title="本期完成:¥31,121,121.00">5%</div>
|
|
|
+ <div class="bar bar-gary" style="width:66%;" data-placement="bottom" data-toggle="tooltip" data-original-title="未完成:¥71,121,121.00">66%</div>
|
|
|
+ </div>
|
|
|
+ </td>
|
|
|
+ </tr>
|
|
|
+ <tr>
|
|
|
+ <td><a href="w-share-project-section-detail.html" target="_blank">GZ-HJDQ-JL-003</a></td>
|
|
|
+ <td class="">共 3 期(本期 <span class="colOrange">审批中</span>)</td>
|
|
|
+ <td class="taR">¥6,453,000.00</td>
|
|
|
+ <td>
|
|
|
+ <div class="progress">
|
|
|
+ <div class="bar bar-success" style="width:15%;" data-placement="bottom" data-toggle="tooltip" data-original-title="截止上期累计完成:¥731,121,121.00">15%</div>
|
|
|
+ <div class="bar" style="width:45%;" data-placement="bottom" data-toggle="tooltip" data-original-title="本期完成:¥31,121,121.00">45%</div>
|
|
|
+ <div class="bar bar-gary" style="width:40%;" data-placement="bottom" data-toggle="tooltip" data-original-title="未完成:¥71,121,121.00">40%</div>
|
|
|
+ </div>
|
|
|
+ </td>
|
|
|
+ </tr>
|
|
|
+ </tbody></table>
|
|
|
+ </div>
|
|
|
+ </div>
|
|
|
+ </div>
|
|
|
+<script type="text/javascript">
|
|
|
+ //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:['土建合同','监理合同','设计合同','机电合同']
|
|
|
+ },
|
|
|
+ calculable : true,
|
|
|
+ series : [
|
|
|
+ {
|
|
|
+ name:'标段计量分布',
|
|
|
+ type:'pie',
|
|
|
+ roseType: 'angle',
|
|
|
+ radius : '60%',
|
|
|
+ center: ['60%', 175],
|
|
|
+ data:[
|
|
|
+ {value:27814964.00, name:'土建合同'},
|
|
|
+ {value:41043186.10, name:'监理合同'},
|
|
|
+ {value:42917475.00, name:'设计合同'},
|
|
|
+ {value:27634982.00, name:'机电合同'}
|
|
|
+ ]
|
|
|
+ }
|
|
|
+ ]
|
|
|
+ };
|
|
|
+ // 为echarts对象加载数据
|
|
|
+ myChart.setOption(option);
|
|
|
+ //1 标段计量分布//
|
|
|
+ //2 标段计量进度//
|
|
|
+ var myChart = 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 : ['土建合同','监理合同','设计合同','机电合同']
|
|
|
+ }
|
|
|
+ ],
|
|
|
+ yAxis : [
|
|
|
+ {
|
|
|
+ type : 'value',
|
|
|
+ name : '金额',
|
|
|
+ position:'left',
|
|
|
+ axisLabel : {
|
|
|
+ formatter: '{value} 元'
|
|
|
+ },
|
|
|
+ splitArea : {show : true}
|
|
|
+ },
|
|
|
+ {
|
|
|
+ type : 'value',
|
|
|
+ position:'right',
|
|
|
+ max:'100',
|
|
|
+ axisLabel : {
|
|
|
+ formatter: '{value} %'
|
|
|
+ },
|
|
|
+ splitLine : {show : true}
|
|
|
+ }
|
|
|
+ ],
|
|
|
+ series : [
|
|
|
+ {
|
|
|
+ name:'总价',
|
|
|
+ type:'bar',
|
|
|
+ data:[27814964.00,41043186.10, 42917475.00, 27634982.00]
|
|
|
+ },
|
|
|
+ {
|
|
|
+ name:'累计完成计量',
|
|
|
+ type:'bar',
|
|
|
+ data:[20571481.02,28770211.71, 23427801.00, 1708798.00]
|
|
|
+ },
|
|
|
+ {
|
|
|
+ name:'完成进度百分比',
|
|
|
+ type:'line',
|
|
|
+ yAxisIndex: 1,
|
|
|
+ data:[73.95,70,54.58,6.18],
|
|
|
+ }
|
|
|
+ ]
|
|
|
+ };
|
|
|
+ // 为echarts对象加载数据
|
|
|
+ myChart.setOption(option);
|
|
|
+ //2 标段计量进度//
|
|
|
+ //3 标段计量分布//
|
|
|
+ // 基于准备好的dom,初始化echarts图表
|
|
|
+ var myChart = 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 : 50,
|
|
|
+ end : 100
|
|
|
+ },
|
|
|
+ xAxis : [
|
|
|
+ {
|
|
|
+ type : 'category',
|
|
|
+ boundaryGap : true,
|
|
|
+ data : [
|
|
|
+ '2月','3月','4月','5月','6月','7月','8月','9月','10月'
|
|
|
+ ]
|
|
|
+ }
|
|
|
+ ],
|
|
|
+ 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:[10, 10, 30, 40, 50, 60, 80, 85, 100]
|
|
|
+ },
|
|
|
+ {
|
|
|
+ name:'本月完成',
|
|
|
+ type:'line',
|
|
|
+ itemStyle: {
|
|
|
+ normal: {
|
|
|
+ lineStyle: {
|
|
|
+ shadowColor : 'rgba(0,0,0,0.4)',
|
|
|
+ shadowBlur: 5,
|
|
|
+ shadowOffsetX: 3,
|
|
|
+ shadowOffsetY: 3
|
|
|
+ }
|
|
|
+ }
|
|
|
+ },
|
|
|
+ data:[10, 0, 20, 10, 10, 10, 10, 5, 15]
|
|
|
+ }
|
|
|
+ ]
|
|
|
+ };
|
|
|
+
|
|
|
+
|
|
|
+ // 为echarts对象加载数据
|
|
|
+ myChart.setOption(option);
|
|
|
+ //3 标段计量分布//
|
|
|
+</script>
|
|
|
+</body>
|