<template>
	<div id="printDiv">
		<div class="title">杭州市财政局公务用车申请表</div>
		<table>
			<tr style="height: 70px;">
				<td>处室</td>
				<td colspan="3"> {{data.dept}}</td>

			</tr>
			<tr class="textArea">
				<td>申请<br />事由</td>
				<td colspan="3">
					{{data.reason}}
					<span>处室领导签名：{{data.leadName}}</span>
				</td>
			</tr>
			<tr>
				<td>候车地</td>
				<td>{{data.source}}</td>
				<td>用车<br />开始时间</td>
				<td>{{data.startDate}}</td>
			</tr>
			<tr>
				<td>目的地</td>
				<td>{{data.target}}</td>
				<td>用车<br />结束时间</td>
				<td>{{data.endDate}}</td>
			</tr>
			<tr>
				<td>随车<br />人数</td>
				<td>{{data.num}}</td>
				<td>车辆类型</td>
				<td>{{data.type}}</td>
			</tr>
			<tr>
				<td>办公室<br />意见</td>
				<td>{{data.officeAd}}</td>
				<td>局领导<br />意见</td>
				<td>{{data.leadAd}}</td>
			</tr>
			<tr>
				<td>备注</td>
				<td style="border-right:none ;border-left: none;">联系人：{{data.contactor}}</td>
				<td colspan="2" style="border-left: none;text-align: left;">联系电话：{{data.tel}}</td>
			</tr>
		</table>
	</div>
</template>
<script>
	export default {
		name: "DocerPaper",
		props: ["data", "setting"],
		mounted() {
			var page = document.getElementById("__page__");
			if (page) {
			  page.innerHTML = [
			    "@page {",
			    "  size: A4 portrait;",
			    "  margin: 10mm;",
			    "}",
			  ].join("\n");
			}

		}
	};
</script>

<style scoped>
	html,
	body {
	  width: 210mm;
	  height: 297mm;
	  margin: 0;
	  padding: 0;
	}
	#printDiv {
		width: 200mm;
		margin: 0;
		padding:0;
		font-size: 10pt;
		line-height: 1.5em;
		display: block;
		font-family: "黑体";
		padding-top: 10mm;
	}

	table {
		width: 100%;
		border: 1px solid black;
		border-collapse: collapse;
	}

	td {
		text-align: left;
		border: 1px solid black;
		padding: 8px;
		font-size: 10.5pt;
		vertical-align: middle;
	}

	td:nth-child(odd) {
		width: 44pt;
		text-align: center;
	}

	td:nth-child(even) {
		width: 40%;
	}

	.title {
		font-size: 22pt;
		text-align: center;
		margin-bottom: 10mm;
		/* font-family: 'FanSong'; */
	}

	.textArea :nth-child(even) {
		position: relative;
	}

	.textArea :nth-child(even) span {
		position: absolute;
		bottom: 5mm;
		right: 20mm;
	}

	.textArea td {
		height: 100mm;
		vertical-align: top;
	}

	.textArea :nth-child(odd) {
		vertical-align: middle;
	}
</style>

export default {
  name: "demo-print",
  'maui-render'(ctx) {
    console.info(ctx)
  },
  ppts:{
    'docPaper': ()=> import(/* webpackChunkName: "demo-print" */'./printsheets/DocPaper.vue')
  },
  navs: [],
  apis: {},
  dependencies: []
}

this.$print(‘docPaper’,{a:1})
this.$print(‘docPaper’,{a:1},'ld-test')

// 模型定义规范与Vue组件定义相同
{
  props:['data','setting'],
  data(){
    return {
      // 此处定义模型变量
      
    }
  },
  mounted() {

	}
}

// 模型定义规范与Vue组件定义相同
{
  data(){
    return {
      // 此处定义模型变量
      name: '',
      age: 18
      
    }
  },
  methods:{
    handlePrint(){
      let data = {
        name: this.name,
        age: this.age
      }
      this.$print('printsheet',data)
   }
 }
}