组件重新构建

WebService/pom.xml

@@ -31,6 +31,10 @@
             <groupId>org.springframework.boot</groupId>
             <artifactId>spring-boot-starter-thymeleaf</artifactId>
         </dependency>
+        <dependency>
+            <groupId>net.sourceforge.nekohtml</groupId>
+            <artifactId>nekohtml</artifactId>
+        </dependency>
 
 
 

WebService/src/main/java/com/java110/web/core/BaseComponentSMO.java

@@ -0,0 +1,56 @@
+package com.java110.web.core;
+
+import com.java110.common.constant.CommonConstant;
+import com.java110.common.factory.ApplicationContextFactory;
+import com.java110.common.util.Assert;
+import com.java110.core.base.smo.BaseServiceSMO;
+import com.java110.core.context.IPageData;
+import com.java110.web.smo.impl.LoginServiceSMOImpl;
+import org.slf4j.Logger;
+import org.slf4j.LoggerFactory;
+import org.springframework.http.HttpStatus;
+import org.springframework.http.ResponseEntity;
+
+import java.lang.reflect.Method;
+
+/**
+ * Created by wuxw on 2019/3/22.
+ */
+public class BaseComponentSMO extends BaseServiceSMO {
+
+    private final static Logger logger = LoggerFactory.getLogger(BaseComponentSMO.class);
+
+    /**
+     * 调用组件
+     * @param componentCode 组件编码
+     * @param componentMethod 组件方法
+     * @param pd
+     * @return
+     */
+    protected ResponseEntity<String> invokeComponent(String componentCode,String componentMethod,IPageData pd){
+
+        logger.debug("开始调用组件：{}",pd.toString());
+
+        ResponseEntity<String> responseEntity = null;
+
+        Object componentInstance = ApplicationContextFactory.getBean(componentCode);
+
+        Assert.notNull(componentInstance,"未找到组件对应的处理类，请确认 "+componentCode);
+        try {
+
+            Method cMethod = componentInstance.getClass().getDeclaredMethod(componentMethod, IPageData.class);
+
+            Assert.notNull(cMethod, "未找到组件对应处理类的方法，请确认 " + componentCode + "方法：" + componentMethod);
+
+            logger.debug("组件编码{}，组件方法{}，pd 为{}", componentCode, componentMethod, pd.toString());
+
+            responseEntity = (ResponseEntity<String>) cMethod.invoke(componentInstance, pd);
+        }catch (Exception e){
+            logger.error("调用组件失败：",e);
+            responseEntity = new ResponseEntity<String>("调用组件"+componentCode+",组件方法"+componentMethod+"失败："+e.getMessage(),
+                    HttpStatus.INTERNAL_SERVER_ERROR);
+        }finally {
+            return responseEntity;
+        }
+    }
+}

WebService/src/main/java/com/java110/web/core/VueComponentElement.java

@@ -33,11 +33,13 @@ public class VueComponentElement extends AbstractMarkupSubstitutionElementProces
         List<Node> nodes = new ArrayList<>();
         //获取模板名称
         String componentName = element.getAttributeValue("name");
+        logger.debug("正在解析组件{}",componentName);
         String html = VueComponentTemplate.findTemplateByComponentCode(componentName+"."+VueComponentTemplate.COMPONENT_HTML);
         if(html == null){
             throw new RuntimeException("在缓存中未找到组件【"+componentName+"】");
         }
-        List<Node> tmpNodes = DOMUtils.getHtml5DOMFor(new StringReader(html)).getChildren();
+        //List<Node> tmpNodes = DOMUtils.getHtml5DOMFor(new StringReader(html)).getChildren();
+        List<Node> tmpNodes = DOMUtils.getLegacyHTML5DOMFor(new StringReader(html)).getChildren();
         for(Node tmpNode : tmpNodes) {
             nodes.add(tmpNode);
         }
@@ -52,7 +54,7 @@ public class VueComponentElement extends AbstractMarkupSubstitutionElementProces
         //js
         String js = VueComponentTemplate.findTemplateByComponentCode(componentName+"."+VueComponentTemplate.COMPONENT_JS);
         if(js != null){
-            js = "<script type=\"text/javascript\">" + js +"</script>";
+            js = "<script type=\"text/javascript\">//<![CDATA[ \n" + js +"//]]>\n</script>";
             Node nodeJs = new Macro(js);
             nodes.add(nodeJs);
         }

WebService/src/main/java/com/java110/web/smo/impl/LoginServiceSMOImpl.java

