Browse Source

添加手机号验证

木星 2 months ago
parent
commit
926fca535d
2 changed files with 20 additions and 5 deletions
  1. 12 1
      src/hooks/web/useValidator.ts
  2. 8 4
      src/views/Authority/User.vue

+ 12 - 1
src/hooks/web/useValidator.ts

@@ -35,6 +35,16 @@ export const useValidator = () => {
35
     }
35
     }
36
   }
36
   }
37
 
37
 
38
+  // 验证手机号码
39
+  const validateMobile = (val: string, callback: Callback, message: string) => {
40
+    const mobilePattern = /^1[3-9]\d{9}$/
41
+    if (!mobilePattern.test(val)) {
42
+      callback(new Error(message))
43
+    } else {
44
+      callback()
45
+    }
46
+  }
47
+
38
   const notSpace = (val: any, callback: Callback, message: string) => {
48
   const notSpace = (val: any, callback: Callback, message: string) => {
39
     // 用户名不能有空格
49
     // 用户名不能有空格
40
     if (val.indexOf(' ') !== -1) {
50
     if (val.indexOf(' ') !== -1) {
@@ -86,6 +96,7 @@ export const useValidator = () => {
86
     notSpace,
96
     notSpace,
87
     notSpecialCharacters,
97
     notSpecialCharacters,
88
     onlyEnglish,
98
     onlyEnglish,
89
-    noSpaceOrSpecialChars
99
+    noSpaceOrSpecialChars,
100
+    validateMobile
90
   }
101
   }
91
 }
102
 }

+ 8 - 4
src/views/Authority/User.vue

@@ -30,10 +30,9 @@ import { Form, FormSchema, RadioOption } from '@/components/Form'
30
 import { useForm } from '@/hooks/web/useForm'
30
 import { useForm } from '@/hooks/web/useForm'
31
 import { useValidator } from '@/hooks/web/useValidator'
31
 import { useValidator } from '@/hooks/web/useValidator'
32
 import { BaseButton } from '@/components/Button'
32
 import { BaseButton } from '@/components/Button'
33
-import { Search, Edit, Delete } from '@element-plus/icons-vue'
34
 import { getRsaKey } from '@/api/login'
33
 import { getRsaKey } from '@/api/login'
35
 import { cloneDeep } from 'lodash-es'
34
 import { cloneDeep } from 'lodash-es'
36
-const { required, noSpaceOrSpecialChars } = useValidator()
35
+const { required, noSpaceOrSpecialChars, validateMobile } = useValidator()
37
 
36
 
38
 defineOptions({
37
 defineOptions({
39
   name: 'TemplateManage'
38
   name: 'TemplateManage'
@@ -47,6 +46,11 @@ const rules = reactive<{
47
       validator: (rule, value, callback) =>
46
       validator: (rule, value, callback) =>
48
         noSpaceOrSpecialChars(value, callback, '不包含中文、空格、特殊字符')
47
         noSpaceOrSpecialChars(value, callback, '不包含中文、空格、特殊字符')
49
     }
48
     }
49
+  ],
50
+  userCode: [
51
+    {
52
+      validator: (rule, value, callback) => validateMobile(value, callback, '请输入正确手机号')
53
+    }
50
   ]
54
   ]
51
 })
55
 })
52
 
56
 
@@ -317,7 +321,7 @@ const editUser = async (data) => {
317
         style: {
321
         style: {
318
           width: '100%'
322
           width: '100%'
319
         },
323
         },
320
-        placeholder: '请输入8位数字',
324
+        placeholder: '请输入电话号码',
321
         disabled: isedit.value === '添加用户' ? false : true
325
         disabled: isedit.value === '添加用户' ? false : true
322
       },
326
       },
323
       formItemProps: {
327
       formItemProps: {
@@ -517,7 +521,7 @@ const tianjia = async () => {
517
         style: {
521
         style: {
518
           width: '100%'
522
           width: '100%'
519
         },
523
         },
520
-        placeholder: '请输入8位数字',
524
+        placeholder: '请输入电话号码',
521
         disabled: isedit.value === '添加用户' ? false : true
525
         disabled: isedit.value === '添加用户' ? false : true
522
       },
526
       },
523
       formItemProps: {
527
       formItemProps: {