Skip to content

bdc / bdcdj-web

Go to a project
Toggle navigation
Toggle navigation pinning
43ac953b by 任超
Options

style:表单验证

1 parent 8d9c9b03
Inline Side-by-side
Showing 2 changed files with 32 additions and 8 deletions
...@@ -16,7 +16,8 @@ export default { ...@@ -16,7 +16,8 @@ export default {
16 sqrxm: '', 16 sqrxm: '',
17 sqrzjlxbm: '', 17 sqrzjlxbm: '',
18 sqrzjhm: '', 18 sqrzjhm: '',
19 lxdh: '' 19 lxdh: '',
20 inputErr: false
20 }] 21 }]
21 } 22 }
22 }, 23 },
...@@ -91,9 +92,16 @@ export default { ...@@ -91,9 +92,16 @@ export default {
91 label: '联系电话', 92 label: '联系电话',
92 render: (h, scope) => { 93 render: (h, scope) => {
93 return ( 94 return (
94 <el-input placeholder="联系电话" value={scope.row[scope.column.property]} 95 <div class='typePhone'>
95 onInput={(val) => { scope.row[scope.column.property] = val }} type='tel' maxlength='11' 96 <el-input placeholder="联系电话" value={scope.row[scope.column.property]}
96 ></el-input> 97 onInput={(val) => { scope.row[scope.column.property] = val }}
98 onBlur={(val) => { this.teltest(scope.row) }}
99 type='tel' maxlength='11'
100 ></el-input>
101 <span v-show={scope.row.inputErr} style={{
102 fontSize: '12px', color: 'red', position: 'absolute', bottom: '-2px', left: '0'
103 }}>请输入正确手机号</span>
104 </div>
97 ) 105 )
98 } 106 }
99 } 107 }
...@@ -115,6 +123,7 @@ export default { ...@@ -115,6 +123,7 @@ export default {
115 dataList: { 123 dataList: {
116 handler (newValue, oldName) { 124 handler (newValue, oldName) {
117 this.tableData.data = _.cloneDeep(newValue) 125 this.tableData.data = _.cloneDeep(newValue)
126 console.log(this.tableData.data, 'this.tableData.datathis.tableData.data');
118 }, 127 },
119 deep: true, 128 deep: true,
120 immediate: true 129 immediate: true
...@@ -126,15 +135,29 @@ export default { ...@@ -126,15 +135,29 @@ export default {
126 sqrxm: '', 135 sqrxm: '',
127 sqrzjlxbm: '', 136 sqrzjlxbm: '',
128 sqrzjhm: '', 137 sqrzjhm: '',
129 lxdh: '' 138 lxdh: '',
139 inputErr: false
130 }) 140 })
131 }, 141 },
132 handleMinus (index, row) { 142 handleMinus (index, row) {
133 this.tableData.data.splice(index, 1) 143 this.tableData.data.splice(index, 1)
134 }, 144 },
135 }, 145 teltest (row) {
146 const reg = /^1([38]\d|5[0-35-9]|7[3678])\d{8}$/;
147 if (row.lxdh == '' || row.lxdh.length <= 10 || !reg.test(row.lxdh)) {
148 row.inputErr = true
149 return false
150
151 } else {
152 row.inputErr = false
153 return true
154 }
155 }
156 }
136 } 157 }
137 </script> 158 </script>
138 <style scoped lang='scss'> 159 <style scoped lang='scss'>
139 160 /deep/.el-table__cell {
161 padding: 12px 0;
162 }
140 </style> 163 </style>
...\ No newline at end of file ...\ No newline at end of file
......
...@@ -65,7 +65,8 @@ export default { ...@@ -65,7 +65,8 @@ export default {
65 sqrxm: '', 65 sqrxm: '',
66 sqrzjlxbm: '', 66 sqrzjlxbm: '',
67 sqrzjhm: '', 67 sqrzjhm: '',
68 lxdh: '' 68 lxdh: '',
69 inputErr: false
69 }], 70 }],
70 sqdataList: [], 71 sqdataList: [],
71 qldataList: [], 72 qldataList: [],
......