import rules from "./rules" ; import Component from "./component" ; import errorMessage from "./error-message" ; import defaultErrorMessageTemplate from "./error-message-template" ; import { VueConstructor } from "vue" ; import { PropOptions } from "vue/types/options" ; import { RuleGetter , ErrorMessageTemplate } from "./types" ; export interface VerifyRulePropOptions extends PropOptions { name : string ; } let ElFormItemComponent ; function addRule ( name , getter ) { if ( ! ElFormItemComponent ) throw Error ( "please install me" ) ; const props = { } ; if ( typeof name === "string" ) props [ name ] = { } ; else props [ name . name ] = name ; const _name = typeof name === "string" ? name : name . name ; const component = { props } ; component . watch = { } ; component . watch [ _name ] = function ( ) { if ( this . verify !== undefined && ( this as any ) . prop ) ( this as any ) . validate ( "" ) ; } ; ElFormItemComponent . mixin ( component ) ; return rules ( _name , getter ) ; } function getRule ( name ) { return rules ( name ) ; } function getErrorMessage ( name , templateData ? ) { return errorMessage . get ( name , templateData ) ; } function init ( ) { const transform = ( value ) => Number ( value ) ; addRule ( { name : "length" , type : Number } , length => ( { len : length , message : getErrorMessage ( "length" , length ) } ) ) ; addRule ( { name : "minLength" , type : Number } , minLength => ( { min : minLength , message : getErrorMessage ( "minLength" , minLength ) } ) ) ; addRule ( "number" , ( ) => ( { validator ( rule , val , callback ) { if ( /^([-+])?\d+(\.\d+)?$/ . test ( val ) ) callback ( ) ; else callback ( Error ( getErrorMessage ( "number" ) ) ) ; } } ) ) ; addRule ( { name : "gt" , type : Number } , gt => [ getRule ( "number" ) ( ) , { validator ( rule , val , callback ) { if ( val > gt ) callback ( ) ; else callback ( Error ( getErrorMessage ( "gt" , gt ) ) ) ; } } ] ) ; addRule ( { name : "gte" , type : Number } , gte => [ getRule ( "number" ) ( ) , { type : "number" , min : gte , transform , message : getErrorMessage ( "gte" , gte ) } ] ) ; addRule ( { name : "lt" , type : Number } , lt => [ getRule ( "number" ) ( ) , { validator ( rule , val , callback ) { if ( val < lt ) callback ( ) ; else callback ( Error ( getErrorMessage ( "lt" , lt ) ) ) ; } } ] ) ; addRule ( { name : "lte" , type : Number } , lte => [ getRule ( "number" ) ( ) , { type : "number" , max : lte , transform , message : getErrorMessage ( "lte" , lte ) } ] ) ; addRule ( "int" , ( ) => [ getRule ( "number" ) ( ) , { type : "integer" , transform , message : getErrorMessage ( "int" ) } ] ) ; addRule ( { name : "maxDecimalLength" , type : Number } , maxDecimalLength => [ getRule ( "number" ) ( ) , { validator ( rule , val , callback ) { const decimal = val . toString ( ) . split ( "." ) [ 1 ] ; if ( decimal && decimal . length > maxDecimalLength ) callback ( Error ( getErrorMessage ( "maxDecimalLength" , maxDecimalLength ) ) ) ; else callback ( ) ; } } ] ) ; addRule ( "phone" , ( ) => ( { pattern : /^(?=\d{11}$)^1(?:3\d|4[57]|5[^4\D]|6[67]|7[^249\D]|8\d|9[189])\d{8}$/ , message : getErrorMessage ( "phone" ) } ) ) ; addRule ( "email" , ( ) => ( { type : "email" , message : getErrorMessage ( "email" ) } ) ) ; addRule ( "verifyCode" , ( ) => ( { pattern : /^\d{6}$/ , message : getErrorMessage ( "verifyCode" ) } ) ) ; } function install ( Vue , options = { } ) { ElFormItemComponent = Vue . component ( "ElFormItem" ) ; if ( ! ElFormItemComponent ) throw Error ( "please install element-ui first" ) ; errorMessage . setTemplate ( options . errorMessageTemplate || defaultErrorMessageTemplate ) ; Component . fieldChange = options . fieldChange || "verify" ; ElFormItemComponent . mixin ( Component ) ; init ( ) ; } export default { install , addRule , getRule , getErrorMessage } ;