@@ -2,23 +2,22 @@ package com.java110.web.smo.impl;
 
 import com.alibaba.fastjson.JSONObject;
 import com.java110.common.cache.CommonCache;
-import com.java110.common.constant.CommonConstant;
 import com.java110.common.constant.ServiceConstant;
 import com.java110.common.util.Assert;
-import com.java110.core.base.smo.BaseServiceSMO;
 import com.java110.core.context.IPageData;
 import com.java110.core.factory.AuthenticationFactory;
 import com.java110.core.factory.ValidateCodeFactory;
+import com.java110.web.core.BaseComponentSMO;
 import com.java110.web.smo.ILoginServiceSMO;
 import org.slf4j.Logger;
 import org.slf4j.LoggerFactory;
 import org.springframework.beans.factory.annotation.Autowired;
-import org.springframework.http.*;
+import org.springframework.http.HttpMethod;
+import org.springframework.http.HttpStatus;
+import org.springframework.http.ResponseEntity;
 import org.springframework.stereotype.Service;
 import org.springframework.web.client.RestTemplate;
 
-import java.awt.*;
-import java.awt.image.BufferedImage;
 import java.util.Random;
 
 /**
@@ -27,7 +26,7 @@ import java.util.Random;
  */
 
 @Service("loginServiceSMOImpl")
