吴学文
2019-04-28 92046f39585678dc38023e6f4f22d0988673f1c2
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
38
39
40
41
42
43
44
45
46
47
48
49
50
51
52
53
54
55
56
57
58
59
60
61
62
63
64
65
66
67
68
69
70
71
72
73
74
75
76
77
78
79
80
81
82
83
84
85
86
87
package com.java110.web.core;
 
import org.slf4j.Logger;
import org.slf4j.LoggerFactory;
import org.thymeleaf.Arguments;
import org.thymeleaf.dom.Document;
import org.thymeleaf.dom.Element;
import org.thymeleaf.dom.Macro;
import org.thymeleaf.dom.Node;
import org.thymeleaf.processor.element.AbstractMarkupSubstitutionElementProcessor;
import org.thymeleaf.util.DOMUtils;
 
import java.io.StringReader;
import java.util.ArrayList;
import java.util.List;
 
/**
 * 组件 自定义标签功能类
 * Created by wuxw on 2019/3/18.
 */
public class VueComponentElement extends AbstractMarkupSubstitutionElementProcessor {
 
    private static Logger logger = LoggerFactory.getLogger(VueComponentElement.class);
 
    private static final String DIV_PROPERTY_COMPONENT = "data-component";
 
 
    protected VueComponentElement(String elementName) {
        super(elementName);
    }
 
    @Override
    protected List<Node> getMarkupSubstitutes(Arguments arguments, Element element) {
 
        //logger.debug("arg:{},element:{}", JSONObject.toJSONString(arguments),element.getAttributeValue("name"));
        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();
        Document tmpDoc = DOMUtils.getLegacyHTML5DOMFor(new StringReader(html));
        List<Node> tmpNodes = tmpDoc.getChildren();
 
        addDataComponent(tmpDoc, componentName);
        for (Node tmpNode : tmpNodes) {
            nodes.add(tmpNode);
        }
        //css
        String css = VueComponentTemplate.findTemplateByComponentCode(componentName + "." + VueComponentTemplate.COMPONENT_CSS);
        if (css != null) {
            css = "<style type=\"text/css\">" + css + "</style>";
            Node nodeCss = new Macro(css);
            nodes.add(nodeCss);
        }
 
        //js
        String js = VueComponentTemplate.findTemplateByComponentCode(componentName + "." + VueComponentTemplate.COMPONENT_JS);
        if (js != null) {
            js = "<script type=\"text/javascript\">//<![CDATA[ \n" + js + "//]]>\n</script>";
            Node nodeJs = new Macro(js);
            nodes.add(nodeJs);
        }
 
 
        return nodes;
    }
 
    /**
     * 加入组件名称到 HTML中 方便定位问题
     *
     * @param tmpDoc        页面节点
     * @param componentCode 组件编码
     */
    private void addDataComponent(Document tmpDoc, String componentCode) {
        Element tmpElement = tmpDoc.getFirstElementChild();
        tmpElement.setAttribute(DIV_PROPERTY_COMPONENT, componentCode);
    }
 
    @Override
    public int getPrecedence() {
        return 1000;
    }
}