SpringMVC+freemarker实现菜单导航的思想一

来源:互联网 发布:单身贵族 知乎 编辑:程序博客网 时间:2024/05/16 14:47

1、登录系统后进入的首页index.ftl


<!DOCTYPE html>
<html lang="en">
<head>
<#include "common/html_header.ftl" />
    <#-- WIDGETS static files -->
</head>
<body>
<div id="loading"><img src="/static/images/spinner/loader-dark.gif" alt="Loading..."></div>

<div id="sb-site">
<#include "common/mainsite.ftl" /><#--这个是主要的菜单导航和内容显示的文件-->
</div>


</body>
<#--data init-->
<#include "global/widgets_static.ftl" />
<#include "common/init.ftl" />
</html>


2、mainsite.ftl配置

<div id="page-wrapper">


<!-- #page-header -->
<div id="page-header" class="clearfix"><#include "page-header.ftl"></div>


<div id="page-sidebar" class="rm-transition">
<#include "page-slidebar.ftl"><!-- 左侧菜单导航栏 -->
</div>


<div id="page-content-wrapper" class="rm-transition">
<!--<div id="page-nav"><#include "navigation.ftl" /></div><!-- #page-nav -->
<div id="page-content">
<#include "../global/component_regist.ftl" /><#--根据左侧菜单导航栏的请求的URL,引入对应的逻辑页面 -->
<#include "../global/js.ftl" /><#--引入逻辑页面对应的js-->
</div>
</div><!-- #page-content-wrapper -->


</div><!-- #page-wrapper -->



3、导航栏page-slidebar.ftl

<#assign security=JspTaglibs["http://www.springframework.org/security/tags"] />
<@security.authorize ifAnyGranted="ROLE_ADMIN,ROLE_ORDINARY" >
    <div id="sidebar-menu">
        <ul>
            <li>
                <a href="/ps_service/hellotest.do" title="Dashboard">
                    <i class="glyph-icon icon-linecons-tv"></i>
                    <span>Hello Test</span>
                </a>

            </li>

        </ul>
    </div>
</@security.authorize>


4、单用户点击菜单导航栏中的Hello Test按钮时,向后台发出URL请求/ps_service/hellotest.do

后台cotroller接收请求

@RequestMapping("/hellotest.do")
public String hellotest(ModelMap modelMap, HttpServletRequest request) {
modelMap.put("component", "hellotest");
    return "/admin/index.ftl";
}


在视图解析器中装入hellotest,即modelMap.put("component", "hellotest");



5、逻辑页面component_regist.ftl配置如下:

<@.vars["${component}"] />
<#macro hellotest>
    <#include "../component/hello.ftl" />
</#macro>

根据后台返回的component在index.ftl中引入hello.ftl页面,实现菜单请求到内容展示的全过程


同时引入hello.ftl中对应处理页面的js

6、js.ftl


<!--Ztree的包,这是必须要加载的js,后面是根据请求加载的js-->
<link rel="stylesheet" href="/static/widgets/ztree/css/zTreeStyle/zTreeStyle.css" type="text/css">
<script type="text/javascript" src="/static/widgets/ztree/js/jquery.ztree.core.js"></script>
<script type="text/javascript" src="/static/widgets/ztree/js/jquery.ztree.excheck.js"></script>


<!--根据请求加载的js-->

<@.vars["${component}"] />

<#macro hellotest>

<script src="/static/custom/js/admin/authorization/hellotest.js"></script>
</#macro>