Skip to content
On this page

页面布局

UI 配置

推荐先使用 Pro 站点 的右侧抽屉来帮助你完成布局相关的整体风格、主题色、导航模式、内容区域、固定 Header、固定侧边菜单、系统设置等配置选择。然后将拷贝的配置粘贴在 layout 配置中。

以下内容为可配置内容及默认值

ts
import type { SettingsConfig } from "@/stores/settings";

export default {
    /**
     * 默认主题色
     */
    themeColor: "#d7000f",
    /**
     * 是否固定Header
     */
    fixedHeader: true,
    /**
     * 是否固定侧边栏
     */
    fixedSide: true,
    /**
     * 是否收起菜单
     */
    collapsed: false,
    /**
     * 是否显示菜单栏
     */
    menu: true,
    /**
     * 是否显示顶栏
     */
    header: true,
    /**
     * 是否显示面包屑导航
     */
    breadcrumb: true,
    /**
     * 是否显示标签栏
     */
    tagsView: true,
    /**
     * 是否显示公共底部
     */
    footer: true,
    /**
     * 是否缓存组件
     */
    keepAlive: true,
    /**
     * 是否开启权限控制
     */
    auth: import.meta.env.PROD,
} as SettingsConfig;

404

内置布局会对不存在的路由、无权访问的路由都会展示默认的 UI。无权访问如上所示。

访问不存在的 UI 时,默认 UI 如下

Released under the MIT License.