标准门户

标准门户是JitWeb提供的完整门户解决方案，基于React技术栈实现企业级门户框架。它负责应用入口管理、导航体系构建和用户界面统一，内置左侧导航、顶部导航、用户信息展示等完整门户组件，同时支持PC端和移动端的响应式适配。

标准门户元素分层结构为Meta（shells.Meta） → Type（shells.DefaultType） → 实例，开发者可通过JitAi的可视化开发工具快捷地创建标准门户实例元素。

当然，开发者也可以创建自己的Type元素，或者在自己的App中改写JitAi官方提供的shells.DefaultType元素，以实现自己的封装。

快速开始

创建实例元素

目录结构

推荐目录结构

shells/
└── MyPortal/               # 门户名称（可自定义）
    ├── e.json             # 元素声明文件
    └── feature.json       # 业务配置文件

e.json文件

基本配置示例

{
  "type": "shells.DefaultType",
  "title": "我的门户",
  "page": "pages.ShellLeftNavPage",
  "default": true,
  "status": 0,
  "frontBundleEntry": "./feature.json",
  "bizPageMode": true,
  "refreshOnPageFocus": true,
  "sort": 1,
  "remark": "门户说明"
}

业务配置文件

feature.json菜单配置

{
  "menus": [
    {
      "name": "dashboard",
      "title": "工作台",
      "nodeType": "page",
      "page": "pages.Dashboard",
      "mobilePage": "pages.DashboardMobile",
      "icon": "dashboard",
      "sort": 1
    },
    {
      "name": "system",
      "title": "系统管理",
      "nodeType": "group",
      "icon": "setting",
      "sort": 2,
      "children": [
        {
          "name": "users",
          "title": "用户管理",
          "nodeType": "page",
          "page": "pages.UserManage",
          "mobilePage": "pages.UserManageMobile",
          "icon": "user",
          "sort": 1
        }
      ]
    }
  ]
}

调用示例

获取门户实例

import { getRuntimeApp } from 'jit';

// 获取应用实例
const app = getRuntimeApp();

// 获取门户元素定义
const [shellDefine] = app.getElementDefine("shells.MyPortal");

// 获取门户实例
const portal = app.getElement("shells.MyPortal");

// 获取门户配置
const portalConfig = portal.shellConfig;
const portalMenus = portal.menuTree;

// 检查权限
const hasAccess = portal.allowAccess;

元素配置

e.json配置

配置项	类型	对应原生类型	必填	说明
type	Stext	str	是	固定为"shells.DefaultType"
title	Stext	str	是	门户显示名称
page	Stext	str	否	导航页面，默认为"pages.ShellLeftNavPage"
default	Checkbox	bool	否	是否为默认门户
status	Numeric	int	否	门户状态，0:启用 1:禁用
frontBundleEntry	Stext	str	是	前端配置文件路径，通常为"./feature.json"
bizPageMode	Checkbox	bool	否	是否启用业务页面模式
refreshOnPageFocus	Checkbox	bool	否	页面获得焦点时是否刷新
sort	Numeric	int	否	排序权重
remark	Ltext	str	否	门户说明
hideInRole	Checkbox	bool	否	是否在角色中隐藏
commonFuncList1	JitList	list	否	通用功能配置1
commonFuncList2	JitList	list	否	通用功能配置2
commonFuncList3	JitList	list	否	通用功能配置3

业务配置文件配置

feature.json文件包含门户的菜单结构和AI配置：

配置项	类型	对应原生类型	必填	说明
menus	JitList	list	是	菜单配置列表
aiConfig	JitDict	dict	否	AI助理配置

菜单项配置：

配置项	类型	对应原生类型	必填	说明
name	Stext	str	是	菜单唯一标识
title	Stext	str	是	菜单显示名称
nodeType	Stext	str	是	节点类型：page/group
page	Stext	str	否	PC端页面路径
mobilePage	Stext	str	否	移动端页面路径
icon	Stext	str	否	菜单图标
sort	Numeric	int	否	排序权重
hide	Checkbox	bool	否	是否隐藏
children	JitList	list	否	子菜单列表

方法

getAvailableMenu

获取可用的菜单列表，过滤掉无权限、隐藏和无效的菜单。

参数详解

参数名	类型	对应原生类型	必填	说明
menuTree	JitList	list	否	菜单树，默认使用实例的权限菜单

返回值

返回过滤后的可用菜单列表（list类型）。

使用示例

获取可用菜单

import { getRuntimeApp } from 'jit';

const app = getRuntimeApp();
const portal = app.getElement("shells.MyPortal");

// 获取所有可用菜单
const availableMenus = portal.getAvailableMenu();

// 获取指定菜单树的可用菜单
const customMenus = [
    {name: "test", title: "测试", page: "pages.Test", nodeType: "page"}
];
const filteredMenus = portal.getAvailableMenu(customMenus);

flatFeatureMenuItem

将层级菜单结构平铺为一维列表。

参数详解

参数名	类型	对应原生类型	必填	说明
menus	JitList	list	否	菜单列表，默认使用实例的菜单树

返回值

返回平铺后的菜单列表（list类型）。

使用示例

平铺菜单结构

import { getRuntimeApp } from 'jit';

const app = getRuntimeApp();
const portal = app.getElement("shells.MyPortal");

// 平铺默认菜单
const flatMenus = portal.flatFeatureMenuItem();

// 平铺指定菜单
const customMenus = portal.menuTree;
const flatCustom = portal.flatFeatureMenuItem(customMenus);

getPermConfig

根据角色名称获取权限配置。

参数详解

参数名	类型	对应原生类型	必填	说明
roleName	Stext	str	是	角色fullName

