rule.ts 1.2 KB

123456789101112131415161718192021222324252627282930313233343536373839
  1. import { reactive } from "vue";
  2. import type { FormRules } from "element-plus";
  3. import { isPhone, isEmail } from "@pureadmin/utils";
  4. /** 自定义表单规则校验 */
  5. export const formRules = reactive(<FormRules>{
  6. nickname: [{ required: true, message: "用户昵称为必填项", trigger: "blur" }],
  7. username: [{ required: true, message: "用户名称为必填项", trigger: "blur" }],
  8. password: [{ required: true, message: "用户密码为必填项", trigger: "blur" }],
  9. phone: [
  10. {
  11. validator: (rule, value, callback) => {
  12. if (value === "") {
  13. callback();
  14. } else if (!isPhone(value)) {
  15. callback(new Error("请输入正确的手机号码格式"));
  16. } else {
  17. callback();
  18. }
  19. },
  20. trigger: "blur"
  21. // trigger: "click" // 如果想在点击确定按钮时触发这个校验,trigger 设置成 click 即可
  22. }
  23. ],
  24. email: [
  25. {
  26. validator: (rule, value, callback) => {
  27. if (value === "") {
  28. callback();
  29. } else if (!isEmail(value)) {
  30. callback(new Error("请输入正确的邮箱格式"));
  31. } else {
  32. callback();
  33. }
  34. },
  35. trigger: "blur"
  36. }
  37. ]
  38. });