权利人必填项控制
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