完成自封装vc-validate 功能

WebService/src/main/resources/components/common/commonTop.html

@@ -11,3 +11,6 @@
 <script src="/js/vue/vue-resource.min.js" ></script>
 <script src="/js/bootstrap/jquery-3.3.1.min.js"></script>
 <script src="/js/core.js" ></script>
+<script src="/js/vc-constant.js" ></script>
+<script src="/js/vc-validate.js" ></script>
+

WebService/src/main/resources/components/register/register.js

@@ -9,7 +9,7 @@
             }
         },
         _initMethod:function(){
-
+            //vc.component.validate();
         },
         _initEvent:function(){
              vc.component.$on('errorInfoEvent',function(_errorInfo){
@@ -25,7 +25,67 @@
                      });
         },
         methods:{
+            validate(){
+                return vc.validate.validate({
+                    registerInfo:vc.component.registerInfo
+                },{
+                    'registerInfo.username':[
+                        {
+                            limit:"required",
+                            param:"",
+                            errInfo:"用户名不能为空"
+                        },
+                        {
+                            limit:"maxin",
+                            param:"4,6",
+                            errInfo:"用户名长度必须在4位至6位"
+                        },
+                    ],
+                    'registerInfo.passwd':[
+                        {
+                            limit:"required",
+                            param:"",
+                            errInfo:"密码不能为空"
+                        },
+                        {
+                            limit:"maxin",
+                            param:"6,12",
+                            errInfo:"密码长度必须在6位至12位"
+                        },
+                    ],
+                    'registerInfo.tel':[
+                        {
+                            limit:"required",
+                            param:"",
+                            errInfo:"手机号不能为空"
+                        },
+                        {
+                            limit:"phone",
+                            param:"",
+                            errInfo:"不是有效的手机号"
+                        }
+                    ],
+                    'registerInfo.messageCode':[
+                        {
+                            limit:"required",
+                            param:"",
+                            errInfo:"验证码不能为空"
+                        },
+                        {
+                            limit:"num",
+                            param:"",
+                            errInfo:"验证码必须是数字"
+                        }
+                    ],
+
+                });
+            },
             doRegister(){
+
+                if(!vc.component.validate()){
+                    vc.component.registerInfo.errorInfo = vc.validate.errInfo;
+                    return ;
+                }
                 vc.http.post(
                             'register',
                             'doRegister',

WebService/src/main/resources/static/js/vc-constant.js

@@ -0,0 +1,10 @@
+/**
+常量
+**/
+(function(vc){
+
+    var constant = {
+        REQUIRED_MSG:"不能为空",
+    }
+    vc.constant = constant;
+})(window.vc);

WebService/src/main/resources/static/js/vc-validate.js

@@ -22,11 +22,21 @@ vc 校验 工具类 -method
     var validate = {
 
         state:true,
+        errInfo:'',
+
+        setState:function(_state,_errInfo){
+            this.state = _state;
+            if(!this.state){
+                this.errInfo = _errInfo
+                throw "校验失败:"+_errInfo;
+            }
+        },
+
         /**
             校验手机号
         **/
         phone:function(text){
-             var reg =/^0?1[3|4|5|6|7|8][0-9]\d{8}$/;
+             var regPhone =/^0?1[3|4|5|6|7|8][0-9]\d{8}$/;
              return regPhone.test(text);
         },
         /**
@@ -117,17 +127,81 @@ vc 校验 工具类 -method
      *
      * dataConfig:
      * {
-     *      "name":"required|maxin(1,10)",
-     *      "age":"required|num",
-     *      "emailInfo.email":"required|email"
+     *      "name":[
+                    {
+                       limit:"required",
+                       param:"",
+                       errInfo:'用户名为必填'
+                    },
+                    {
+                        limit:"maxin",
+                       param:"1,10",
+                       errInfo:'用户名必须为1到10个字之间'
+                    }]
      * }
      *
      */
     validate.validate = function(dataObj,dataConfig){
-        for(var key in dataConfig){
-            var keys = key.split(".");
-            dataConfig[key];
+
+        try{
+            // 循环配置（每个字段）
+            for(var key in dataConfig){
+                //配置信息
+                var tmpDataConfigValue = dataConfig[key];
+                //对key进行处理
+                var keys = key.split(".");
+                console.log("keys :",keys);
+                var tmpDataObj = dataObj;
+                //根据配置获取 数据值
+                keys.forEach(function(tmpKey){
+                     console.log('tmpDataObj:',tmpDataObj);
+                     tmpDataObj = tmpDataObj[tmpKey]
+                });
+//                for(var tmpKey in keys){
+//                    console.log('tmpDataObj:',tmpDataObj);
+//                    tmpDataObj = tmpDataObj[tmpKey]
+//                }
+
+                tmpDataConfigValue.forEach(function(configObj){
+                    if(configObj.limit == "required"){
+                        validate.setState(validate.required(tmpDataObj),configObj.errInfo);
+                    }
+
+                    if(configObj.limit == 'phone'){
+                        validate.setState(validate.phone(tmpDataObj),configObj.errInfo);
+                    }
+
+                    if(configObj.limit == 'email'){
+                        validate.setState(validate.email(tmpDataObj),configObj.errInfo);
+                    }
+
+                    if(configObj.limit == 'maxin'){
+                        var tmpParam = configObj.param.split(",")
+                        validate.setState(validate.maxin(tmpDataObj,tmpParam[0],tmpParam[1]),configObj.errInfo);
+                    }
+
+                    if(configObj.limit == 'maxLength'){
+                        validate.setState(validate.maxLength(tmpDataObj,configObj.param),configObj.errInfo);
+
+                    }
+
+                    if(configObj.limit == 'minLength'){
+                        validate.setState(validate.minLength(tmpDataObj,configObj.param),configObj.errInfo);
+
+                    }
+
+                    if(configObj.limit == 'num'){
+                        validate.setState(validate.num(tmpDataObj),configObj.errInfo);
+                    }
+                });
+
+            }
+        }catch(error){
+            console.log("数据校验失败",validate.state,validate.errInfo,error);
+            return false;
         }
+
+        return true;
     }
 
 })(window.vc.validate);