打印申请书
Showing
1 changed file
with
106 additions
and
105 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="100" /> | ||
12 | <col width="160" /> | 11 | <col width="160" /> |
12 | <col width="50" /> | ||
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">þ</span>平方米 |
29 | <span class="check-box"></span>公顷(<span class="check-box"></span>亩)、万元 | 30 | <!-- <span style="font-family:Wingdings;font-size:40px;">ú</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">þ</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">þ</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> | 173 | </div> |
174 | <button @click="printView()"> 打印预览 </button> | ||
171 | </div> | 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,13 +208,13 @@ export default { | ... | @@ -203,13 +208,13 @@ 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> |
... | @@ -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; | ... | ... |
-
Please register or sign in to post a comment