8be093a0 by 蔡俊立

打印申请书

1 parent 52efb35f
<template>
<div class="zdxx" id="printMe">
<div class="tablebox">
<div class="print-title">不动产登记申请书</div>
<div>
<div id="printMe" style="width: 100%;height: 100%;background-color: #f5f5f5;padding: 5px;">
<div style="overflow-x: auto;width: 100%;height: 100%;background: #fff;text-align: center;padding: 4px;overflow-y: scroll;">
<div style="font-size: 24px;font-weight: bolder;margin: 20px 0px;">不动产登记申请书</div>
<div style="display:flex">
<div>
<table cellpadding="0" cellspacing="0" class="printTable">
<col width="60" />
<col width="80" />
<col width="200" />
<col width="100" />
<table cellpadding="0" cellspacing="0" style="width: 100%;color: #333;">
<col width="30" />
<col width="50" />
<col width="160" />
<col width="50" />
<col width="120" />
<tr>
<td rowspan="2">收件</td>
<td>编号</td>
<td>1111</td>
<td rowspan="2">收件人</td>
<td rowspan="2">123</td>
<td rowspan="2" style="border: 1px solid rgb(194, 191, 191);line-height: 30px;padding: 0 4px;">收件</td>
<td style="border: 1px solid rgb(194, 191, 191);line-height: 30px;padding: 0 4px;">编号</td>
<td style="border: 1px solid rgb(194, 191, 191);line-height: 30px;padding: 0 4px;">1111</td>
<td rowspan="2" style="border: 1px solid rgb(194, 191, 191);line-height: 30px;padding: 0 4px;">收件人</td>
<td rowspan="2" style="border: 1px solid rgb(194, 191, 191);line-height: 30px;padding: 0 4px;">123</td>
</tr>
<tr>
<td>日期</td>
<td></td>
<td style="border: 1px solid rgb(194, 191, 191);line-height: 30px;padding: 0 4px;">日期</td>
<td style="border: 1px solid rgb(194, 191, 191);line-height: 30px;padding: 0 4px;"></td>
</tr>
</table>
</div>
<div class="print-unit">
<div style="margin-left: 20px;font-size: 14px;">
单位:
<i class="el-icon-check" style="color:red;font-size:16px"></i>平方米
<span class="check-box"></span>公顷(<span class="check-box"></span>亩)、万元
<span style="font-family:Wingdings;font-size:18px;color:red">&#254;</span>平方米
<!-- <span style="font-family:Wingdings;font-size:40px;">&#250;</span> -->
<span style="display: inline-block;border: 1px solid rgb(114, 113, 113);border-radius: 2px;box-sizing: border-box;width: 10px;height: 10px;margin-left:10px"></span>
公顷(<span style="display: inline-block;border: 1px solid rgb(114, 113, 113);border-radius: 2px;box-sizing: border-box;width: 10px;height: 10px;"></span>亩)、万元
</div>
</div>
<div style="margin-top:20px"></div>
<table cellpadding="0" cellspacing="0" class="printTable">
<table cellpadding="0" cellspacing="0" style="width: 100%;color: #333;">
<col width="80" />
<col width="140" />
<col width="200" />
<col width="100" />
<col width="180" />
<col width="80" />
<col width="60" />
<col width="20" />
<col width="200" />
<col width="180" />
<tr>
<td rowspan="2" class="left-title">申请登记事由</td>
<td colspan="6" class="text-left">
<td rowspan="2" style="border: 1px solid rgb(194, 191, 191);line-height: 30px;padding: 0 4px;font-size: 16px">申请登记事由</td>
<td colspan="6" style="border: 1px solid rgb(194, 191, 191);line-height: 30px;padding: 0 4px;text-align: left;">
<span v-for="item in ywlxList" :key="item.value" style="margin:0px 8px">
<i class="el-icon-check" style="color:red;font-size:16px" v-if="item.checked"></i>
<span class="check-box" v-else></span>
<span style="font-family:Wingdings;font-size:18px;color:red" v-if="item.checked">&#254;</span>
<span style="display: inline-block;border: 1px solid rgb(114, 113, 113);border-radius: 2px;box-sizing: border-box;width: 10px;height: 10px;" v-else></span>
{{item.name}}
</span>
</td>
</tr>
<tr>
<td colspan="6" class="text-left">
<td colspan="6" style="border: 1px solid rgb(194, 191, 191);line-height: 30px;padding: 0 4px;text-align: left;">
<span v-for="item in djlxList" :key="item.value" style="margin:0px 8px">
<i class="el-icon-check" style="color:red;font-size:16px" v-if="item.checked"></i>
<span class="check-box" v-else></span>
<span style="font-family:Wingdings;font-size:18px;color:red" v-if="item.checked">&#254;</span>
<span class="check-box" style="display: inline-block;border: 1px solid rgb(114, 113, 113);border-radius: 2px;box-sizing: border-box;width: 10px;height: 10px;" v-else></span>
{{item.name}}
</span>
</td>
</tr>
<tr>
<td rowspan="14" class="left-title">申请人情况</td>
<td colspan="6" class="inline-title">登记申请人</td>
<td rowspan="14" style="border: 1px solid rgb(194, 191, 191);line-height: 30px;padding: 0 4px;font-size: 16px">申请人情况</td>
<td colspan="6" style="border: 1px solid rgb(194, 191, 191);line-height: 30px;padding: 0 4px;font-size:16px;font-weight: bolder;text-align: center;">登记申请人</td>
</tr>
<tr>
<td>权利人姓名(名称)</td>
<td colspan="5">张三</td>
<td style="border: 1px solid rgb(194, 191, 191);line-height: 30px;padding: 0 4px;">权利人姓名(名称)</td>
<td colspan="5" style="border: 1px solid rgb(194, 191, 191);line-height: 30px;padding: 0 4px;">张三</td>
</tr>
<tr>
<td>身份证件种类</td>
<td>身份证</td>
<td>证件号</td>
<td colspan="3">3438475835XXXXXXX</td>
<td style="border: 1px solid rgb(194, 191, 191);line-height: 30px;padding: 0 4px;">身份证件种类</td>
<td style="border: 1px solid rgb(194, 191, 191);line-height: 30px;padding: 0 4px;">身份证</td>
<td style="border: 1px solid rgb(194, 191, 191);line-height: 30px;padding: 0 4px;">证件号</td>
<td colspan="3" style="border: 1px solid rgb(194, 191, 191);line-height: 30px;padding: 0 4px;">3438475835XXXXXXX</td>
</tr>
<tr>
<td>通讯地址</td>
<td colspan="2">山西省系撒大大</td>
<td colspan="1">邮编</td>
<td colspan="2">A700001</td>
<td style="border: 1px solid rgb(194, 191, 191);line-height: 30px;padding: 0 4px;">通讯地址</td>
<td colspan="2" style="border: 1px solid rgb(194, 191, 191);line-height: 30px;padding: 0 4px;">山西省系撒大大</td>
<td colspan="1" style="border: 1px solid rgb(194, 191, 191);line-height: 30px;padding: 0 4px;">邮编</td>
<td colspan="2" style="border: 1px solid rgb(194, 191, 191);line-height: 30px;padding: 0 4px;">A700001</td>
</tr>
<tr>
<td>法定代表人或负责人</td>
<td>张三</td>
<td>联系电话</td>
<td colspan="3">134548543</td>
<td style="border: 1px solid rgb(194, 191, 191);line-height: 30px;padding: 0 4px;">法定代表人或负责人</td>
<td style="border: 1px solid rgb(194, 191, 191);line-height: 30px;padding: 0 4px;">张三</td>
<td style="border: 1px solid rgb(194, 191, 191);line-height: 30px;padding: 0 4px;">联系电话</td>
<td colspan="3" style="border: 1px solid rgb(194, 191, 191);line-height: 30px;padding: 0 4px;">134548543</td>
</tr>
<tr>
<td>代理人姓名</td>
<td>里斯</td>
<td>联系电话</td>
<td colspan="3">134548543</td>
<td style="border: 1px solid rgb(194, 191, 191);line-height: 30px;padding: 0 4px;">代理人姓名</td>
<td style="border: 1px solid rgb(194, 191, 191);line-height: 30px;padding: 0 4px;">里斯</td>
<td style="border: 1px solid rgb(194, 191, 191);line-height: 30px;padding: 0 4px;">联系电话</td>
<td colspan="3" style="border: 1px solid rgb(194, 191, 191);line-height: 30px;padding: 0 4px;">134548543</td>
</tr>
<tr>
<td>代理机构名称</td>
<td colspan="5">buzhdiao</td>
<td style="border: 1px solid rgb(194, 191, 191);line-height: 30px;padding: 0 4px;">代理机构名称</td>
<td colspan="5" style="border: 1px solid rgb(194, 191, 191);line-height: 30px;padding: 0 4px;">buzhdiao</td>
</tr>
<tr>
<td colspan="7" class="inline-title">登记申请人</td>
<td colspan="7" style="border: 1px solid rgb(194, 191, 191);line-height: 30px;padding: 0 4px;font-size:16px;font-weight: bolder;text-align: center;">登记申请人</td>
</tr>
<tr>
<td>义务人姓名(名称)</td>
<td colspan="5">张三</td>
<td style="border: 1px solid rgb(194, 191, 191);line-height: 30px;padding: 0 4px;">义务人姓名(名称)</td>
<td colspan="5" style="border: 1px solid rgb(194, 191, 191);line-height: 30px;padding: 0 4px;">张三</td>
</tr>
<tr>
<td>身份证件种类</td>
<td>身份证</td>
<td>证件号</td>
<td colspan="3">3438475835XXXXXXX</td>
<td style="border: 1px solid rgb(194, 191, 191);line-height: 30px;padding: 0 4px;">身份证件种类</td>
<td style="border: 1px solid rgb(194, 191, 191);line-height: 30px;padding: 0 4px;">身份证</td>
<td style="border: 1px solid rgb(194, 191, 191);line-height: 30px;padding: 0 4px;">证件号</td>
<td colspan="3" style="border: 1px solid rgb(194, 191, 191);line-height: 30px;padding: 0 4px;">3438475835XXXXXXX</td>
</tr>
<tr>
<td>通讯地址</td>
<td colspan="2">山西省系撒大大</td>
<td colspan="1">邮编</td>
<td colspan="2">A700001</td>
<td style="border: 1px solid rgb(194, 191, 191);line-height: 30px;padding: 0 4px;">通讯地址</td>
<td colspan="2" style="border: 1px solid rgb(194, 191, 191);line-height: 30px;padding: 0 4px;">山西省系撒大大</td>
<td colspan="1" style="border: 1px solid rgb(194, 191, 191);line-height: 30px;padding: 0 4px;">邮编</td>
<td colspan="2" style="border: 1px solid rgb(194, 191, 191);line-height: 30px;padding: 0 4px;">A700001</td>
</tr>
<tr>
<td>法定代表人或负责人</td>
<td>张三</td>
<td>联系电话</td>
<td colspan="3">134548543</td>
<td style="border: 1px solid rgb(194, 191, 191);line-height: 30px;padding: 0 4px;">法定代表人或负责人</td>
<td style="border: 1px solid rgb(194, 191, 191);line-height: 30px;padding: 0 4px;">张三</td>
<td style="border: 1px solid rgb(194, 191, 191);line-height: 30px;padding: 0 4px;">联系电话</td>
<td colspan="3" style="border: 1px solid rgb(194, 191, 191);line-height: 30px;padding: 0 4px;">134548543</td>
</tr>
<tr>
<td>代理人姓名</td>
<td>里斯</td>
<td>联系电话</td>
<td colspan="3">134548543</td>
<td style="border: 1px solid rgb(194, 191, 191);line-height: 30px;padding: 0 4px;">代理人姓名</td>
<td style="border: 1px solid rgb(194, 191, 191);line-height: 30px;padding: 0 4px;">里斯</td>
<td style="border: 1px solid rgb(194, 191, 191);line-height: 30px;padding: 0 4px;">联系电话</td>
<td colspan="3" style="border: 1px solid rgb(194, 191, 191);line-height: 30px;padding: 0 4px;">134548543</td>
</tr>
<tr>
<td>代理机构名称</td>
<td colspan="5">buzhdiao</td>
<td style="border: 1px solid rgb(194, 191, 191);line-height: 30px;padding: 0 4px;">代理机构名称</td>
<td colspan="5" style="border: 1px solid rgb(194, 191, 191);line-height: 30px;padding: 0 4px;">buzhdiao</td>
</tr>
<tr>
<td rowspan="6" class="left-title">不动产情况</td>
<td rowspan="6" style="border: 1px solid rgb(194, 191, 191);line-height: 30px;padding: 0 4px;font-size: 16px">不动产情况</td>
</tr>
<tr>
<td>坐落</td>
<td colspan="5">buzhdixxxxo</td>
<td style="border: 1px solid rgb(194, 191, 191);line-height: 30px;padding: 0 4px;">坐落</td>
<td colspan="5" style="border: 1px solid rgb(194, 191, 191);line-height: 30px;padding: 0 4px;">buzhdixxxxo</td>
</tr>
<tr>
<td>不动产单元号</td>
<td>000001号</td>
<td>不动产类型</td>
<td colspan="3">房屋</td>
<td style="border: 1px solid rgb(194, 191, 191);line-height: 30px;padding: 0 4px;">不动产单元号</td>
<td style="border: 1px solid rgb(194, 191, 191);line-height: 30px;padding: 0 4px;">000001号</td>
<td style="border: 1px solid rgb(194, 191, 191);line-height: 30px;padding: 0 4px;">不动产类型</td>
<td colspan="3" style="border: 1px solid rgb(194, 191, 191);line-height: 30px;padding: 0 4px;">房屋</td>
</tr>
<tr>
<td>面积</td>
<td>111.3㎡</td>
<td>用途</td>
<td colspan="3">城镇住宅用地</td>
<td style="border: 1px solid rgb(194, 191, 191);line-height: 30px;padding: 0 4px;">面积</td>
<td style="border: 1px solid rgb(194, 191, 191);line-height: 30px;padding: 0 4px;">111.3㎡</td>
<td style="border: 1px solid rgb(194, 191, 191);line-height: 30px;padding: 0 4px;">用途</td>
<td colspan="3" style="border: 1px solid rgb(194, 191, 191);line-height: 30px;padding: 0 4px;">城镇住宅用地</td>
</tr>
<tr>
<td>原不动产权属证书号</td>
<td>xxxx号</td>
<td>用海类型</td>
<td colspan="3"></td>
<td style="border: 1px solid rgb(194, 191, 191);line-height: 30px;padding: 0 4px;">原不动产权属证书号</td>
<td style="border: 1px solid rgb(194, 191, 191);line-height: 30px;padding: 0 4px;">xxxx号</td>
<td style="border: 1px solid rgb(194, 191, 191);line-height: 30px;padding: 0 4px;">用海类型</td>
<td colspan="3" style="border: 1px solid rgb(194, 191, 191);line-height: 30px;padding: 0 4px;"></td>
</tr>
<tr>
<td>构筑物类型</td>
<td></td>
<td>林种</td>
<td colspan="3"></td>
<td style="border: 1px solid rgb(194, 191, 191);line-height: 30px;padding: 0 4px;">构筑物类型</td>
<td style="border: 1px solid rgb(194, 191, 191);line-height: 30px;padding: 0 4px;"></td>
<td style="border: 1px solid rgb(194, 191, 191);line-height: 30px;padding: 0 4px;">林种</td>
<td colspan="3" style="border: 1px solid rgb(194, 191, 191);line-height: 30px;padding: 0 4px;"></td>
</tr>
<tr>
<td class="left-title">抵押情况</td>
<td>被担保债权数额(最高债权数额)</td>
<td></td>
<td colspan="2">债务履行期限(债权确定期间)</td>
<td colspan="2"></td>
<td style="border: 1px solid rgb(194, 191, 191);line-height: 30px;padding: 0 4px;font-size: 16px">抵押情况</td>
<td style="border: 1px solid rgb(194, 191, 191);line-height: 30px;padding: 0 4px;">被担保债权数额(最高债权数额)</td>
<td style="border: 1px solid rgb(194, 191, 191);line-height: 30px;padding: 0 4px;"></td>
<td colspan="2" style="border: 1px solid rgb(194, 191, 191);line-height: 30px;padding: 0 4px;">债务履行期限(债权确定期间)</td>
<td colspan="2" style="border: 1px solid rgb(194, 191, 191);line-height: 30px;padding: 0 4px;"></td>
</tr>
</table>
<button type="primary" @click="test()"> test</button>
</div>
<button @click="printView()"> 打印预览 </button>
</div>
</div>
</template>
<script>
import { mapGetters } from 'vuex';
import { getLodop } from "@/utils/LodopFuncs";
export default {
......@@ -203,13 +208,13 @@ export default {
}
},
methods: {
test(){
printView(){
let lodop = getLodop();
lodop.PRINT_INIT("测试");
lodop.ADD_PRINT_HTM(88,200,350,600,document.getElementById("printMe").innerHTML);
//纵坐标开始点位,横坐标开始点位,纸张宽度,纸张高度
lodop.ADD_PRINT_HTM(0,10,760,1200,document.getElementById("printMe").innerHTML);
lodop.PREVIEW();
}
},
}
}
</script>
......@@ -296,10 +301,6 @@ export default {
width: 745px;
overflow: auto;
}
.test {
}
table {
.bhqkTh {
width: 110px;
......