11b11b27 by 蔡俊立
2 parents d6245f35 e332135c
1 <template> 1 <template>
2 <div class="szxx"> 2 <div class="szxx">
3 <el-card class="box-card" v-for="(item,index) in tableData" :key="index"> 3 <el-card class="box-card" v-for="(item,index) in tableData" :key="index">
4 <div slot="header" class="szxx_header"> 4 <div slot="header" class="szxx_header">
5 <span class="header_type">{{item.bdcqzlx == 1 ? '不动产权证书' : '不动产登记证明'}}</span> 5 <span class="header_type">{{item.bdcqzlx == 1 ? '不动产权证书' : '不动产登记证明'}}</span>
6 <div class="header_text">{{item.bdcqzh}}</div> 6 <div class="header_text">{{item.bdcqzh}}</div>
7 </div> 7 </div>
8 <div class="szxx_body card_padding"> 8 <div class="szxx_body card_padding">
9 <div class="text color_iray"> 9 <div class="text color_iray">
10 <span>{{item.qllxmc}}</span> 10 <span>{{item.qllxmc}}</span>
11 </div> 11 </div>
12 <div class="text color_red"> 12 <div class="text color_red">
13 <span>{{item.qlr}}</span> 13 <span>{{item.qlr}}</span>
14 </div> 14 </div>
...@@ -28,13 +28,13 @@ ...@@ -28,13 +28,13 @@
28 <span>{{item.syqx}}</span> 28 <span>{{item.syqx}}</span>
29 </div> 29 </div>
30 <div v-if="item.ysxlh"> 30 <div v-if="item.ysxlh">
31 <div class="top_line middle_margin"></div> 31 <div class="top_line middle_margin"></div>
32 <div class="text color_iray"> 32 <div class="text color_iray">
33 <span>印刷序列号:{{item.ysxlh}}</span> 33 <span>印刷序列号:{{item.ysxlh}}</span>
34 </div> 34 </div>
35 </div> 35 </div>
36 </div> 36 </div>
37 <div class="card_padding"> 37 <div class="card_padding">
38 <div class="top_line middle_margin"></div> 38 <div class="top_line middle_margin"></div>
39 <div class="text" v-if="item.bsmSz"> 39 <div class="text" v-if="item.bsmSz">
40 <el-button class="operation_button" type="text" @click="openZsylDialog(item,1)">证书预览</el-button> 40 <el-button class="operation_button" type="text" @click="openZsylDialog(item,1)">证书预览</el-button>
...@@ -43,28 +43,28 @@ ...@@ -43,28 +43,28 @@
43 <div class="text" v-else> 43 <div class="text" v-else>
44 <el-button class="operation_button" type="text" @click="openZsylDialog(item,2)">证书打印(0)</el-button> 44 <el-button class="operation_button" type="text" @click="openZsylDialog(item,2)">证书打印(0)</el-button>
45 </div> 45 </div>
46 </div>
47 </el-card>
48 <el-dialog title="证书打印" :visible.sync="invalidDiglog" width="30%" :modal-append-to-body='false' top='30vh'>
49 <div class="invalid-diglog">
50 <div class="invalid-title">
51 <i class="el-icon-question invalid-icon"></i>
52 <div class="invalid-body">您确定作废证书并再次打印?</div>
53 </div>
54 <div class="invalid-reson">作废原因:</div>
55 <el-input v-model="zfyy" placeholder="请输入作废原因" type="textarea" :rows="4"></el-input>
56 <div class="dialog-footer">
57 <el-button @click="closeInvalidDiglog()">取 消</el-button>
58 <el-button type="primary" @click="confirmInvalid()">确 定</el-button>
59 </div> 46 </div>
60 </div> 47 </el-card>
61 </el-dialog> 48 <el-dialog title="证书打印" :visible.sync="invalidDiglog" width="30%" :modal-append-to-body='false' top='30vh'>
62 <zsylDialog ref="zsylDialog" v-model="zsylFlag" :value='zsylFlag'/> 49 <div class="invalid-diglog">
63 </div> 50 <div class="invalid-title">
51 <i class="el-icon-question invalid-icon"></i>
52 <div class="invalid-body">您确定作废证书并再次打印?</div>
53 </div>
54 <div class="invalid-reson">作废原因:</div>
55 <el-input v-model="zfyy" placeholder="请输入作废原因" type="textarea" :rows="4"></el-input>
56 <div class="dialog-footer">
57 <el-button @click="closeInvalidDiglog()">取 消</el-button>
58 <el-button type="primary" @click="confirmInvalid()">确 定</el-button>
59 </div>
60 </div>
61 </el-dialog>
62 <zsylDialog ref="zsylDialog" v-model="zsylFlag" :value='zsylFlag' />
63 </div>
64 </template> 64 </template>
65 <script> 65 <script>
66 import zsylDialog from "./zsyl"; 66 import zsylDialog from "./zsyl";
67 import { getBdcqzList,invalidCertificate } from "@/api/fqsq.js"; 67 import { getBdcqzList, invalidCertificate } from "@/api/fqsq.js";
68 68
69 export default { 69 export default {
70 components: { zsylDialog }, 70 components: { zsylDialog },
...@@ -93,8 +93,8 @@ export default { ...@@ -93,8 +93,8 @@ export default {
93 getBdcqzList({bsmSldy:bsmSldy}).then(res => { 93 getBdcqzList({bsmSldy:bsmSldy}).then(res => {
94 if (res.code === 200) { 94 if (res.code === 200) {
95 this.tableData = res.result 95 this.tableData = res.result
96 if(res.result){ 96 if (res.result) {
97 this.bdcqz = res.result[0] 97 this.bdcqz = res.result[0]
98 } 98 }
99 } 99 }
100 }) 100 })
...@@ -111,124 +111,143 @@ export default { ...@@ -111,124 +111,143 @@ export default {
111 } 111 }
112 }, 112 },
113 //再次打印 113 //再次打印
114 openInvalidDiglog(item){ 114 openInvalidDiglog (item) {
115 this.bsmSz = item.bsmSz; 115 this.bsmSz = item.bsmSz;
116 this.invalidDiglog = true 116 this.invalidDiglog = true
117 }, 117 },
118 closeInvalidDiglog(){ 118 closeInvalidDiglog () {
119 this.invalidDiglog = false 119 this.invalidDiglog = false
120 this.bsmSz = ''; 120 this.bsmSz = '';
121 this.zfyy = ''; 121 this.zfyy = '';
122 }, 122 },
123 //作废缮证信息 123 //作废缮证信息
124 confirmInvalid(){ 124 confirmInvalid () {
125 invalidCertificate({"bsmSz":this.bsmSz,"zfyy": this.zfyy}).then(res => { 125 invalidCertificate({ "bsmSz": this.bsmSz, "zfyy": this.zfyy }).then(res => {
126 if (res.code === 200) { 126 if (res.code === 200) {
127 this.list(); 127 this.list();
128 this.$message.success('作废成功'); 128 this.$message.success('作废成功');
129 this.invalidDiglog = false; 129 this.invalidDiglog = false;
130 this.openZsylDialog(this.bdcqz); 130 this.openZsylDialog(this.bdcqz);
131 }else{ 131 } else {
132 this.$message.error(res.message); 132 this.$message.error(res.message);
133 } 133 }
134 }) 134 })
135 } 135 }
136 } 136 }
137 }; 137 };
138 </script> 138 </script>
139 <style scoped lang='scss'> 139 <style scoped lang='scss'>
140 @import "~@/styles/public.scss"; 140 @import "~@/styles/public.scss";
141
141 .szxx { 142 .szxx {
142 box-sizing: border-box; 143 box-sizing: border-box;
143 padding-right: 15px; 144 padding-right: 15px;
144 width: 100%; 145 width: 100%;
145 height: 600px; 146 height: 600px;
146 overflow-y: scroll; 147 overflow-y: scroll;
147 .box-card { 148
148 float: left; 149 .box-card {
149 width: 330px; 150 float: left;
150 margin-top: 20px; 151 width: 330px;
151 margin-right: 20px; 152 margin-top: 20px;
152 height: 440px; 153 margin-right: 20px;
153 .szxx_body { 154 height: 440px;
154 height: 240px; 155
155 } 156 .szxx_body {
156 } 157 height: 240px;
158 }
159 }
157 } 160 }
158 161
159 .szxx_header { 162 .szxx_header {
160 color:white; 163 color: white;
161 font-weight:bolder; 164 font-weight: bolder;
162 font-size: 18px; 165 font-size: 18px;
163 .header_type{ 166
167 .header_type {
164 display: flex; 168 display: flex;
165 justify-content: center; 169 justify-content: center;
166 align-content: center; 170 align-content: center;
167 } 171 }
168 .header_text{ 172
173 .header_text {
169 text-align: center; 174 text-align: center;
170 margin-top:10px; 175 margin-top: 10px;
171 height: 50px; 176 height: 50px;
172 line-height: 30px; 177 line-height: 30px;
173 } 178 }
174 } 179 }
180
175 .top_line { 181 .top_line {
176 border-top: 2px solid rgb(222,222,222); 182 border-top: 2px solid rgb(222, 222, 222);
177 } 183 }
184
178 .text { 185 .text {
179 margin-bottom: 10px; 186 margin-bottom: 10px;
180 text-align: center; 187 text-align: center;
181 } 188 }
189
182 .color_iray { 190 .color_iray {
183 color: rgb(153,153,153); 191 color: rgb(153, 153, 153);
184 } 192 }
193
185 .color_red { 194 .color_red {
186 color: rgb(255,89,24); 195 color: rgb(255, 89, 24);
187 } 196 }
197
188 .middle_margin { 198 .middle_margin {
189 margin-bottom: 10px; 199 margin-bottom: 10px;
190 } 200 }
201
191 .operation_button { 202 .operation_button {
192 border: 1px solid rgb(0, 121, 254); 203 border: 1px solid rgb(0, 121, 254);
193 padding: 15px 10px; 204 padding: 15px 10px;
194 text-align: center; 205 text-align: center;
195 width: 100px; 206 width: 100px;
196 } 207 }
208
197 .card_padding { 209 .card_padding {
198 padding-top:20px 210 padding-top: 20px
199 } 211 }
212
200 .invalid-diglog { 213 .invalid-diglog {
201 padding-bottom: 20px; 214 padding-bottom: 20px;
202 font-size: 16px; 215 font-size: 16px;
203 font-weight: bold; 216 font-weight: bold;
204 color: rgb(99, 99, 99); 217 color: rgb(99, 99, 99);
218
205 .invalid-title { 219 .invalid-title {
206 display: flex; 220 display: flex;
207 align-content: center; 221 align-content: center;
208 .invalid-icon{ 222
209 color:rgb(254,148,0); 223 .invalid-icon {
224 color: rgb(254, 148, 0);
210 font-size: 34px; 225 font-size: 34px;
211 margin-right: 10px; 226 margin-right: 10px;
212 } 227 }
213 .invalid-body{ 228
229 .invalid-body {
214 line-height: 40px; 230 line-height: 40px;
215 margin-bottom: 10px; 231 margin-bottom: 10px;
216 } 232 }
217 } 233 }
234
218 .invalid-reson { 235 .invalid-reson {
219 margin-bottom: 10px; 236 margin-bottom: 10px;
220 } 237 }
221 .dialog-footer{ 238
239 .dialog-footer {
222 margin-top: 10px; 240 margin-top: 10px;
223 display: flex; 241 display: flex;
224 justify-content: end; 242 justify-content: flex-end;
225 } 243 }
226 } 244 }
227 245
228 /deep/.el-card__header{ 246 /deep/.el-card__header {
229 background-color: rgb(198,67,83); 247 background-color: rgb(198, 67, 83);
230 } 248 }
231 /deep/.el-card__body{ 249
250 /deep/.el-card__body {
232 padding: 0px 251 padding: 0px
233 } 252 }
234 </style> 253 </style>
...\ No newline at end of file ...\ No newline at end of file
......
...@@ -344,8 +344,6 @@ export default { ...@@ -344,8 +344,6 @@ export default {
344 li:hover { 344 li:hover {
345 border: 1px solid #ffffff; 345 border: 1px solid #ffffff;
346 border-radius: 5px; 346 border-radius: 5px;
347 //color: $light-blue ;
348
349 .svg-icon { 347 .svg-icon {
350 //color: $light-blue ; 348 //color: $light-blue ;
351 } 349 }
......