778b4e44 by zhaoqian

权利人必填项控制

1 parent a60277d2
...@@ -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>
......