/**
* VUE 表单验证插件
* User: liupeilong
* Date: 2019/4/26
* Time: 10:50
*/
var validation = {
install:function(Vue, options){
var validationConfig = {
listenerEvent:"change",
validationMsg:function( context , el = null ){
layer.msg(context);
},
validationLanguage:{
required:"参数不能为空",
email:"邮箱格式不正确",
numeric:"参数值不是数字",
datetime:"参数值只能是时间日期格式",
date:"参数值只能是日期格式",
enumeration:"参数值不在枚举项中",
},
}
var elements = {};
var validationHandle = function(el,binding){
for(index in binding.value){
if( !validationObg[index](binding.value[index],el.value.replace(/(^\s*)|(\s*$)/g,"")) ){
validationConfig.validationMsg(validationConfig.validationLanguage[index]);
return false;
}
}
return true;
}
var validationObg = {
//不能为空
required:function( boolean , value ){
if( boolean == true ){
if( !value || value == undefined ){
return false;
}
}
return true;
}
//是否邮箱
,email:function( binding , str ){
if(str==null||str=="") return false;
var result=str.match(/^\w+([-+.]\w+)*@\w+([-.]\w+)*\.\w+([-.]\w+)*$/);
if(result==null)return false;
return true;
}
//是否是数字
,numeric:function( binding , value ){
var regPos = /^\d+(\.\d+)?$/; //非负浮点数
var regNeg = /^(-(([0-9]+\.[0-9]*[1-9][0-9]*)|([0-9]*[1-9][0-9]*\.[0-9]+)|([0-9]*[1-9][0-9]*)))$/; //负浮点数
if(regPos.test(value) || regNeg.test(value)){
return true;
}
return false;
}
//判断是否是时间日期 2019-04-28 10:12:12
,datetime:function( binding , value ){
var a = /^(\d{4})-(\d{2})-(\d{2}) (\d{2}):(\d{2}):(\d{2})$/
if( !a.test(value) ) {
return false
}
return true
}
//判断是否是日期 2019-04-28
,date:function( binding , value ){
var a = /^(\d{4})-(\d{2})-(\d{2})$/
if( !a.test(value) ) {
return false
}
return true
}
//判断是否是枚举中的值
,enumeration:function( binding , value ){
if( binding.indexOf(value) == -1 ){
return false;
}
return true;
}
}
Vue.directive('validate',function(el, binding, vnode, oldVnode){
elements[el.name] = {el:el,binding:binding,}
el.addEventListener(validationConfig.listenerEvent, function(e){
validationHandle(el,binding);
});
});
Vue.mixin({
created:function(){
},
updated:function(){
}
});
Vue.prototype.$validationCheck = function( input_name ) {
validationHandle(elements[input_name].el,elements[input_name].binding);
}
Vue.prototype.$validationCheckAll = function() {
for( index in elements ){
if( !validationHandle(elements[index].el,elements[index].binding) ){
return false;
}
}
}
}
}
Vue.use(validation);