<!-- include '../header' -->
<script src="<?= receipt ?>"></script>
<script src="<?= WEB_SITE_GLOBAL ?>js/echarts.common.min.js"> </script>

<body>
	<div class="mainLayout">
		<div class="mainMenu">
			<div class="menuItem">
				<a href="#" class="mLogo">CLD</a>
				<ul>
					<!-- include '../admin/menuReceipt' -->
				</ul>
			</div>
		</div>
		<div class="warpContent">
			<div class="subMenu fL">
				<div class="menuItem">
					<!-- include '../admin/receipt_menu' -->
				</div>
			</div>
				<div class="adminContent autoHeight">
					<div class="saea-borad">
						<div class="borad-menu">
						</div>
						<div class="borad-news">
							<div class="saeaList">
								<div class="clearfix">
	                                <div id="chartContainer3" style="height: 300px; width: 100%;">
	                                </div>
	                            </div>
								<!--预留-->
								<!-- <div class="clearfix">
									<legend><div class="fR"></div>待处理（收款转入）</legend>
									<table class="table table-bordered table-condensed">
										<tbody>
										<tr><th class="taC" width="140">收款金额</th><th class="taC">银行到帐信息</th><th class="taC">银行/到帐时间</th><th class="taC">收款录入</th><th class="taC">操作</th></tr>
										</tbody>
									</table>
								</div> -->
								<div class="clearfix">
									<legend>收款未完成</legend>
									<table class="table table-bordered table-condensed">
										<tbody>
										<tr>
											<th class="taC">培训班名称</th>
											<th class="taC">开班时间</th>
											<th class="taC">完成结算</th>
											<th class="taC">开票金额</th>
											<th class="taC">实际收款金额</th>
											<th class="taC">应收款总额</th>
										</tr>
										<!-- loop unpaid -->
										<tr>
											<th><a href="/receiptTrain/approval/{{unpaid' value.ridKey}}.html">{{unpaid' value.trainName}}</a></th>
											<td class="taC">{{unpaid' value.trainStartDate}}</td>
											<td class="taC">{{unpaid' value.trainEndDate}}</td>
											<td class="taR">￥{{unpaid' value.iTrain.invoiceTotalAmount}}</td>
											<td class="taR">￥{{unpaid' value.iTrain.invoiceArriveAmount}}</td>
											<td class="taR colRed">￥{{unpaid' value.iTrain.receivablesAmount}}</td>
										</tr>
										<!-- endloop -->
										</tbody>
									</table>
								</div>
								<div class="clearfix">
									<legend><div class="fR"><a href="/receiptTrainRevenueAchieve">所有培训班</a></div>最近收款完成</legend>
									<table class="table table-bordered table-condensed">
										<tbody>
										<tr>
											<th class="taC">培训班名称</th>
											<th class="taC">开班时间</th>
											<th class="taC">完成结算</th>
											<th class="taC">收入</th>
											<th class="taC">支出</th>
											<th class="taC">利润</th>
										</tr>
										<!-- loop paid -->
										<tr>
											<th><a href="/receiptTrain/approval/{{unpaid' value.ridKey}}.html">{{unpaid' value.trainName}}</a></th>
											<td class="taC">{{unpaid' value.trainStartDate}}</td>
											<td class="taC">{{unpaid' value.trainEndDate}}</td>
											<td class="taR">￥{{unpaid' value.iTrain.invoiceTotalAmount}}</td>
											<td class="taR">￥{{unpaid' value.iTrain.expendAmount}}</td>
											<td class="taR">￥{{unpaid' value.iTrain.profit}}</td>
										</tr>
										<!-- endloop -->
										</tbody>
									</table>
								</div>
							</div>
						</div>
					</div>
			</div>
<script type="text/javascript">autoFlashHeight();</script>
    <script type="text/javascript">
	    // 基于准备好的dom，初始化echarts图表
	    var myChart = echarts.init(document.getElementById('chartContainer3'));
	    var option = {
	        color: ["#F56954", "#00A65A", "#3C8DBC"],
	        title: {
	            text: '培训班营收图表'
	        },
	        tooltip: {
	            trigger: 'axis',
	            formatter: "{b} <br/>{a}：{c} 元<br/>{a1}：{c1} 元<br/>{a2}：{c2} 元"
	        },
	        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: {{month}}
	        }],
	        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: {{pay}}
	            },
	            {
	                name: '收入',
	                type: 'line',
	                itemStyle: {
	                    normal: {
	                        lineStyle: {
	                            shadowColor: 'rgba(0,0,0,0.4)',
	                            shadowBlur: 5,
	                            shadowOffsetX: 3,
	                            shadowOffsetY: 3
	                        }
	                    }
	                },
	                data: {{income}}
	            },
	            {
	                name: '利润',
	                type: 'line',
	                itemStyle: {
	                    normal: {
	                        lineStyle: {
	                            shadowColor: 'rgba(0,0,0,0.4)',
	                            shadowBlur: 5,
	                            shadowOffsetX: 3,
	                            shadowOffsetY: 3
	                        }
	                    }
	                },
	                data: {{profit}}
	            }
	        ]
	    };
	    // 为echarts对象加载数据 
	    myChart.setOption(option);
	    //3 标段计量分布//
    </script>
</body>
