路由管理

基于iBizHUB运行的应用采用单页应用(SPA)架构，所有页面跳转均在浏览器端完成，无需重复请求服务端获取HTML。HTML仅在应用初始化时加载一次，路由功能基于Vue Router实现并扩展。

名词解释

在介绍iBizHUB的路由机制之前，我们首先有必要了解2个概念，应用上下文和视图参数。

应用上下文

应用上下文是贯穿应用运行的核心数据链路，为当前视图提供完整的业务层级关系和访问控制依据。它通过标准化的路径结构维护从应用入口到具体页面的完整访问链，确保每个视图都能准确识别自身在业务架构中的位置，上下文作为业务资源的导航坐标系，既定义了视图的定位规则，也约束了数据的流动边界。其实现方式可基于不同技术栈，但核心要维持统一的上下文管理协议，最终形成具有明确业务语义的资源访问树。

应用上下文由三部分构成：

1. 基础上下文：应用初始化时注入，包含用户身份信息等数据

2. 路由上下文：通过路由参数动态生成，携带业务关系链

3. 扩展上下文：由具体视图组件扩展，通过配置自定义导航上下文来支持业务场景定制化

视图参数

视图参数是视图层级的局部环境变量，用于定义当前视图的特定业务行为和数据规则。与贯穿应用层级的应用上下文不同，仅在当前视图实例内有效，通过配置自定义导航视图参数来支持业务场景定制化。典型应用包括配置数据表格的查询条件、设置表单的初始值或控制UI组件的展示逻辑。

路由规则

非模态路由

// 非模态路由
/:appContext/:view1/:params1/:view2/:params2/:view3/:params3

• 实现方式：通过RouterShell组件解析
• 视图渲染：使用parseRouteViewData解析数据后直接绘制

模态路由

// 模态路由
/:appContext/:view1/:params1/route-modal/:modalView/:modalParams

• 实现方式：通过ModalRouterShell组件解析
• 视图渲染：使用parseRouteViewData解析数据后以模态弹窗形式展示

路由参数

路径参数	格式	说明
appcontext	a=111;b=333	应用上下文
view1/view2/view3/...	-	视图名称小写
route-modal	-	固定标识，指定modalView视图以模态弹框形式打开
params1	a=111;b=333	首页后面一级视图打开时所计算的路由上下文，格式为a=111;b=333
params2/.../modalParams	a=111;b=333;srfnavctx=${objstr};srfnav=xxxx	视图自身参数，包含当前视图的应用上下文、额外导航参数和视图参数

视图自身参数详解：

• srfnavctx：视图自身独有的 应用上下文，其中objstr是满足格式如encodeURIComponent(JSON.stringify({a:11,b:222}))的字符串
• srfnav：额外导航参数，这个参数既不属于视图上下文，也不属于视图参数,常用于导航视图回显选中，如树导航视图是放的选中节点的id，用于树回显选中
• 除srfnavctx和srfnav之外，其它参数均为视图的 视图参数

路由案例

iBizPLM（软件生命周期管理）为例，说明路由参数：

// route路由
const fullPath = 'https://plm.ibizlab.cn/ibizplm-plmweb/#/-/index/project=0a00f7c7-309d-b8f9-9194-083ccb34e8f8/project_scrum_index_view/srfnavctx=%257B%2522srfnavctrlid%2522%253A%2522plmweb.project_all_grid_view%2540plmweb.project.main%2522%252C%2522srfnavlogicid%2522%253A%25222a598790-5bb2-424e-92b4-85a4092775f5%253Ad9a0dcda-cbe4-b272-9108-2558f05875d5%2522%257D;srfnav=usrdrgroup1225359915/work_item_dyna_srcum_tree_grid_view/project_type=scrum;srfnavctx=%257B%2522srfdefaulttoroutedepth%2522%253A3%257D

根据路由规则解析路由参数：

view1：'index'
params1：'project=a1becb81-3dc3-6bb2-6a33-48a7a3ce71b2'
view2：'project_scrum_index_view'
params2：'srfnavctx=%257B%2522srfnavctrlid%2522%253A%2522plmweb.project_all_grid_view%2540plmweb.project.main%2522%252C%2522srfnavlogicid%2522%253A%25222f79da3c-07aa-8836-d39c-964c78a83e73%253A066350af-1424-24b2-4e38-786a0765e9ef%2522%257D;srfnav=usrdrgroup1225359915'
view3：'work_item_dyna_srcum_tree_grid_view'
params3：'project_type=scrum;srfnavctx=%257B%2522srfdefaulttoroutedepth%2522%253A3%257D'

// 通过内置的路由解析工具即可得到view2和view3的上下文和视图参数
// project_scrum_index_view
// 路由上下文
const context = {
    project：'0a00f7c7-309d-b8f9-9194-083ccb34e8f8',
    srfnavctrlid: 'plmweb.project_all_grid_view@plmweb.project.main',
    srfnavlogicid: '2a598790-5bb2-424e-92b4-85a4092775f5:d9a0dcda-cbe4-b272-9108-2558f05875d5'
}
// 视图参数
const params = {}

// work_item_dyna_srcum_tree_grid_view
// 路由上下文
const context = {
    srfdefaulttoroutedepth: 3,
    project：'0a00f7c7-309d-b8f9-9194-083ccb34e8f8',
    srfnavctrlid: 'plmweb.project_all_grid_view@plmweb.project.main',
    srfnavlogicid: '2a598790-5bb2-424e-92b4-85a4092775f5:d9a0dcda-cbe4-b272-9108-2558f05875d5'
}
// 视图参数
const params = {
    project_type: 'scrum',
    srfcurtime: '1745925951297'
}

路由守卫

在访问应用时，会触发权限校验，逻辑流程如下：

• 访问首页时触发权限校验
• 检查是否为匿名访问，进行匿名相关的校验和处理
• 获取应用初始化数据并加载用户组织信息
• 初始化应用模型，加载用户主题偏好的多语言配置
• 异常处理：权限校验失败时跳转登录页

路由生成与解析

iBiz在核心包@ibiz-template/vue3-util中提供了路由生成和解析的工具方法：

/**
 * 生成路由路径
 *
 * @export
 * @param {IViewConfig} appView 视图模型
 * @param {Route} route 路由对象
 * @param {IContext} context 应用上下文
 * @param {IParams} [params] 视图参数
 * @return {*}  {Promise<{ path: string }>}
 */
function generateRoutePath(
  appView: IViewConfig,
  route: Route,
  context: IContext,
  params?: IParams,
): Promise<{ path: string }> 

/**
 * 解析路由获取对应视图数据
 *
 * @export
 * @param {Route} route 路由对象
 * @param {number} depth 视图层级
 * @param {boolean} [isRouteModal=false] 是否为模态路由
 * @return {*}  {Promise<IRouteViewData>}
 */
function parseRouteViewData(
  route: Route,
  depth: number,
  isRouteModal: boolean = false,
): Promise<IRouteViewData>