qzyReal
/
pco


			
							123456789101112131415161718192021222324252627282930313233343536373839404142434445464748495051525354555657585960616263646566676869707172737475767778798081828384858687888990919293949596979899100101102103104105106107108109110111112113114115116117118119120121122123124125126127128129130131132133134135136137138139140141142143144145146147148149150151152153154155156157158159160161162163164165166167168169170171172173174175176177178179180181182183184185186187188189190191192193194195196197198199200201202203204205206207208209210211212213214215216217218219220221222223224225226227228229230231232233234235236237238239240241242243244
							<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN""http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
	<head>
		<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
		<title>打印报表</title>
		<style type="text/css">
			/* 	@page {
				size: A4 portrait;
				margin: 1.9cm 2.5cm 1.5cm 2.5cm;
			} */
			@page {
				size: A4 landscape;
				margin: 19mm 25mm 15mm 25mm;
			}

			.print-btn {
				color: white;
				background: #2D8CF0;
				border: none;
				border-radius: 3px;
				padding: 5px 10px;
				font-size: 10px;
				margin: 10px 20px;
				cursor: pointer;
			}

			/* .content-box {
				text-align: center;
				height: 1123px;
				width: 794px;
				margin: 0 auto;
				position: relative;
			} */
			.content-box {
				text-align: center;
				height: 794px;
				width: 1123px;
				margin: 0 auto;
			}

			table {
				border-collapse: collapse;
				border-spacing: 0;
				border-left: 1px solid #888;
				border-top: 1px solid #888;
			}

			th,
			td {
				border-right: 1px solid #888;
				border-bottom: 1px solid #888;
				word-break: break-all;
			}

			th {
				font-weight: bold;
			}

			.title-top {
				margin-top: 248px;
			}
		</style>
		<link rel="stylesheet" href="../../static/sa.css">
		<script src="../../static/kj/vue.min.js"></script>
		<script src="../../static/kj/element-ui/index.js"></script>
		<script src="../../static/print/jquery-2.0.3.js" type="text/javascript"></script>
		<script src="../../static/print/print2.js" type="text/javascript"></script>
		<script src="../../static/kj/layer/layer.js"></script>
		<script src="../../static/sa.js"></script>
	</head>

	<body>

		<div>
			<div class="box">
				<button class="print-btn" @click="printFn">打印</button>
				<div id="myPrintArea">
					<div class="content-box" style="position: relative;" v-for="(item,index) in dataList"
						:class="index>0?'title-top':''" :key="index">
						<div class="header-title" style="text-align: center;" v-if="index==0">
							<h2 style="font-size: 20px;">东兴口岸（二桥）进口货物集散区 (A1地块)（月）统计表</h2>
						</div>
						<div style="width: 1123px;display: flex;text-align: left;padding-top: 10px;">
							<div style="flex: 2;">单位：广西东兴北投口岸投资有限公司</div>
							<div style="flex: 3;">金额单位：元</div>
						</div>
						<table style="margin-top: 10px;text-align: center;width: 1123px;">
							<tr style="font-weight: 500;padding: 0 0.5px;">
								<th style="width: 30px;" rowspan="2">月份</th>
								<th style="width: 64px;" rowspan="2"> 收费项目</th>
								<th colspan="4">收款方式</th>
								<th style="width: 30px;" rowspan="2">数量</th>
								<th style="width: 55px;" rowspan="2">总价</th>
								<th style="width: 55px;" rowspan="2">不含税金额</th>
								<th style="width: 30px;" rowspan="2">税率</th>
								<th style="width: 50px;" rowspan="2">税款</th>
								<td style="width: 65px;" rowspan="2">统计稽查员</td>
								<td style="width: 60px;" rowspan="2">复核员</td>
								<td style="width: 60px;" rowspan="2">开单员</td>
							</tr>
							<tr style="font-weight: 500;padding: 0 0.5px;">
								<th style="width: 50px;">微信</th>
								<th style="width: 35px;">支付宝</th>
								<th style="width: 30px;">银联</th>
								<th style="width: 45px;">预存金额</th>
							</tr>
							<tr v-for="cel in item.list" :key="cel.index" style="height: 60px;padding: 0 0.5px;">
								<td>{{cel.dayTime.split('-')[1]}}</td>
								<td>{{cel.feeType}}</td>
								<td>{{cel.wxPrice}}</td>
								<td>{{cel.aliPrice}}</td>
								<td>{{cel.cardPrice}}</td>
								<td>{{cel.yuePrice}}</td>
								<td>{{cel.num}}</td>
								<td>{{cel.taxMoney}}</td>
								<td>{{cel.noTaxMoney}}</td>
								<td>{{cel.taxRate}}</td>
								<td>{{cel.taxes}}</td>
								<td>{{cel.jiChaPerson}}</td>
								<td>{{cel.diaoDuPerson}}</td>
								<td>{{cel.kaiDanPerson}}</td>
							</tr>
							<tr style="height: 60px;padding: 0 0.5px;" v-if="index==dataList.length-1">
								<td colspan="2">合计</td>
								<td>{{(total.totalWxPrice)}}</td>
								<td>0</td>
								<td>0</td>
								<td>{{total.totalYuePrice}}</td>
								<td>{{total.num}}</td>
								<td>{{total.totalMoney}}</td>
								<td>{{(total.totalNoTaxMoney).toFixed(2)}}</td>
								<td>-</td>
								<td>{{(total.totalTaxes).toFixed(2)}}</td>
								<td>{{total.jiChaPerson}}</td>
								<td>{{total.diaoDuPerson}}</td>
								<td>{{total.kaiDanPerson}}</td>
							</tr>
						</table>
						<div style="display: flex;text-align: left;margin-top: 20px;" v-if="index+1==dataList.length">
							<div style="flex: 1;">运营部负责人</div>
							<div style="flex: 1;">运营分管领导</div>
						</div>
						<span style="position: absolute;top: 780px;left: 1050px">{{index+1}}/{{dataList.length}}</span>
					</div>
				</div>
			</div>
		</div>

		<script type="text/javascript">
			var app = new Vue({
				el: '.box',
				data: {
					p: {
						"beginDay": sa.p('beginDay', ''),
						"endDay": sa.p('endDay', ''),
						"feeType": sa.p('feeType', ''),
						"beginMonth": sa.p('beginMonth', ''),
						"endMonth": sa.p('endMonth', '')
					},
					dataList: [],
					total: {
						totalAliPrice: 0,
						totalCardPrice: 0,
						totalMoney: 0,
						totalNoTaxMoney: 0,
						totalTaxes: 0,
						totalWxPrice: 0,
						totalYuePrice: 0,
						num: 0
					}
				},
				methods: {
					getDataList() {
						let data = {
							isMonth: 1,
							isYear: '',
							year: '',
							beginMonth: this.p.beginMonth,
							endMonth: this.p.endMonth,
							beginDay: '',
							endDay: '',
							feeType: this.p.feeType
						}
						sa.ajax('/TbFeeStatistics/prePrint', data, function(resp) {
							this.total = resp.data;
							var list = resp.data.list;
							let len = list.length;
							let child = [];
							let dataList = [];
							let wxTotal = 0;
							let yuePrice = 0;
							let totalNum = 0;
							let totalMoney = 0;
							let totalTaxMoney = 0;
							let totalNoTaxMoney = 0;
							for (i = 0; i < len; i++) {
								let item = list[i];
								wxTotal += item.wxPrice;
								yuePrice += item.yuePrice;
								totalNum = parseFloat(totalNum) + parseFloat(item.num);
								totalMoney += item.taxMoney;
								totalTaxMoney += item.taxes;
								totalNoTaxMoney += item.noTaxMoney;
								child.push(item);
								if (child.length == 10 || i == len - 1) {
									let title = {
										time: this.p.beginDay ? this.p.beginDay + '至' + this.p.endDay :
											'所有时间',
										list: child,
										wxTotal: wxTotal,
										yuePrice: yuePrice,
										totalNum: totalNum,
										totalMoney: totalMoney,
										totalTaxMoney: totalTaxMoney,
										totalNoTaxMoney: totalNoTaxMoney
									}
									dataList.push(title);
									child = [];
								}
							}
							this.total.num = totalNum;
							this.dataList = dataList;
							sa.loading("准备打印...");
							setTimeout(() => {
								this.printFn();
								sa.hideLoading();
							}, 1000)
						}.bind(this))
					},
					printFn() {
						Print('#myPrintArea', {
							noPrint: '.noPrint'
						});
					}
				},
				mounted() {
					this.getDataList();
				}
			})
		</script>


	</body>
</html>