管理面板

功能特性

确认模态框

管理面板开箱即用地包含一个通用的链接确认模态框。通过在 <a> 标签上使用 HTML data 属性，可以以不同的方式配置模态框。只需在您的链接中添加一个 data 属性即可。

触发模态框将在 DOM 中追加一个 HTML 元素 form，其中包含标题、文本、确认按钮和取消按钮。

默认情况下，确认操作会提交表单，而取消操作会从 DOM 中移除 HTML 元素

基本用法

<a href="#" data-confirm="true">Open modal</a>

Data 属性

属性	描述	示例
data-confirm	初始化模态框	`data-confirm="true"`
data-title	设置模态框的标题	`data-title="请确认"`
data-text	设置模态框的文本内容	`data-text="您确定要继续吗？"`
data-button	设置确认按钮的 Bootstrap CSS 选择器	`data-button="danger"` [primary,secondary,success,danger,warning,info,light,dark]
data-confirm-btn	设置“确认”按钮上的文本标签	`data-confirm-btn="是"`
data-dismiss-btn	设置“取消”按钮上的文本标签	`data-confirm-btn="否"`

覆盖默认行为

// Override modal confirm action
modalConfirmation.actions.confirm = function(event) {
    alert("Confirmed");
}

// Overríde modal dismiss action
modalConfirmation.actions.dismiss = function(event) {
    alert("Dismissed");
}

Leaf 标签

管理面板提供多种 leaf 标签，用于生成特定的 HTML/js 元素

#adminPanel:avatarURL

使用用户图像或回退到 Adorable avatars

参数	类型	描述
`email`	字符串	用户邮箱
`url`	字符串	图片 URL

用法示例

<img src="#adminPanel:avatarURL(user.email, user.avatarURL)" alt="Profile picture" class="img-thumbnail" width="40">

#adminPanel:config

便捷方法，用于输出配置字符串，例如应用或环境名称，或某些模板的路径

支持的输入值及其输出

name: 应用名称
baseURL: 应用基础 URL
sidebarMenuPath: 侧边栏菜单视图模板的路径
dashboardPath: 仪表盘视图模板的路径
environment: 环境名称

参数	类型	描述
`configName`	字符串	配置变量名

用法示例

<!-- outputs app name ->
#adminPanel:config("name")

#adminPanel:user

将当前用户对象上的字段作为字符串输出

参数	类型	描述
`fieldName`	字符串	用户字段名

用法示例

<!-- outputs user's name ->
#adminPanel:user("name")

#adminPanel:user:requireRole

确保用户具有所需的角色才能输出元素。否则会抛出错误。

参数	类型	描述
`roleName`	字符串	用户角色

用法示例

#adminPanel:user:requireRole("superAdmin") {
    <div>I show if user is super admin</div>
}

#adminPanel:user:hasRequiredRole

检查用户是否具有所需的角色

参数	类型	描述
`roleName`	字符串	用户角色

用法示例

#if(adminPanel:user:hasRequiredRole("superAdmin")) {
    // Do something
} else {
    // Do something else
}

#adminPanel:sidebar:heading

为导航侧边栏渲染一个以特定方式设置样式的标题。

用法示例

#adminPanel:sidebar:heading() { Super Admin }

#adminPanel:sidebar:menuItem

为导航侧边栏渲染一个以特定方式设置样式的侧边栏菜单项。

参数	类型	描述
`url`	字符串	菜单项链接引用
`icon`	字符串	菜单项的 Feather 图标
`activeURLPatterns`	字符串	用于确定活动状态的 URL 模式

用法示例

#adminPanel:sidebar:menuItem("/admin/dashboard", "home", "/admin/dashboard*") { Home }