-public class LoginServiceSMOImpl extends BaseServiceSMO implements ILoginServiceSMO {
+public class LoginServiceSMOImpl extends BaseComponentSMO implements ILoginServiceSMO {
     private final static Logger logger = LoggerFactory.getLogger(LoginServiceSMOImpl.class);
 
 
@@ -52,6 +51,13 @@ public class LoginServiceSMOImpl extends BaseServiceSMO implements ILoginService
 
         Assert.jsonObjectHaveKey(pd.getReqData(),"username","请求报文格式错误或未包含username信息");
         JSONObject loginInfo = JSONObject.parseObject(pd.getReqData());
+
+        //调用 验证码组件验证码是否正确
+        responseEntity = this.invokeComponent("validate-code","validate",pd);
+        if(responseEntity.getStatusCode() != HttpStatus.OK){
+            return responseEntity;
+        }
+
         loginInfo.put("passwd", AuthenticationFactory.passwdMd5(loginInfo.getString("passwd")));
         responseEntity = this.callCenterService(restTemplate,pd,loginInfo.toJSONString(),ServiceConstant.SERVICE_API_URL+"/api/user.service.login",HttpMethod.POST);
         if(responseEntity.getStatusCode() == HttpStatus.OK){
@@ -93,11 +99,11 @@ public class LoginServiceSMOImpl extends BaseServiceSMO implements ILoginService
 
         logger.debug("校验验证码参数:{}",pd.toString());
         ResponseEntity<String> verifyResult = null;
-        Assert.jsonObjectHaveKey(pd.getReqData(),"code","请求报文中未包含 code节点"+pd.toString());
+        Assert.jsonObjectHaveKey(pd.getReqData(),"validateCode","请求报文中未包含 validateCode节点"+pd.toString());
 
         String code = CommonCache.getValue(pd.getSessionId()+"_validateCode");
 
-        if(JSONObject.parseObject(pd.getReqData()).getString("code").equals(code)){
+        if(JSONObject.parseObject(pd.getReqData()).getString("validateCode").equals(code)){
             verifyResult = new ResponseEntity<>("成功", HttpStatus.OK);
         }else{
             verifyResult = new ResponseEntity<>("验证码错误", HttpStatus.INTERNAL_SERVER_ERROR);

WebService/src/main/resources/application-dev.yml

@@ -73,7 +73,7 @@ spring:
     username: TT
 
   thymeleaf:
-    mode: HTML5
+    mode: LEGACYHTML5
     cache: false
     prefix: classpath:/views/
     encoding: UTF-8

WebService/src/main/resources/application-prod.yml

@@ -73,7 +73,7 @@ spring:
     username: TT
 
   thymeleaf:
-    mode: HTML5
+    mode: LEGACYHTML5
     cache: false
     prefix: classpath:/views/
     encoding: UTF-8

WebService/src/main/resources/application-test.yml

@@ -73,7 +73,7 @@ spring:
     username: TT
 
   thymeleaf:
-    mode: HTML5
+    mode: LEGACYHTML5
     cache: false
     prefix: classpath:/views/
     encoding: UTF-8

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

@@ -40,4 +40,5 @@
 <script src="/js/plugins/chartJs/Chart.min.js"></script>
 
 <!-- Toastr -->
-<script src="/js/plugins/toastr/toastr.min.js"></script>
+<script src="/js/plugins/toastr/toastr.min.js"></script>
+<script src="/js/vc-core.js" ></script>

WebService/src/main/resources/components/login/login.html

@@ -1,4 +1,4 @@
-<div id="login">
+<div component="login">
     <div>
         <h1 class="logo-name">HC</h1>
     </div>

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

@@ -1,6 +1,5 @@
 (function(vc){
-    var vm = new Vue({
-        el:'#login',
+      vc.extends({
         data:{
             loginInfo:{
                 username:'',
@@ -8,39 +7,48 @@
                 errorInfo:''
             }
         },
+        _initMethod:function(){
+
+        },
+        _initEvent:function(){
+             vc.component.$on('errorInfoEvent',function(_errorInfo){
+                    vc.component.loginInfo.errorInfo = _errorInfo;
+                    console.log('errorInfoEvent 事件被监听',_errorInfo)
+                });
+
+             vc.component.$on('login_param_change_event',function(params){
+                         for(var tmpAttr in params){
+                             vc.component.loginInfo[tmpAttr] = params[tmpAttr];
+                         }
+                         console.log('errorInfoEvent 事件被监听',params)
+                     });
+        },
         methods:{
             doLogin(){
-
-                vc.http.call('login','doLogin',JSON.stringify(this.loginInfo),
+                vc.http.call(
+                            'login',
+                            'doLogin',
+                            JSON.stringify(vc.component.loginInfo),
                             {
                                 emulateJSON:true
-                             },function(json,res){
+                             },
+                             function(json,res){
                                 //vm.menus = vm.refreshMenuActive(JSON.parse(json),0);
                                 if(res.status == 200){
                                     vc.jumpToPage("/");
                                     return ;
                                 }
-                                vm.loginInfo.errorInfo = json;
-                             },function(errInfo,error){
+                                vc.component.loginInfo.errorInfo = json;
+                             },
+                             function(errInfo,error){
                                 console.log('请求失败处理');
 
-                                vm.loginInfo.errorInfo = errInfo;
-                             })
+                                vc.component.loginInfo.errorInfo = errInfo;
+                             });
 
             }
         }
     });
 
-    vc.component.$on('errorInfoEvent',function(_errorInfo){
-        vm.loginInfo.errorInfo = _errorInfo;
-        console.log('errorInfoEvent 事件被监听',_errorInfo)
-    });
-
-    vc.component.$on('login_param_change_event',function(params){
-            for(var tmpAttr in params){
-                vm.loginInfo.loginInfo[tmpAttr] = params[tmpAttr];
-            }
-            console.log('errorInfoEvent 事件被监听',params)
-        })
 
 })(window.vc);

WebService/src/main/resources/components/validate_code/validate-code.html

@@ -1,4 +1,4 @@
-<div class="form-group" id="validatecode">
+<div class="form-group" component="validate-code">
     <input type="text" v-model="validateCode" class="form-control" placeholder="请输入验证码" required=""/><slot></slot>
     <img v-bind:src="codeImage" v-on:click="generateCode()"/>
 </div>

WebService/src/main/resources/components/validate_code/validate-code.js

@@ -1,17 +1,24 @@
 (function(vc){
-    var vm = new Vue({
-        el:'#validatecode',
-            data:function(){
-                return {
-                   validateCode:'123',
-                   codeImage:'/callComponent/validate-code/generateValidateCode',
-                   errorInfo:''
-                }
+    vc.extends({
+            data:{
+               validateCode:'',
+               codeImage:'/callComponent/validate-code/generateValidateCode',
+            },
+            _initMethod:function(){
+                 vc.component.generateCode();
+
             },
-            mounted:function(){
-                       this.generateCode();
-                   },
+            _initEvent:function(){
 
+            },
+            watch: {
+                validateCode:function(){
+                    var validateParam = {
+                        validateCode:vc.component.validateCode
+                    };
+                    vc.component.$emit('login_param_change_event',validateParam);
+                }
+            },
             methods:{
                 generateCode(){
                     var param = {
@@ -24,14 +31,13 @@
                                  function(json,res){
                                     //vm.menus = vm.refreshMenuActive(JSON.parse(json),0);
                                     if(res.status == 200){
-                                        vm.codeImage = json;
+                                        vc.component.codeImage = json;
                                         return ;
                                     }
                                     vc.component.$emit('errorInfoEvent',json);
                                  },function(errInfo,error){
                                     console.log('请求失败处理');
-
-                                    vm.errorInfo = errInfo;
+                                    vc.component.errorInfo = errInfo;
                                  });
 
                 }

WebService/src/main/resources/static/js/core.js

@@ -1,30 +1,36 @@
 /**
-初始化处理
+初始化处理 vue component
 **/
 (function(window, undefined){
     "use strict";
    var vc = window.vc || {};
-   var _vmOptions = window.vc.vmOptions || {};
+   var _vmOptions = {};
+   var _initMethod = [];
+   var _initEvent = [];
+   var _component = {};
 
    _vmOptions = {
         el:'#component',
         data:{
 
+        },
+        watch: {
+
         },
         methods:{
 
         },
 
    };
-
     vc = {
         version:"v0.0.1",
         name:"vue component",
         author:'java110',
-        vmOptions:_vmOptions
+        vmOptions:_vmOptions,
+        initMethod:_initMethod,
+        initEvent:_initEvent,
+        component:_component
     };
-
-
    //通知window对象
    window.vc = vc;
 })(window);
@@ -36,7 +42,7 @@
 (function(vc){
     vc.http = {
         call:function(componentCode,componentMethod,param,options,successCallback,errorCallback){
-        console.log(successCallback)
+        console.log(successCallback);
                 Vue.http.post('/callComponent/'+componentCode +"/"+componentMethod, param, options)
                 .then(function(res){
                     successCallback(res.bodyText,res);
@@ -50,8 +56,8 @@
     var vmOptions = vc.vmOptions;
     //继承方法,合并 _vmOptions 的数据到 vmOptions中
     vc.extends = function(_vmOptions){
-        if(typeof _vmOptions !== Object){
-            throw "_vmOptions is not Object"
+        if(typeof _vmOptions !== "object"){
+            throw "_vmOptions is not Object";
         }
         //处理 data 对象
         if(_vmOptions.hasOwnProperty('data')){
@@ -61,10 +67,25 @@
         }
         //处理methods 对象
         if(_vmOptions.hasOwnProperty('methods')){
-            for(var dataAttr in _vmOptions.data){
-                vmOptions.data[dataAttr] = _vmOptions.data[dataAttr];
+            for(var methodAttr in _vmOptions.methods){
+                vmOptions.methods[methodAttr] = _vmOptions.methods[methodAttr];
             }
         }
+        //处理methods 对象
+        if(_vmOptions.hasOwnProperty('watch')){
+            for(var watchAttr in _vmOptions.watch){
+                vmOptions.watch[watchAttr] = _vmOptions.watch[watchAttr];
+            }
+        }
+        //处理_initMethod 初始化执行函数
+        if(_vmOptions.hasOwnProperty('_initMethod')){
+            vc.initMethod.push(_vmOptions._initMethod);
+        }
+        //处理_initEvent
+        if(_vmOptions.hasOwnProperty('_initEvent')){
+            vc.initEvent.push(_vmOptions._initEvent);
+        }
+
     };
 
     //绑定跳转函数

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

@@ -4,8 +4,18 @@
     @param vmOptions Vue参数
 **/
 (function(vc,vmOptions){
+    console.log("vmOptions:",vmOptions);
+    vc.component = new Vue(vmOptions);
+})(window.vc,window.vc.vmOptions);
 
-    var vm = new Vue(vmOptions);
-
-    window.vc.component = vm;
-})(window.vc,window.vc.vmOptions);
+/**
+ * vue对象 执行初始化方法
+ */
+(function(vc){
+    vc.initEvent.forEach(function(eventMethod){
+        eventMethod();
+   });
+   vc.initMethod.forEach(function(callback){
+        callback();
+   });
+})(window.vc);

WebService/src/main/resources/views/login.html

@@ -17,7 +17,7 @@
 </head>
 
 <body class="gray-bg">
-<div class="middle-box text-center loginscreen animated fadeInDown">
+<div id="component" class="middle-box text-center loginscreen animated fadeInDown">
     <vc:create name="login"></vc:create>
 
 </div>

pom.xml

@@ -384,6 +384,11 @@
                 <version>${swagger.version}</version>
             </dependency>
 
+            <dependency>
+                <groupId>net.sourceforge.nekohtml</groupId>
+                <artifactId>nekohtml</artifactId>
+                <version>1.9.22</version>
+            </dependency>
 
         </dependencies>