# 后台框架页使用及二开

页面分为4部分:

  • 1.左侧菜单栏
  • 2.顶部栏
  • 3.tag栏
  • 4.内容页

U4K3PU.png

# 页面权限:功能按权限显示

hasRolePermission()用于检测当前登录用户是否有权限访问路由。请参考页面中的『缓存清理』功能实现。

图片

# 页面操作

1.打开新窗口


//方法1.直接调用(兼容性差)

parent.window.__adminOpenNewFrame({
    title: '概览',
    url: '/Main/Index/index'
})

//方法2. 封装后再调用
window.openNewIframe = function (title, url) {
    if (parent.window != window) {
        parent.window.__adminOpenNewFrame({
            title: title,
            url: url
        })
    } else {
        window.location.href = url;
    }
}.bind(this)

//调用
window.openNewIframe('概览','/Main/Index/index');

//方法3 底层实现方法,使用事件触发
const event = new CustomEvent('adminOpenNewFrame', {
  detail: {
    title: '启动父窗口1', 
    url: '/Main/Index/index'
  }
})
window.parent.dispatchEvent(event)

// 方法4(推荐) `/statics/js/ztbcms/ztbcms.js`中已经封装好了,只要引入即可
ztbcms.openNewIframeByUrl('概览', '/Main/Index/index')
ztbcms.openNewIframeByUrl('百度', 'https://baidu.com')
  1. 图标配置

到iconfont.cn选取icon,用的是svg 图片

在dashborad.php 引入js 图片

设置菜单的icon 图片