feat(projects): 添加常用组件、composables函数

This commit is contained in:
Soybean
2021-12-12 17:28:39 +08:00
parent e755caabf2
commit 230a50a4cf
87 changed files with 5424 additions and 2071 deletions

1
src/utils/form/index.ts Normal file
View File

@ -0,0 +1 @@
export * from './rule';

73
src/utils/form/rule.ts Normal file
View File

@ -0,0 +1,73 @@
import { Ref } from 'vue';
import type { FormItemRule } from 'naive-ui';
import { REGEXP_PHONE, REGEXP_PWD, REGEXP_CODE, REGEXP_EMAIL } from '@/config';
/** 表单规则 */
interface CustomFormRules {
/** 手机号码 */
phone: FormItemRule[];
/** 密码 */
pwd: FormItemRule[];
/** 验证码 */
code: FormItemRule[];
/** 邮箱 */
email: FormItemRule[];
}
/** 表单规则 */
export const formRules: CustomFormRules = {
phone: [
{ required: true, message: '请输入手机号码' },
{ pattern: REGEXP_PHONE, message: '手机号码格式错误', trigger: 'input' }
],
pwd: [
{ required: true, message: '请输入密码' },
{ pattern: REGEXP_PWD, message: '密码为8-18位数字/字符/符号至少2种组合', trigger: 'input' }
],
code: [
{ required: true, message: '请输入验证码' },
{ pattern: REGEXP_CODE, message: '验证码格式错误', trigger: 'input' }
],
email: [{ pattern: REGEXP_EMAIL, message: '邮箱格式错误', trigger: 'blur' }]
};
/** 是否为空字符串 */
function isBlankString(str: string) {
return str.trim() === '';
}
/** 获取确认密码的表单规则 */
export function getConfirmPwdRule(pwd: Ref<string>) {
const confirmPwdRule: FormItemRule[] = [
{ required: true, message: '请输入确认密码' },
{
validator: (rule, value) => {
if (!isBlankString(value) && value !== pwd.value) {
return Promise.reject(rule.message);
}
return Promise.resolve();
},
message: '输入的值与密码不一致',
trigger: 'input'
}
];
return confirmPwdRule;
}
/** 获取图片验证码的表单规则 */
export function getImgCodeRule(imgCode: Ref<string>) {
const imgCodeRule: FormItemRule[] = [
{ required: true, message: '请输入验证码' },
{
validator: (rule, value) => {
if (!isBlankString(value) && value !== imgCode.value) {
return Promise.reject(rule.message);
}
return Promise.resolve();
},
message: '验证码不正确',
trigger: 'blur'
}
];
return imgCodeRule;
}