• 阶段5 3.微服务项目【学成在线】_day04 页面静态化_19-页面静态化-模板管理-模板存储




    因为没有界面,所以手动的通过操作数据库的方式来存储
    比如说要存一个轮播图的模板


    把自增的_id去掉

    先用测试程序把文件存储到gridFS得到一个gridId,然后拿着这个文件的id

    这样就添加好了这一条记录。

    这是我自己本机的添加的记录

    { 
        "_class" : "com.xuecheng.framework.domain.cms.CmsTemplate", 
        "siteId" : "5a751fab6abb5044e0d19ea1", 
        "templateName" : "轮播图test005", 
        "templateParameter" : "", 
        "templateFileId" : "5dbeb89bface36388cb8c7d4"
    }

    修改模板,重新到如chunks

    修改模板文件怎么去修改。先导出,再导入


    把一堆注释的代码删掉

    模板文件

    <!DOCTYPE html>
    <html lang="en">
    <head>
        <meta charset="UTF-8">
        <title>Title</title>
        <link rel="stylesheet" href="http://www.xuecheng.com/plugins/normalize-css/normalize.css" />
        <link rel="stylesheet" href="http://www.xuecheng.com/plugins/bootstrap/dist/css/bootstrap.css" />
        <link rel="stylesheet" href="http://www.xuecheng.com/css/page-learing-index.css" />
        <link rel="stylesheet" href="http://www.xuecheng.com/css/page-header.css" />
    </head>
    <body>
    <div class="banner-roll">
        <div class="banner-item">
            <#if model??>
                <#list model as item>
                    <div class="item" style="background-image: url(${item.value});"></div>
                </#list>
            </#if>
        </div>
        <div class="indicators"></div>
    </div>
    <script type="text/javascript" src="http://www.xuecheng.com/plugins/jquery/dist/jquery.js"></script>
    <script type="text/javascript" src="http://www.xuecheng.com/plugins/bootstrap/dist/js/bootstrap.js"></script>
    <script type="text/javascript">
        var tg = $('.banner-item .item');
        var num = 0;
        for (i = 0; i < tg.length; i++) {
            $('.indicators').append('<span></span>');
            $('.indicators').find('span').eq(num).addClass('active');
        }
    
        function roll() {
            tg.eq(num).animate({
                'opacity': '1',
                'z-index': num
            }, 1000).siblings().animate({
                'opacity': '0',
                'z-index': 0
            }, 1000);
            $('.indicators').find('span').eq(num).addClass('active').siblings().removeClass('active');
            if (num >= tg.length - 1) {
                num = 0;
            } else {
                num++;
            }
        }
        $('.indicators').find('span').click(function() {
            num = $(this).index();
            roll();
        });
        var timer = setInterval(roll, 3000);
        $('.banner-item').mouseover(function() {
            clearInterval(timer)
        });
        $('.banner-item').mouseout(function() {
            timer = setInterval(roll, 3000)
        });
    </script>
    </body>
    </html>


    import File选择修改后的这个模板文件



     

  • 相关阅读:
    网络编程之粘包问题
    网络编程初识和socket套接字
    面向对象三大特性
    面向对象进阶
    面向对象初接触
    常用模块(模块初步了解)
    异常处理
    Ubutu Chrome 出现adobe flash is out of date的解决方法
    cmder默认的命令提示符λ改成$
    css在盒子中垂直居中和固定居中
  • 原文地址:https://www.cnblogs.com/wangjunwei/p/11595022.html
Copyright © 2020-2023  润新知