权利人必填项控制
Showing
1 changed file
with
90 additions
and
8 deletions
| ... | @@ -75,11 +75,11 @@ | ... | @@ -75,11 +75,11 @@ |
| 75 | <tr> | 75 | <tr> |
| 76 | <td colspan="4" class="tdright"><i class="requisite">*</i>权利人名称</td> | 76 | <td colspan="4" class="tdright"><i class="requisite">*</i>权利人名称</td> |
| 77 | <td colspan="6"> | 77 | <td colspan="6"> |
| 78 | <input type="text" class="formInput" v-model="formData.qlrmc" /> | 78 | <input type="text" class="formInput" v-model="formData.qlrmc" ref="qlrmc" @blur="inputBlur($event)"/> |
| 79 | </td> | 79 | </td> |
| 80 | <td colspan="4" class="tdright"><i class="requisite">*</i>权利人类型</td> | 80 | <td colspan="4" class="tdright"><i class="requisite">*</i>权利人类型</td> |
| 81 | <td colspan="6"> | 81 | <td colspan="6"> |
| 82 | <el-select class="formSelect" v-model="formData.qlrlxbsm"> | 82 | <el-select class="formSelect" v-model="formData.qlrlxbsm" ref="qlrlxbsm" @blur="inputBlur($event)"> |
| 83 | <el-option | 83 | <el-option |
| 84 | v-for="item in $store.state.qlrlxList" | 84 | v-for="item in $store.state.qlrlxList" |
| 85 | :key="item.bsm" | 85 | :key="item.bsm" |
| ... | @@ -93,7 +93,7 @@ | ... | @@ -93,7 +93,7 @@ |
| 93 | <tr> | 93 | <tr> |
| 94 | <td colspan="4" class="tdright"><i class="requisite">*</i>证件类型</td> | 94 | <td colspan="4" class="tdright"><i class="requisite">*</i>证件类型</td> |
| 95 | <td colspan="6"> | 95 | <td colspan="6"> |
| 96 | <el-select class="formSelect" v-model="formData.zjzlbsm"> | 96 | <el-select class="formSelect" v-model="formData.zjzlbsm" ref="zjzlbsm" @blur="inputBlur($event)"> |
| 97 | <el-option | 97 | <el-option |
| 98 | v-for="item in $store.state.zjzlList" | 98 | v-for="item in $store.state.zjzlList" |
| 99 | :key="item.bsm" | 99 | :key="item.bsm" |
| ... | @@ -105,18 +105,18 @@ | ... | @@ -105,18 +105,18 @@ |
| 105 | </td> | 105 | </td> |
| 106 | <td colspan="4" class="tdright"><i class="requisite">*</i>证件号</td> | 106 | <td colspan="4" class="tdright"><i class="requisite">*</i>证件号</td> |
| 107 | <td colspan="6"> | 107 | <td colspan="6"> |
| 108 | <input type="text" class="formInput" maxlength="18" v-model="formData.zjh" /> | 108 | <input type="text" class="formInput" maxlength="18" v-model="formData.zjh" ref="zjh" @blur="inputBlur($event)"/> |
| 109 | </td> | 109 | </td> |
| 110 | </tr> | 110 | </tr> |
| 111 | <tr> | 111 | <tr> |
| 112 | <td colspan="4" class="tdright"><i class="requisite">*</i>电话</td> | 112 | <td colspan="4" class="tdright"><i class="requisite">*</i>电话</td> |
| 113 | <td colspan="6"> | 113 | <td colspan="6"> |
| 114 | <!-- @blur="inputBlur($event)"--> | 114 | <!-- @blur="inputBlur($event)"--> |
| 115 | <input type="text" class="formInput" v-model="formData.dh" /> | 115 | <input type="text" class="formInput" v-model="formData.dh" ref="dh" @blur="inputBlur($event)"/> |
| 116 | </td> | 116 | </td> |
| 117 | <td colspan="4" class="tdright"><i class="requisite">*</i>地址</td> | 117 | <td colspan="4" class="tdright"><i class="requisite">*</i>地址</td> |
| 118 | <td colspan="6"> | 118 | <td colspan="6"> |
| 119 | <input type="text" class="formInput" v-model="formData.dz" /> | 119 | <input type="text" class="formInput" v-model="formData.dz" ref="dz" @blur="inputBlur($event)"/> |
| 120 | </td> | 120 | </td> |
| 121 | </tr> | 121 | </tr> |
| 122 | <tr> | 122 | <tr> |
| ... | @@ -384,9 +384,21 @@ | ... | @@ -384,9 +384,21 @@ |
| 384 | zjzlbsm: "", | 384 | zjzlbsm: "", |
| 385 | }, | 385 | }, |
| 386 | glbsm:'', | 386 | glbsm:'', |
| 387 | |||
| 388 | rules:[], | ||
| 387 | }; | 389 | }; |
| 388 | }, | 390 | }, |
| 389 | methods: { | 391 | methods: { |
| 392 | |||
| 393 | inputBlur(e){ | ||
| 394 | if(e.target.value!=''){ | ||
| 395 | e.target.style.border="" | ||
| 396 | }else{ | ||
| 397 | e.target.style.border="1px solid red"; | ||
| 398 | e.target.style.boxSizing = 'border-box'; | ||
| 399 | } | ||
| 400 | }, | ||
| 401 | |||
| 390 | //新增行数据 | 402 | //新增行数据 |
| 391 | addRow() { | 403 | addRow() { |
| 392 | this.update=false; | 404 | this.update=false; |
| ... | @@ -414,6 +426,61 @@ | ... | @@ -414,6 +426,61 @@ |
| 414 | }, | 426 | }, |
| 415 | //确认权利人信息按钮;可以进行新增;可以进行更新; | 427 | //确认权利人信息按钮;可以进行新增;可以进行更新; |
| 416 | addNewQlrInfo(){ | 428 | addNewQlrInfo(){ |
| 429 | |||
| 430 | this.rules=[ | ||
| 431 | { | ||
| 432 | data:this.formData.qlrmc, | ||
| 433 | name:'权利人名称', | ||
| 434 | dom:this.$refs.qlrmc, | ||
| 435 | rule: /^\s*$/g, //非空 | ||
| 436 | }, | ||
| 437 | { | ||
| 438 | data:this.formData.qlrlxbsm, | ||
| 439 | name:'权利人类型', | ||
| 440 | dom:this.$refs.qlrlxbsm, | ||
| 441 | rule: /^\s*$/g, //非空 | ||
| 442 | }, | ||
| 443 | { | ||
| 444 | data:this.formData.zjzlbsm, | ||
| 445 | name:'证件类型', | ||
| 446 | dom:this.$refs.zjzlbsm, | ||
| 447 | rule: /^\s*$/g, //非空 | ||
| 448 | }, | ||
| 449 | { | ||
| 450 | data:this.formData.zjh, | ||
| 451 | name:'证件号', | ||
| 452 | dom:this.$refs.zjh, | ||
| 453 | rule: /^\s*$/g, //非空 | ||
| 454 | }, | ||
| 455 | { | ||
| 456 | data:this.formData.dh, | ||
| 457 | name:'电话', | ||
| 458 | dom:this.$refs.dh, | ||
| 459 | rule: /^\s*$/g, //非空 | ||
| 460 | }, | ||
| 461 | { | ||
| 462 | data:this.formData.dz, | ||
| 463 | name:'地址', | ||
| 464 | dom:this.$refs.dz, | ||
| 465 | rule: /^\s*$/g, //非空 | ||
| 466 | }, | ||
| 467 | ] | ||
| 468 | let flag = true; | ||
| 469 | this.rules.forEach(item=>{ | ||
| 470 | if(item.rule.test(item.data) || item.data == null){ | ||
| 471 | if(item.dom.$el){ | ||
| 472 | item.dom.$el.style.border = '1px solid red'; | ||
| 473 | item.dom.$el.style.boxSizing = 'border-box'; | ||
| 474 | }else{ | ||
| 475 | item.dom.style.border = '1px solid red'; | ||
| 476 | item.dom.style.boxSizing = 'border-box'; | ||
| 477 | } | ||
| 478 | flag = false; | ||
| 479 | return false | ||
| 480 | } | ||
| 481 | }) | ||
| 482 | this.$nextTick(()=>{ | ||
| 483 | if (flag) { | ||
| 417 | //todo 权利人页面调整 | 484 | //todo 权利人页面调整 |
| 418 | this.formData.addQjDlrFrRequest=[]; | 485 | this.formData.addQjDlrFrRequest=[]; |
| 419 | this.formData.glbsm=this.bsm; | 486 | this.formData.glbsm=this.bsm; |
| ... | @@ -447,6 +514,9 @@ | ... | @@ -447,6 +514,9 @@ |
| 447 | } | 514 | } |
| 448 | }) | 515 | }) |
| 449 | } | 516 | } |
| 517 | } | ||
| 518 | }) | ||
| 519 | |||
| 450 | 520 | ||
| 451 | }, | 521 | }, |
| 452 | //修改行数据 | 522 | //修改行数据 |
| ... | @@ -623,12 +693,24 @@ | ... | @@ -623,12 +693,24 @@ |
| 623 | this.gyfsList[i].disabled = item.mc === "单独所有"; | 693 | this.gyfsList[i].disabled = item.mc === "单独所有"; |
| 624 | } | 694 | } |
| 625 | } | 695 | } |
| 626 | console.log(this.tableData.length+":this.tableData[0].length"); | ||
| 627 | if(this.tableData.length>1){ | 696 | if(this.tableData.length>1){ |
| 628 | console.log(JSON.stringify(this.tableData[0])+":this.tableData[0].length"); | ||
| 629 | this.gyfs = this.tableData[0].gyfsbsm | 697 | this.gyfs = this.tableData[0].gyfsbsm |
| 630 | } | 698 | } |
| 631 | }, | 699 | }, |
| 700 | |||
| 701 | "formData.qlrlxbsm":function (val) { | ||
| 702 | console.log(this.$refs.qlrlxbsm.$el.style.border+":console.log(this.$refs.qlrlxbsm.$el.style.border)") | ||
| 703 | if (val != '') { | ||
| 704 | console.log(this.$refs.qlrlxbsm.$el.style.border+":console.log(this.$refs.qlrlxbsm.$el.style.border)") | ||
| 705 | this.$refs.qlrlxbsm.$el.style.border = ''; | ||
| 706 | } | ||
| 707 | }, | ||
| 708 | |||
| 709 | "formData.zjzlbsm":function (val) { | ||
| 710 | if (val != '') { | ||
| 711 | this.$refs.zjzlbsm.$el.style.border = ''; | ||
| 712 | } | ||
| 713 | }, | ||
| 632 | } | 714 | } |
| 633 | }; | 715 | }; |
| 634 | </script> | 716 | </script> | ... | ... |
-
Please register or sign in to post a comment