返回值

无返回值，会设置实例的permConfig属性。

使用示例

获取角色权限

import { getRuntimeApp } from 'jit';

const app = getRuntimeApp();
const portal = app.getElement("shells.MyPortal");

// 获取管理员权限
await portal.getPermConfig("roles.Admin");

// 获取当前权限配置
const currentPerm = portal.permConfig;

mergeMenus

合并多个菜单列表，前面的菜单会覆盖后面同名的菜单。

参数详解

参数名	类型	对应原生类型	必填	说明
menusLists	JitList	list	是	菜单列表的列表

返回值

返回合并后的菜单列表（list类型）。

使用示例

合并菜单

import { getRuntimeApp } from 'jit';

const app = getRuntimeApp();
const portal = app.getElement("shells.MyPortal");

// 合并多个菜单列表
const baseMenus = [{name: "home", title: "首页"}];
const extendMenus = [{name: "about", title: "关于"}];
const merged = portal.mergeMenus([baseMenus, extendMenus]);

getPermMenu

获取有权限的菜单列表，根据权限配置过滤菜单。

参数详解

参数名	类型	对应原生类型	必填	说明
menuTree	JitList	list	否	菜单树，默认使用实例的菜单树

返回值

返回有权限的菜单列表（list类型）。

使用示例

获取有权限菜单

import { getRuntimeApp } from 'jit';

const app = getRuntimeApp();
const portal = app.getElement("shells.MyPortal");

// 获取有权限的菜单
const permMenus = portal.getPermMenu();

// 获取指定菜单树的权限菜单
const customMenus = portal.menuTree;
const filteredPermMenus = portal.getPermMenu(customMenus);

setExtendsFeature

设置继承的特性配置。

参数详解

参数名	类型	对应原生类型	必填	说明
feature	JitList	list	是	继承特性配置列表，包含menus和aiConfig

返回值

无返回值。

使用示例

设置继承特性

import { getRuntimeApp } from 'jit';

const app = getRuntimeApp();
const portal = app.getElement("shells.MyPortal");

// 设置继承特性
const inheritedFeature = [
    {menus: [{name: "base", title: "基础功能"}]}
];
portal.setExtendsFeature(inheritedFeature);

setOriginFeature

设置原始特性配置。

参数详解

参数名	类型	对应原生类型	必填	说明
feature	JitDict	object	是	原始特性配置，包含menus和aiConfig

返回值

无返回值。

使用示例

设置原始特性

import { getRuntimeApp } from 'jit';

const app = getRuntimeApp();
const portal = app.getElement("shells.MyPortal");

// 设置原始特性
const originalFeature = {
    menus: [{name: "custom", title: "自定义功能"}]
};
portal.setOriginFeature(originalFeature);

setBackUrl

设置返回URL。

参数详解

参数名	类型	对应原生类型	必填	说明
backUrl	Stext	str	是	返回URL地址

返回值

无返回值。

使用示例

设置返回URL

import { getRuntimeApp } from 'jit';

const app = getRuntimeApp();
const portal = app.getElement("shells.MyPortal");

// 设置返回URL
portal.setBackUrl("/previous-page");

属性

routePath

门户的路由路径，只读属性。

menuTree

合并后的完整菜单树结构。

permConfig

当前的权限配置，可能为"all"或具体的权限对象。

allowAccess

是否允许访问门户的布尔值。

originMenus

原始菜单配置，来自当前门户的feature.json。

extendsMenus

继承的菜单配置，来自父应用的菜单。

高级特性

权限控制

标准门户内置完整的权限管理机制，支持基于角色的菜单访问控制。

配置示例和使用示例

角色权限配置

{
  "roleName": "roles.Manager",
  "shellPerm": {
    "shells.MyPortal": {
      "dashboard": {"pages.Dashboard": "all"},
      "users": {"pages.UserManage": {"read": true, "write": false}}
    }
  }
}

权限检查

import { getRuntimeApp } from 'jit';

const app = getRuntimeApp();
const portal = app.getElement("shells.MyPortal");

// 检查门户访问权限
if (portal.allowAccess) {
    // 获取有权限的菜单
    const permMenus = portal.getPermMenu();
    
    // 获取可用菜单（过滤权限+隐藏+无效）
    const availableMenus = portal.getAvailableMenu();
}

移动端适配

标准门户自动适配移动端，提供原生应用般的用户体验。

配置示例和使用示例

移动端菜单配置

{
  "menus": [
    {
      "name": "dashboard",
      "title": "工作台", 
      "page": "pages.Dashboard",
      "mobilePage": "pages.DashboardMobile",
      "nodeType": "page"
    }
  ]
}

移动端会自动使用mobilePage配置的页面，并提供底部导航栏。

菜单继承与合并

支持从父应用继承菜单配置，并智能合并重复项。门户会自动合并继承菜单和原始菜单，相同name的菜单会被覆盖。

配置示例和使用示例

查看合并结果

import { getRuntimeApp } from 'jit';

const app = getRuntimeApp();
const portal = app.getElement("shells.MyPortal");

// 查看原始菜单
const originalMenus = portal.originMenus;

// 查看继承菜单  
const inheritedMenus = portal.extendsMenus;

// 查看最终合并结果
const finalMenus = portal.menuTree;

主题定制

支持自定义主题配置，实现个性化的视觉效果。

配置示例和使用示例

主题配置

{
  "type": "shells.DefaultType",
  "title": "定制门户",
  "theme": "custom",
  "page": "pages.ShellLeftNavPage"
}

主题文件需要在Type元素的themes目录下提供对应的模板文件。