egg(57)--helper.js擴展格式化日期,後臺框架iframe重構

helper.js擴展格式化日期

extend

app/extend/helper.js

var sd = require('silly-datetime');

module.exports = {
    formatTime(params){
        return sd.format(new Date(params),'YYYY-MM-DD HH:mm:ss')
    }
}

view

<td><%= helper.formatTime(list[i].add_time) %></td>

在這裏插入圖片描述

後臺框架iframe重構

原因: 爲防止左側導航點擊後,刷新頁面,導航無法保存左側導航展開收起

router.js

  router.get('/admin', controller.admin.main.index)
  router.get('/admin/welcome', controller.admin.main.welcome)

主頁面

appview/admin/main.html
重要屬性

<iframe name="rightMain" id="rightMain" src="/admin/welcome">
</iframe>

全部代碼

<%- include ../public/page_header.html %>

<nav class="navbar navbar-inverse" role="navigation">
    <div class="container-fluid">
        <div class="navbar-header">
            <img src="/public/admin/images/node.jpg" height="44px;" />
        </div>
        <div class="collapse navbar-collapse" id="example-navbar-collapse">           
            <ul class="nav navbar-nav navbar-right">
                <li><a>歡迎您 <%=userinfo.username%></a>
                </li>
                <li><a href="/admin/loginOut">安全退出</a>
                </li>
            </ul>
        </div>
    </div>
</nav>

<div class="container-fluid">
    <div class="row">
        <div class="col-sm-2">
            <%- include ../public/page_aside.html %>
        </div>
        <div class="col-sm-10">
            <iframe name="rightMain" id="rightMain" src="/admin/welcome" frameborder="false" scrolling="auto" width="100%" height="100%">
            </iframe>
        </div>
    </div>
</div>

</body>
</html>

公共頭部

app/view/admin/public/page_header.html

<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <title>egg後臺管理系統</title>
</head>
<body>
<!--The content below is only a placeholder and can be replaced.-->

<link rel="stylesheet" href="/public/admin/bootstrap/css/bootstrap.css">

<link rel="stylesheet" href="/public/admin/css/basic.css">

<script type="text/javascript" src="/public/admin/bootstrap/js/jquery-1.10.1.js"></script>

<script type="text/javascript" src="/public/admin/js/base.js"></script>

左側導航

app/view/admin/public/page_aside.html
重要屬性

<atarget="rightMain"></a>

全部代碼

<ul class="aside">
    <%for(var i=0;i<asideList.length;i++){%>
    <li>
        <%if((asideList[i].checked && asideList[i].type==1) || (userinfo.is_super==1&& asideList[i].type==1)){%>
        <h4>
            <%=asideList[i].module_name %>
            <span class="nav_open"></span>
        </h4>
        <ul>
            <%for(var j=0;j<asideList[i].items.length;j++){%>
            <%if((asideList[i].items[j].checked && asideList[i].items[j].type!=3) || (userinfo.is_super==1 && asideList[i].items[j].type!=3)){%>
            <li class="list-group-item"> <a href="<%=asideList[i].items[j].url%>" target="rightMain">
                    <%=asideList[i].items[j].action_name %></a></li>
            <%}%>
            <%}%>
        </ul>
        <%}%>
    </li>
    <%}%>
</ul>

效果

紅色頭部
藍色導航
綠色frame
在這裏插入圖片描述

發表評論
所有評論
還沒有人評論,想成為第一個評論的人麼? 請在上方評論欄輸入並且點擊發布.
相關文章