Skip to content

bdc / bdcdj-web

Go to a project
Toggle navigation
Toggle navigation pinning
8be093a0 by 蔡俊立
Options

打印申请书

1 parent 52efb35f
Inline Side-by-side
Showing 1 changed file with 108 additions and 107 deletions
1 <template> 1 <template>
2 <div class="zdxx" id="printMe"> 2 <div>
3 <div class="tablebox"> 3 <div id="printMe" style="width: 100%;height: 100%;background-color: #f5f5f5;padding: 5px;">
4 <div class="print-title">不动产登记申请书</div> 4 <div style="overflow-x: auto;width: 100%;height: 100%;background: #fff;text-align: center;padding: 4px;overflow-y: scroll;">
5 <div style="font-size: 24px;font-weight: bolder;margin: 20px 0px;">不动产登记申请书</div>
5 <div style="display:flex"> 6 <div style="display:flex">
6 <div> 7 <div>
7 <table cellpadding="0" cellspacing="0" class="printTable"> 8 <table cellpadding="0" cellspacing="0" style="width: 100%;color: #333;">
8 <col width="60" /> 9 <col width="30" />
9 <col width="80" /> 10 <col width="50" />
10 <col width="200" /> 11 <col width="160" />
11 <col width="100" /> 12 <col width="50" />
12 <col width="160" /> 13 <col width="120" />
13 <tr> 14 <tr>
14 <td rowspan="2">收件</td> 15 <td rowspan="2" style="border: 1px solid rgb(194, 191, 191);line-height: 30px;padding: 0 4px;">收件</td>
15 <td>编号</td> 16 <td style="border: 1px solid rgb(194, 191, 191);line-height: 30px;padding: 0 4px;">编号</td>
16 <td>1111</td> 17 <td style="border: 1px solid rgb(194, 191, 191);line-height: 30px;padding: 0 4px;">1111</td>
17 <td rowspan="2">收件人</td> 18 <td rowspan="2" style="border: 1px solid rgb(194, 191, 191);line-height: 30px;padding: 0 4px;">收件人</td>
18 <td rowspan="2">123</td> 19 <td rowspan="2" style="border: 1px solid rgb(194, 191, 191);line-height: 30px;padding: 0 4px;">123</td>
19 </tr> 20 </tr>
20 <tr> 21 <tr>
21 <td>日期</td> 22 <td style="border: 1px solid rgb(194, 191, 191);line-height: 30px;padding: 0 4px;">日期</td>
22 <td></td> 23 <td style="border: 1px solid rgb(194, 191, 191);line-height: 30px;padding: 0 4px;"></td>
23 </tr> 24 </tr>
24 </table> 25 </table>
25 </div> 26 </div>
26 <div class="print-unit"> 27 <div style="margin-left: 20px;font-size: 14px;">
27 单位： 28 单位：
28 <i class="el-icon-check" style="color:red;font-size:16px"></i>平方米 29 <span style="font-family:Wingdings;font-size:18px;color:red">&#254;</span>平方米
29 <span class="check-box"></span>公顷（<span class="check-box"></span>亩）、万元 30 <!-- <span style="font-family:Wingdings;font-size:40px;">&#250;</span> -->
31 <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>
32 公顷（<span style="display: inline-block;border: 1px solid rgb(114, 113, 113);border-radius: 2px;box-sizing: border-box;width: 10px;height: 10px;"></span>亩）、万元
30 </div> 33 </div>
31 </div> 34 </div>
32 <div style="margin-top:20px"></div> 35 <div style="margin-top:20px"></div>
33 <table cellpadding="0" cellspacing="0" class="printTable"> 36 <table cellpadding="0" cellspacing="0" style="width: 100%;color: #333;">
34 <col width="80" /> 37 <col width="80" />
35 <col width="140" /> 38 <col width="100" />
36 <col width="200" /> 39 <col width="180" />
37 <col width="80" /> 40 <col width="80" />
38 <col width="60" /> 41 <col width="60" />
39 <col width="20" /> 42 <col width="20" />
40 <col width="200" /> 43 <col width="180" />
41 <tr> 44 <tr>
42 <td rowspan="2" class="left-title">申请登记事由</td> 45 <td rowspan="2" style="border: 1px solid rgb(194, 191, 191);line-height: 30px;padding: 0 4px;font-size: 16px">申请登记事由</td>
43 <td colspan="6" class="text-left"> 46 <td colspan="6" style="border: 1px solid rgb(194, 191, 191);line-height: 30px;padding: 0 4px;text-align: left;">
44 <span v-for="item in ywlxList" :key="item.value" style="margin:0px 8px"> 47 <span v-for="item in ywlxList" :key="item.value" style="margin:0px 8px">
45 <i class="el-icon-check" style="color:red;font-size:16px" v-if="item.checked"></i> 48 <span style="font-family:Wingdings;font-size:18px;color:red" v-if="item.checked">&#254;</span>
46 <span class="check-box" v-else></span> 49 <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>
47 {{item.name}} 50 {{item.name}}
48 </span> 51 </span>
49 </td> 52 </td>
50 </tr> 53 </tr>
51 <tr> 54 <tr>
52 <td colspan="6" class="text-left"> 55 <td colspan="6" style="border: 1px solid rgb(194, 191, 191);line-height: 30px;padding: 0 4px;text-align: left;">
53 <span v-for="item in djlxList" :key="item.value" style="margin:0px 8px"> 56 <span v-for="item in djlxList" :key="item.value" style="margin:0px 8px">
54 <i class="el-icon-check" style="color:red;font-size:16px" v-if="item.checked"></i> 57 <span style="font-family:Wingdings;font-size:18px;color:red" v-if="item.checked">&#254;</span>
55 <span class="check-box" v-else></span> 58 <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>
56 {{item.name}} 59 {{item.name}}
57 </span> 60 </span>
58 </td> 61 </td>
59 </tr> 62 </tr>
60 <tr> 63 <tr>
61 <td rowspan="14" class="left-title">申请人情况</td> 64 <td rowspan="14" style="border: 1px solid rgb(194, 191, 191);line-height: 30px;padding: 0 4px;font-size: 16px">申请人情况</td>
62 <td colspan="6" class="inline-title">登记申请人</td> 65 <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>
63 </tr> 66 </tr>
64 <tr> 67 <tr>
65 <td>权利人姓名（名称）</td> 68 <td style="border: 1px solid rgb(194, 191, 191);line-height: 30px;padding: 0 4px;">权利人姓名（名称）</td>
66 <td colspan="5">张三</td> 69 <td colspan="5" style="border: 1px solid rgb(194, 191, 191);line-height: 30px;padding: 0 4px;">张三</td>
67 </tr> 70 </tr>
68 <tr> 71 <tr>
69 <td>身份证件种类</td> 72 <td style="border: 1px solid rgb(194, 191, 191);line-height: 30px;padding: 0 4px;">身份证件种类</td>
70 <td>身份证</td> 73 <td style="border: 1px solid rgb(194, 191, 191);line-height: 30px;padding: 0 4px;">身份证</td>
71 <td>证件号</td> 74 <td style="border: 1px solid rgb(194, 191, 191);line-height: 30px;padding: 0 4px;">证件号</td>
72 <td colspan="3">3438475835XXXXXXX</td> 75 <td colspan="3" style="border: 1px solid rgb(194, 191, 191);line-height: 30px;padding: 0 4px;">3438475835XXXXXXX</td>
73 </tr> 76 </tr>
74 <tr> 77 <tr>
75 <td>通讯地址</td> 78 <td style="border: 1px solid rgb(194, 191, 191);line-height: 30px;padding: 0 4px;">通讯地址</td>
76 <td colspan="2">山西省系撒大大</td> 79 <td colspan="2" style="border: 1px solid rgb(194, 191, 191);line-height: 30px;padding: 0 4px;">山西省系撒大大</td>
77 <td colspan="1">邮编</td> 80 <td colspan="1" style="border: 1px solid rgb(194, 191, 191);line-height: 30px;padding: 0 4px;">邮编</td>
78 <td colspan="2">A700001</td> 81 <td colspan="2" style="border: 1px solid rgb(194, 191, 191);line-height: 30px;padding: 0 4px;">A700001</td>
79 </tr> 82 </tr>
80 <tr> 83 <tr>
81 <td>法定代表人或负责人</td> 84 <td style="border: 1px solid rgb(194, 191, 191);line-height: 30px;padding: 0 4px;">法定代表人或负责人</td>
82 <td>张三</td> 85 <td style="border: 1px solid rgb(194, 191, 191);line-height: 30px;padding: 0 4px;">张三</td>
83 <td>联系电话</td> 86 <td style="border: 1px solid rgb(194, 191, 191);line-height: 30px;padding: 0 4px;">联系电话</td>
84 <td colspan="3">134548543</td> 87 <td colspan="3" style="border: 1px solid rgb(194, 191, 191);line-height: 30px;padding: 0 4px;">134548543</td>
85 </tr> 88 </tr>
86 <tr> 89 <tr>
87 <td>代理人姓名</td> 90 <td style="border: 1px solid rgb(194, 191, 191);line-height: 30px;padding: 0 4px;">代理人姓名</td>
88 <td>里斯</td> 91 <td style="border: 1px solid rgb(194, 191, 191);line-height: 30px;padding: 0 4px;">里斯</td>
89 <td>联系电话</td> 92 <td style="border: 1px solid rgb(194, 191, 191);line-height: 30px;padding: 0 4px;">联系电话</td>
90 <td colspan="3">134548543</td> 93 <td colspan="3" style="border: 1px solid rgb(194, 191, 191);line-height: 30px;padding: 0 4px;">134548543</td>
91 </tr> 94 </tr>
92 <tr> 95 <tr>
93 <td>代理机构名称</td> 96 <td style="border: 1px solid rgb(194, 191, 191);line-height: 30px;padding: 0 4px;">代理机构名称</td>
94 <td colspan="5">buzhdiao</td> 97 <td colspan="5" style="border: 1px solid rgb(194, 191, 191);line-height: 30px;padding: 0 4px;">buzhdiao</td>
95 </tr> 98 </tr>
96 <tr> 99 <tr>
97 <td colspan="7" class="inline-title">登记申请人</td> 100 <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>
98 </tr> 101 </tr>
99 <tr> 102 <tr>
100 <td>义务人姓名（名称）</td> 103 <td style="border: 1px solid rgb(194, 191, 191);line-height: 30px;padding: 0 4px;">义务人姓名（名称）</td>
101 <td colspan="5">张三</td> 104 <td colspan="5" style="border: 1px solid rgb(194, 191, 191);line-height: 30px;padding: 0 4px;">张三</td>
102 </tr> 105 </tr>
103 <tr> 106 <tr>
104 <td>身份证件种类</td> 107 <td style="border: 1px solid rgb(194, 191, 191);line-height: 30px;padding: 0 4px;">身份证件种类</td>
105 <td>身份证</td> 108 <td style="border: 1px solid rgb(194, 191, 191);line-height: 30px;padding: 0 4px;">身份证</td>
106 <td>证件号</td> 109 <td style="border: 1px solid rgb(194, 191, 191);line-height: 30px;padding: 0 4px;">证件号</td>
107 <td colspan="3">3438475835XXXXXXX</td> 110 <td colspan="3" style="border: 1px solid rgb(194, 191, 191);line-height: 30px;padding: 0 4px;">3438475835XXXXXXX</td>
108 </tr> 111 </tr>
109 <tr> 112 <tr>
110 <td>通讯地址</td> 113 <td style="border: 1px solid rgb(194, 191, 191);line-height: 30px;padding: 0 4px;">通讯地址</td>
111 <td colspan="2">山西省系撒大大</td> 114 <td colspan="2" style="border: 1px solid rgb(194, 191, 191);line-height: 30px;padding: 0 4px;">山西省系撒大大</td>
112 <td colspan="1">邮编</td> 115 <td colspan="1" style="border: 1px solid rgb(194, 191, 191);line-height: 30px;padding: 0 4px;">邮编</td>
113 <td colspan="2">A700001</td> 116 <td colspan="2" style="border: 1px solid rgb(194, 191, 191);line-height: 30px;padding: 0 4px;">A700001</td>
114 </tr> 117 </tr>
115 <tr> 118 <tr>
116 <td>法定代表人或负责人</td> 119 <td style="border: 1px solid rgb(194, 191, 191);line-height: 30px;padding: 0 4px;">法定代表人或负责人</td>
117 <td>张三</td> 120 <td style="border: 1px solid rgb(194, 191, 191);line-height: 30px;padding: 0 4px;">张三</td>
118 <td>联系电话</td> 121 <td style="border: 1px solid rgb(194, 191, 191);line-height: 30px;padding: 0 4px;">联系电话</td>
119 <td colspan="3">134548543</td> 122 <td colspan="3" style="border: 1px solid rgb(194, 191, 191);line-height: 30px;padding: 0 4px;">134548543</td>
120 </tr> 123 </tr>
121 <tr> 124 <tr>
122 <td>代理人姓名</td> 125 <td style="border: 1px solid rgb(194, 191, 191);line-height: 30px;padding: 0 4px;">代理人姓名</td>
123 <td>里斯</td> 126 <td style="border: 1px solid rgb(194, 191, 191);line-height: 30px;padding: 0 4px;">里斯</td>
124 <td>联系电话</td> 127 <td style="border: 1px solid rgb(194, 191, 191);line-height: 30px;padding: 0 4px;">联系电话</td>
125 <td colspan="3">134548543</td> 128 <td colspan="3" style="border: 1px solid rgb(194, 191, 191);line-height: 30px;padding: 0 4px;">134548543</td>
126 </tr> 129 </tr>
127 <tr> 130 <tr>
128 <td>代理机构名称</td> 131 <td style="border: 1px solid rgb(194, 191, 191);line-height: 30px;padding: 0 4px;">代理机构名称</td>
129 <td colspan="5">buzhdiao</td> 132 <td colspan="5" style="border: 1px solid rgb(194, 191, 191);line-height: 30px;padding: 0 4px;">buzhdiao</td>
130 </tr> 133 </tr>
131 <tr> 134 <tr>
132 <td rowspan="6" class="left-title">不动产情况</td> 135 <td rowspan="6" style="border: 1px solid rgb(194, 191, 191);line-height: 30px;padding: 0 4px;font-size: 16px">不动产情况</td>
133 </tr> 136 </tr>
134 <tr> 137 <tr>
135 <td>坐落</td> 138 <td style="border: 1px solid rgb(194, 191, 191);line-height: 30px;padding: 0 4px;">坐落</td>
136 <td colspan="5">buzhdixxxxo</td> 139 <td colspan="5" style="border: 1px solid rgb(194, 191, 191);line-height: 30px;padding: 0 4px;">buzhdixxxxo</td>
137 </tr> 140 </tr>
138 <tr> 141 <tr>
139 <td>不动产单元号</td> 142 <td style="border: 1px solid rgb(194, 191, 191);line-height: 30px;padding: 0 4px;">不动产单元号</td>
140 <td>000001号</td> 143 <td style="border: 1px solid rgb(194, 191, 191);line-height: 30px;padding: 0 4px;">000001号</td>
141 <td>不动产类型</td> 144 <td style="border: 1px solid rgb(194, 191, 191);line-height: 30px;padding: 0 4px;">不动产类型</td>
142 <td colspan="3">房屋</td> 145 <td colspan="3" style="border: 1px solid rgb(194, 191, 191);line-height: 30px;padding: 0 4px;">房屋</td>
143 </tr> 146 </tr>
144 <tr> 147 <tr>
145 <td>面积</td> 148 <td style="border: 1px solid rgb(194, 191, 191);line-height: 30px;padding: 0 4px;">面积</td>
146 <td>111.3㎡</td> 149 <td style="border: 1px solid rgb(194, 191, 191);line-height: 30px;padding: 0 4px;">111.3㎡</td>
147 <td>用途</td> 150 <td style="border: 1px solid rgb(194, 191, 191);line-height: 30px;padding: 0 4px;">用途</td>
148 <td colspan="3">城镇住宅用地</td> 151 <td colspan="3" style="border: 1px solid rgb(194, 191, 191);line-height: 30px;padding: 0 4px;">城镇住宅用地</td>
149 </tr> 152 </tr>
150 <tr> 153 <tr>
151 <td>原不动产权属证书号</td> 154 <td style="border: 1px solid rgb(194, 191, 191);line-height: 30px;padding: 0 4px;">原不动产权属证书号</td>
152 <td>xxxx号</td> 155 <td style="border: 1px solid rgb(194, 191, 191);line-height: 30px;padding: 0 4px;">xxxx号</td>
153 <td>用海类型</td> 156 <td style="border: 1px solid rgb(194, 191, 191);line-height: 30px;padding: 0 4px;">用海类型</td>
154 <td colspan="3"></td> 157 <td colspan="3" style="border: 1px solid rgb(194, 191, 191);line-height: 30px;padding: 0 4px;"></td>
155 </tr> 158 </tr>
156 <tr> 159 <tr>
157 <td>构筑物类型</td> 160 <td style="border: 1px solid rgb(194, 191, 191);line-height: 30px;padding: 0 4px;">构筑物类型</td>
158 <td></td> 161 <td style="border: 1px solid rgb(194, 191, 191);line-height: 30px;padding: 0 4px;"></td>
159 <td>林种</td> 162 <td style="border: 1px solid rgb(194, 191, 191);line-height: 30px;padding: 0 4px;">林种</td>
160 <td colspan="3"></td> 163 <td colspan="3" style="border: 1px solid rgb(194, 191, 191);line-height: 30px;padding: 0 4px;"></td>
161 </tr> 164 </tr>
162 <tr> 165 <tr>
163 <td class="left-title">抵押情况</td> 166 <td style="border: 1px solid rgb(194, 191, 191);line-height: 30px;padding: 0 4px;font-size: 16px">抵押情况</td>
164 <td>被担保债权数额（最高债权数额）</td> 167 <td style="border: 1px solid rgb(194, 191, 191);line-height: 30px;padding: 0 4px;">被担保债权数额（最高债权数额）</td>
165 <td></td> 168 <td style="border: 1px solid rgb(194, 191, 191);line-height: 30px;padding: 0 4px;"></td>
166 <td colspan="2">债务履行期限（债权确定期间）</td> 169 <td colspan="2" style="border: 1px solid rgb(194, 191, 191);line-height: 30px;padding: 0 4px;">债务履行期限（债权确定期间）</td>
167 <td colspan="2"></td> 170 <td colspan="2" style="border: 1px solid rgb(194, 191, 191);line-height: 30px;padding: 0 4px;"></td>
168 </tr> 171 </tr>
169 </table> 172 </table>
170 <button type="primary" @click="test()"> test</button>
171 </div> 173 </div>
174 <button @click="printView()"> 打印预览 </button>
175 </div>
172 </div> 176 </div>
173 </template> 177 </template>
174 <script> 178 <script>
179
175 import { mapGetters } from 'vuex'; 180 import { mapGetters } from 'vuex';
176 import { getLodop } from "@/utils/LodopFuncs"; 181 import { getLodop } from "@/utils/LodopFuncs";
177 export default { 182 export default {
...@@ -203,18 +208,18 @@ export default { ...@@ -203,18 +208,18 @@ export default {
203 } 208 }
204 }, 209 },
205 methods: { 210 methods: {
206 test(){ 211 printView(){
207 let lodop = getLodop(); 212 let lodop = getLodop();
208 lodop.PRINT_INIT("测试"); 213 lodop.PRINT_INIT("测试");
209 lodop.ADD_PRINT_HTM(88,200,350,600,document.getElementById("printMe").innerHTML); 214 //纵坐标开始点位，横坐标开始点位，纸张宽度，纸张高度
215 lodop.ADD_PRINT_HTM(0,10,760,1200,document.getElementById("printMe").innerHTML);
210 lodop.PREVIEW(); 216 lodop.PREVIEW();
211 } 217 },
212
213 } 218 }
214 } 219 }
215 </script> 220 </script>
216 <style scoped lang='scss'> 221 <style scoped lang='scss'>
217 .zdxx { 222 .zdxx {
218 width: 100%; 223 width: 100%;
219 height: 100%; 224 height: 100%;
220 background-color: #f5f5f5; 225 background-color: #f5f5f5;
...@@ -296,10 +301,6 @@ export default { ...@@ -296,10 +301,6 @@ export default {
296 width: 745px; 301 width: 745px;
297 overflow: auto; 302 overflow: auto;
298 } 303 }
299
300 .test {
301 }
302
303 table { 304 table {
304 .bhqkTh { 305 .bhqkTh {
305 width: 110px; 306 width: 110px;
......