71b6754f by 蔡俊立

打印申请书

1 parent 795f3fa0
1 <template>
2 <div class="zdxx" id="printMe">
3 <div class="tablebox">
4 <div class="print-title">不动产登记申请书</div>
5 <div style="display:flex">
6 <div>
7 <table cellpadding="0" cellspacing="0" class="printTable">
8 <col width="60" />
9 <col width="80" />
10 <col width="200" />
11 <col width="100" />
12 <col width="160" />
13 <tr>
14 <td rowspan="2">收件</td>
15 <td>编号</td>
16 <td>1111</td>
17 <td rowspan="2">收件人</td>
18 <td rowspan="2">123</td>
19 </tr>
20 <tr>
21 <td>日期</td>
22 <td></td>
23 </tr>
24 </table>
25 </div>
26 <div class="print-unit">
27 单位:
28 <i class="el-icon-check" style="color:red;font-size:16px"></i>平方米
29 <span class="check-box"></span>公顷(<span class="check-box"></span>亩)、万元
30 </div>
31 </div>
32 <div style="margin-top:20px"></div>
33 <table cellpadding="0" cellspacing="0" class="printTable">
34 <col width="80" />
35 <col width="140" />
36 <col width="200" />
37 <col width="80" />
38 <col width="60" />
39 <col width="20" />
40 <col width="200" />
41 <tr>
42 <td rowspan="2" class="left-title">申请登记事由</td>
43 <td colspan="6" class="text-left">
44 <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>
46 <span class="check-box" v-else></span>
47 {{item.name}}
48 </span>
49 </td>
50 </tr>
51 <tr>
52 <td colspan="6" class="text-left">
53 <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>
55 <span class="check-box" v-else></span>
56 {{item.name}}
57 </span>
58 </td>
59 </tr>
60 <tr>
61 <td rowspan="14" class="left-title">申请人情况</td>
62 <td colspan="6" class="inline-title">登记申请人</td>
63 </tr>
64 <tr>
65 <td>权利人姓名(名称)</td>
66 <td colspan="5">张三</td>
67 </tr>
68 <tr>
69 <td>身份证件种类</td>
70 <td>身份证</td>
71 <td>证件号</td>
72 <td colspan="3">3438475835XXXXXXX</td>
73 </tr>
74 <tr>
75 <td>通讯地址</td>
76 <td colspan="2">山西省系撒大大</td>
77 <td colspan="1">邮编</td>
78 <td colspan="2">A700001</td>
79 </tr>
80 <tr>
81 <td>法定代表人或负责人</td>
82 <td>张三</td>
83 <td>联系电话</td>
84 <td colspan="3">134548543</td>
85 </tr>
86 <tr>
87 <td>代理人姓名</td>
88 <td>里斯</td>
89 <td>联系电话</td>
90 <td colspan="3">134548543</td>
91 </tr>
92 <tr>
93 <td>代理机构名称</td>
94 <td colspan="5">buzhdiao</td>
95 </tr>
96 <tr>
97 <td colspan="7" class="inline-title">登记申请人</td>
98 </tr>
99 <tr>
100 <td>义务人姓名(名称)</td>
101 <td colspan="5">张三</td>
102 </tr>
103 <tr>
104 <td>身份证件种类</td>
105 <td>身份证</td>
106 <td>证件号</td>
107 <td colspan="3">3438475835XXXXXXX</td>
108 </tr>
109 <tr>
110 <td>通讯地址</td>
111 <td colspan="2">山西省系撒大大</td>
112 <td colspan="1">邮编</td>
113 <td colspan="2">A700001</td>
114 </tr>
115 <tr>
116 <td>法定代表人或负责人</td>
117 <td>张三</td>
118 <td>联系电话</td>
119 <td colspan="3">134548543</td>
120 </tr>
121 <tr>
122 <td>代理人姓名</td>
123 <td>里斯</td>
124 <td>联系电话</td>
125 <td colspan="3">134548543</td>
126 </tr>
127 <tr>
128 <td>代理机构名称</td>
129 <td colspan="5">buzhdiao</td>
130 </tr>
131 <tr>
132 <td rowspan="6" class="left-title">不动产情况</td>
133 </tr>
134 <tr>
135 <td>坐落</td>
136 <td colspan="5">buzhdixxxxo</td>
137 </tr>
138 <tr>
139 <td>不动产单元号</td>
140 <td>000001号</td>
141 <td>不动产类型</td>
142 <td colspan="3">房屋</td>
143 </tr>
144 <tr>
145 <td>面积</td>
146 <td>111.3㎡</td>
147 <td>用途</td>
148 <td colspan="3">城镇住宅用地</td>
149 </tr>
150 <tr>
151 <td>原不动产权属证书号</td>
152 <td>xxxx号</td>
153 <td>用海类型</td>
154 <td colspan="3"></td>
155 </tr>
156 <tr>
157 <td>构筑物类型</td>
158 <td></td>
159 <td>林种</td>
160 <td colspan="3"></td>
161 </tr>
162 <tr>
163 <td class="left-title">抵押情况</td>
164 <td>被担保债权数额(最高债权数额)</td>
165 <td></td>
166 <td colspan="2">债务履行期限(债权确定期间)</td>
167 <td colspan="2"></td>
168 </tr>
169 </table>
170 <button type="primary" @click="test()"> test</button>
171 </div>
172 </div>
173 </template>
174 <script>
175 import { mapGetters } from 'vuex';
176 import { getLodop } from "@/utils/LodopFuncs";
177 export default {
178 components: {},
179 computed: {
180 ...mapGetters(['dictData'])
181 },
182 mounted() {
183 console.log(this.dictData['A8']);
184
185 },
186 data () {
187 return {
188 ywlxList: [
189 {name: '国有建设用地使用权',value: 'A03',checked:true},
190 {name: '国有建设用地使用权/房屋所有权',value: 'A04',checked:false},
191 ],
192 djlxList: [
193 {name: '首次登记',value: '100',checked:true},
194 {name: '转移登记',value: '200',checked:false},
195 {name: '变更登记',value: '300',checked:false},
196 {name: '注销登记',value: '400',checked:false},
197 {name: '更正登记',value: '901',checked:false},
198 {name: '异议登记',value: 'B',checked:false},
199 {name: '预告登记',value: '902',checked:false},
200 {name: '查封登记',value: 'B39',checked:false},
201 {name: '其他___________',value: '99',checked:false},
202 ]
203 }
204 },
205 methods: {
206 test(){
207 let lodop = getLodop();
208 lodop.PRINT_INIT("测试");
209 lodop.ADD_PRINT_HTM(88,200,350,600,document.getElementById("printMe").innerHTML);
210 lodop.PREVIEW();
211 }
212
213 }
214 }
215 </script>
216 <style scoped lang='scss'>
217 .zdxx {
218 width: 100%;
219 height: 100%;
220 background-color: #f5f5f5;
221 padding: 5px;
222 }
223
224 .print-title{
225 font-size: 24px;
226 font-weight: bolder;
227 margin: 20px 0px;
228 }
229
230 .print-unit{
231 line-height: 60px;
232 margin-left: 20px;
233 font-size: 14px;
234 }
235
236 .left-title{
237 font-size: 16px
238 }
239
240 .inline-title{
241 font-size:16px;
242 font-weight: bolder;
243 }
244
245 .text-left {
246 text-align: left;
247 }
248
249 .check-box {
250 display: inline-block;
251 border: 1px solid rgb(114, 113, 113);
252 border-radius: 2px;
253 box-sizing: border-box;
254 width: 10px;
255 height: 10px;
256 }
257
258
259 .tablebox {
260 overflow-x: auto;
261 width: 100%;
262 height: 100%;
263 background: #fff;
264 text-align: center;
265 padding: 4px;
266 overflow-y: scroll;
267
268 .printTable {
269 width: 100%;
270 color: #333;
271
272 td {
273 border: 1px solid rgb(194, 191, 191);
274 line-height: 30px;
275 padding: 0 4px;
276 }
277
278 .title {
279 line-height: 68px;
280 font-size: 20px;
281 }
282
283 .unit {
284 text-align: right;
285 }
286
287 .title2 {
288 writing-mode: vertical-lr;
289 letter-spacing: 6px;
290 }
291
292 .bhqk {
293 padding: 0;
294
295 .box {
296 width: 745px;
297 overflow: auto;
298 }
299
300 .test {
301 }
302
303 table {
304 .bhqkTh {
305 width: 110px;
306 line-height: 40px;
307 background-color: #f5f5f5;
308 border: 1px solid rgb(228, 228, 228);
309 font-weight: bold;
310 }
311
312 td {
313 width: 180px;
314 }
315 }
316 }
317 }
318 }
319 </style>
...\ No newline at end of file ...\ No newline at end of file
...@@ -5,7 +5,7 @@ ...@@ -5,7 +5,7 @@
5 <el-tab-pane :label="item.qlr + '(' + item.bdcqzh + ')'" :name="item.bsmBdcqz" v-for="(item,index) in headTabBdcqz" :key="index"></el-tab-pane> 5 <el-tab-pane :label="item.qlr + '(' + item.bdcqzh + ')'" :name="item.bsmBdcqz" v-for="(item,index) in headTabBdcqz" :key="index"></el-tab-pane>
6 </el-tabs> 6 </el-tabs>
7 <!-- <div class="zsyl-title">{{bdcqz.bdcqzlx == '1' ? '不动产权证书' : '不动产权证明'}}</div> --> 7 <!-- <div class="zsyl-title">{{bdcqz.bdcqzlx == '1' ? '不动产权证书' : '不动产权证明'}}</div> -->
8 <img :src="previewImage" :class="imgClass"> 8 <img :src="previewImage" class="imgClass">
9 </div> 9 </div>
10 </template> 10 </template>
11 11
......
...@@ -131,6 +131,9 @@ export default { ...@@ -131,6 +131,9 @@ export default {
131 entryType: '1' 131 entryType: '1'
132 }, '1070px') 132 }, '1070px')
133 break; 133 break;
134 case "B6":
135 popupDialog("打印申请书", "workflow/components/printApplication", {}, '1070px')
136 break;
134 case "B7": 137 case "B7":
135 this.$popup("证书领取", "workflow/components/zslq", { 138 this.$popup("证书领取", "workflow/components/zslq", {
136 formData: { bsmSlsq: this.$route.query.bsmSlsq } 139 formData: { bsmSlsq: this.$route.query.bsmSlsq }
......
...@@ -129,17 +129,17 @@ ...@@ -129,17 +129,17 @@
129 <el-row :gutter="10"> 129 <el-row :gutter="10">
130 <el-col :span="8"> 130 <el-col :span="8">
131 <el-form-item :class="flag ? 'marginBot0' : ''" label="解封机关:" prop="cfdj.jfjg"> 131 <el-form-item :class="flag ? 'marginBot0' : ''" label="解封机关:" prop="cfdj.jfjg">
132 <el-input v-model="ruleForm.cfdj.jfjg" :disabled="$route.query.viewtype || ableEdit"></el-input> 132 <el-input v-model="ruleForm.cfdj.jfjg" :disabled="$route.query.viewtype"></el-input>
133 </el-form-item> 133 </el-form-item>
134 </el-col> 134 </el-col>
135 <el-col :span="8"> 135 <el-col :span="8">
136 <el-form-item :class="flag ? 'marginBot0' : ''" label="解封文件:" prop="cfdj.jfwj"> 136 <el-form-item :class="flag ? 'marginBot0' : ''" label="解封文件:" prop="cfdj.jfwj">
137 <el-input v-model="ruleForm.cfdj.jfwj" :disabled="$route.query.viewtype || ableEdit"></el-input> 137 <el-input v-model="ruleForm.cfdj.jfwj" :disabled="$route.query.viewtype"></el-input>
138 </el-form-item> 138 </el-form-item>
139 </el-col> 139 </el-col>
140 <el-col :span="8"> 140 <el-col :span="8">
141 <el-form-item :class="flag ? 'marginBot0' : ''" label="解封文号:" prop="cfdj.jfwh"> 141 <el-form-item :class="flag ? 'marginBot0' : ''" label="解封文号:" prop="cfdj.jfwh">
142 <el-input v-model="ruleForm.cfdj.jfwh" :disabled="$route.query.viewtype || ableEdit"></el-input> 142 <el-input v-model="ruleForm.cfdj.jfwh" :disabled="$route.query.viewtype"></el-input>
143 </el-form-item> 143 </el-form-item>
144 </el-col> 144 </el-col>
145 </el-row> 145 </el-row>
......