qzyReal
/
pco


			
							123456789101112131415161718192021222324252627282930313233343536373839404142434445464748495051525354555657585960616263646566676869707172737475767778798081828384858687888990919293949596979899100101102103104105106107108109110111112113114115116117118119120121122123124125126127128129130131132133134135136137138139140141142143144145146147148149150151152153154155156157158159160161162163164165166167168169170171172173174175176177178179180181182183184185186187188189190191192193194195196197198199200201202203204205206207208209210211212213214215216217
							<!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 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;
				/* width: 1123px; */
				height: 794px;
				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;
				padding: 0 2px;
			}

			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" style="position: relative;">
					<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">
							<span style="font-size: 20px;">东兴口岸（二桥）进口货物集散区 (A1地块)收费记录明细</span>
						</div>
						<table style="margin: 0 auto;margin-top: 20px;text-align: center;width: 1123px;">
							<tr style="height: 60px;">
								<th colspan="8">单位：广西东兴北投口岸投资有限公司</th>
								<th colspan="5">金额单位：元</th>
								<th colspan="6">期间：{{item.time}}</th>
							</tr>
							<tr style="height: 40px;font-size:10px;">
								<th style="min-width: 30px;">序号</th>
								<th style="min-width: 60px;">车牌号</th>
								<th style="min-width: 50px;"> 收费项目</th>
								<th style="min-width: 70px;">业务类型</th>
								<th style="min-width: 90px;">车型</th>
								<th style="width: 25px;">数量</th>
								<th style="width: 30px;">单价</th>
								<th style="width: 60px;">总价</th>
								<th style="width: 70px;">税 款</th>
								<th style="width: 75px;">不含税金额</th>
								<th style="width: 30px;">税率</th>
								<th style="min-width: 50px;">结算状态</th>
								<th style="width: 65px;">收款方式</th>
								<th style="width: 90px;">业务单号</th>
								<th style="width: 90px;">作业公司</th>
								<th style="width: 60px;">开单员</th>
								<th style="width: 60px;">复核员</th>
								<th style="width: 65px;">统计稽查员</th>
							</tr>
							<tr v-for="cel in item.list" :key="cel.index" style="height: 55px;font-size: 10px;">
								<td>{{cel.index}}</td>
								<td>{{cel.carNo}}</td>
								<td>{{cel.feeType}}</td>
								<td>{{cel.itemTypeName}}</td>
								<td>{{cel.itemName}}</td>
								<td>{{cel.num}}</td>
								<td>{{cel.unitPrice}}</td>
								<td>{{cel.itemPrice}}</td>
								<td>{{cel.taxPrice}}</td>
								<td>{{cel.noTaxPrice}}</td>
								<td>{{cel.taxRate}}</td>
								<td>{{cel.settle}}</td>
								<td>{{cel.payMode}}</td>
								<td>{{cel.businessNo}}</td>
								<td>{{cel.pickCustomerName}}</td>
								<td>{{cel.kaiDanPerson}}</td>
								<td>{{cel.diaoDuPerson}}</td>
								<td>{{cel.jiChaPerson}}</td>
							</tr>
							<tr style="height: 60px;padding: 0 0.5px;" v-if="index==dataList.length-1">
								<td>合计</td>
								<td></td>
								<td></td>
								<td></td>
								<td></td>
								<td></td>
								<td></td>
								<td>{{allDayFee}}</td>
								<td>{{(allDayTaxes).toFixed(2)}}</td>
								<td>{{(allDayNoTaxFee).toFixed(2)}}</td>
								<td></td>
								<td></td>
								<td></td>
								<td></td>
								<td></td>
								<td></td>
								<td></td>
								<td></td>
							</tr>
						</table>
						<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: {
						"beginTime": sa.p('beginTime', ''),
						"endTime": sa.p('endTime', ''),
						"feeType": sa.p('feeType', ''),
						"itemTypeName": sa.p('itemTypeName', ''),
						"ids": sa.p('ids', '')
					},
					dataList: [],
					allDayFee: 0,
					allDayTaxes: 0,
					allDayNoTaxFee: 0
				},
				methods: {
					getDataList() {
						sa.ajax('/TbFeeDetails/prePrint', this.p, function(resp) {
							let data = resp.data;
							this.allDayFee = data.allDayFee;
							this.allDayTaxes = data.allDayTaxes;
							this.allDayNoTaxFee = data.allDayNoTaxFee;
							var list = data.list;
							let len = list.length;
							let child = [];
							let dataList = [];
							for (i = 0; i < len; i++) {
								let item = list[i];
								child.push(item);
								if(child.length == 11&&dataList.length==0){
									let title = {
										time: this.p.ids ? "勾选打印" : this.p.beginTime ? this.p.beginTime +
											'至' + this.p.endTime : '所有时间',
										list: child
									}
									dataList.push(title);
									child = [];
								}
								if (child.length == 12 || i == len - 1) {
									let title = {
										time: this.p.ids ? "勾选打印" : this.p.beginTime ? this.p.beginTime +
											'至' + this.p.endTime : '所有时间',
										list: child
									}
									dataList.push(title);
									child = [];
								}
							}
							this.dataList = dataList;
							sa.loading("准备打印...");
							setTimeout(() => {
								this.printFn();
								sa.hideLoading();
							}, 2000)
						}.bind(this))
					},
					printFn() {
						Print('#myPrintArea', {
							noPrint: '.noPrint'
						});
					}
				},
				mounted() {
					this.getDataList();
				}
			})
		</script>


	</body>
</html>