_function

核心工具函数

1.函数列表

函数名 含义
mapAsyncDatum 「专用」OxHistory执行字典数据操作专用函数。
mapButtons 早起处理optionJsx.extension专用函数。
mapFn 过滤继承属性rx, fn, do专用函数名过滤器。
mapMeta 后端metadata序列化的补充函数。
mapUri uri地址规范化函数。
onApp 记录中追加应用信息的专用函数,和X_APP绑定。
onOp 动态表单配置时按钮事件绑定专用函数。
onRelation 关系计算专用函数。
onRelationIdentifiers 双树模型中计算相关模型标识符专用函数。
onRelationType 关系类型计算专用函数。
onTree 树配置专用处理函数。
toArray 二义性数组读取,近似于Ux.ambArray
toColor 随机生成颜色,Dashboard专用。
toDialog 窗口配置统一生成,服务于<Modal/>
toIdentifier 配置映射计算专用函数,通常处理vector节点。
toModelId modelId转换成identifier再执行toIdentifier函数抽取配置。
toNamespace 名空间计算函数。
toUri uri地址规范化函数,mapUri内部调用了toUri,而且很多地方计算路径也会调用该函数。
upCondition $condition专用比对函数。
upList 列表组件比对函数,除了$query以外还检查列表更新信息。
upLoading $loading加载效果比对函数。
upQuery $query专用比对函数。
upValue 通用值计算比对函数。

Ex中的核心工具类主要服务于Ex(扩展层)和Ox(配置层)的组件,并且大部分不是JavaScript的纯函数,具有一定业务意义。

Methods

(static) mapAsyncDatum(columns, reference) → {Promise.<T>}

「标准」Ex.mapAsyncDatum

1.基本介绍

处理 ASSIST 专用配置数据:

  • DATUM:$render专用处理。
  • DATE:$render专用处理。

特定原则下的表单渲染专用,主要用于渲染历史记录数据,出现了非表格类型的二维数据渲染。

2.特定场景

目前这个方法只在OxHistory组件中使用,主要是收集所有的字典和时间格式信息,生成最终的哈希表,这个哈希表用于填充数据, 通常表格中的字典数据是直接渲染,而OxHistory是新旧值的纵向比对,所以这种情况下,直接使用DATUM渲染会不生效,而且在 渲染过程中,保存的值可能不是主键,而是其他值,所以提供这种配置来完成逆向操作,这种特殊场景有可能会在后期还会用到,于是 提供特定方法mapAsyncDatum来实现其渲染功能。

Parameters:
Name Type Description
columns Array

基本类配置信息

reference Object | ReactComponent

React对应组件引用

Returns:

Promise 专用配置处理

Type
Promise.<T>

(static) mapButtons(extension, reference) → {Array}

Deprecated:
  • Yes

「标准」Ex.mapButtons

1.基本介绍

按钮专用处理,用于处理:optionJsx.extension 配置的专用扩展函数,该函数执行两个步骤:

  1. _parseAction解析标准按钮元素String或Object。
  2. _parseAuthorized解析按钮中的基础权限,配合props中的$action进行计算,执行ACL控制。

该函数是一个旧函数,目前没有地方在使用它,但暂时保留,所以不删除。

Parameters:
Name Type Description
extension Array

扩展按钮配置

reference Object | ReactComponent

React对应组件引用

Returns:

返回最终处理配置数据

Type
Array

(static) mapFun(fnName) → {boolean}

「标准」Ex.mapFn

1.基本介绍

判断哪些函数需要继承(此处只继承三类):

  • rx前缀函数
  • fn前缀函数
  • do前缀函数

2.函数规范

函数名过滤专用函数,Zero Ui中定义了组件函数的基础规范如下:

函数前缀 含义
rx 触发型继承函数,对上层组件而言通常是「2阶」,可生成下层调用的「1阶」函数,父子通讯的专用函数。
fn 普通函数,自由设计。
on 事件函数,通常提供给HTML元素或Ant的元素专用事件。
do 状态标记专用函数,如doDirty, doSubmitting, doLoading等。
ix 内部专用函数,不开放。
Parameters:
Name Type Description
fnName String

函数名称

Returns:

返回判断结果

Type
boolean

(static) mapMeta(data) → {Object}

「标准」Ex.mapMeta

1.基本介绍

处理 data 中的 metadata 字段,强制转换成 Json 格式的数据,在Zero Ui的框架规范中,数据记录参考最初的扩展模块中的规范。

2.核心

正常流程中,后端会直接将metadata字段执行JSON序列化,当前函数则是前端的一个「补充」函数。

Parameters:
Name Type Description
data Object

待处理的输入

Returns:
Type
Object

(static) mapUri(item, $app) → {Object}

「标准」Ex.mapUri

1.基本介绍

处理 item 中的 uri 地址,主要用于处理 EXPAND 类型的菜单路径专用,链接地址会有两种:

  • 基础链接:uri地址 = Z_ROUTE + item.uri。
  • 展开菜单:uri地址 = EXPAND(特殊值)。

2.核心

系统链接地址主要分为下边几种:

含义
$MAIN$ 当前链接的主页地址,对应Z_ENTRY_ADMIN配置的路径。
$SELF$ 当前链接地址,$router中读取。
EXPAND 展开菜单,通常是带有子菜单的上级菜单,可展开,不触发react-router
/xxx/yyy 「标准」普通地址,标准的路径地址,会执行Z_ROUTE + item.uri运算。
Parameters:
Name Type Description
item Object

配置对象信息

$app DataObject

应用对象数据

Returns:

处理过后的对象数据

Type
Object

(static) onApp($inited) → {Object}

「标准」Ex.onApp

1.基本介绍

使用应用数据初始化,自动加载应用配置数据

     let $inited = {};
     $inited.type = "ENTITY";
     const form = Ex.yoForm(this, null, Ex.onApp($inited));

本函数追加的核心字段

字段名 含义
appName 应用程序名称,直接从Ux.isInit()获取的数据中读取。
namespace 当前应用名空间,暂时使用cn.originx.前缀,调用toNamespace方法(后期会修正和更改)。
active 是否激活当前记录,如果不包含active则默认为true。

2.核心点

此处最重要的一点就是namespace的计算,该名空间的计算目前使用固定值cn.originx.前缀,后期考虑使用环境变量或者其他手段进行计算和配置。

在Ox平台开第二个应用时候,名空间的计算会纳入到开发计划中,主要牵涉I_API/I_JOB/I_SERVICE三张表的数据读取。

Parameters:
Name Type Description
$inited Object

初始化应用数据

Returns:

返回最终数据

Type
Object

(static) onOp(reference, metadata) → {function}

「标准」Ex.onOp

1.基本介绍

动态渲染流程中,执行按钮事件绑定的专用函数,用来绑定按钮触发的事件信息。

const $op = {};
Object.keys(event)
     .forEach(opKey => $op[opKey] = Ex.onOp(reference, event[opKey]));
state.$op = $op;

2.数据结构

2.1.配置信息

传入的第二参数metadata结构如下:

{
    "event": "事件名称",
    "config": {

    }
}

2.2. 事件表

事件名 说明
event.filter 搜索表单专用函数,触发查询条件的更新。
event.add 添加表单提交函数。
event.save 更新表单提交函数。
event.delete 删除表单提交函数。
Parameters:
Name Type Description
reference Object | ReactComponent

React对应组件引用

metadata Object

元数据配置信息

Returns:

返回事件函数

Type
function

(static) onRelation(current, config, $defineMap) → {Object}

「标准」Ex.onRelation

1.基本介绍

计算关系专用函数,该函数可计算两种关系:

  • 传入$defineMap:执行关系定义的计算,对应M_RELATION表。
  • 未传入$defineMap:执行关系数据的计算(实际关系),在目前CMDB中则是RL_DEVICE_RELATION表。

2.字段说明

在CMDB的关系计算中,关系主要分为两部分(上游和下游)

  • up:上游关系
  • down:下游关系

此处的config中的updown存储了上下游关系计算时的基础配置数据(元数据)。

Parameters:
Name Type Description
current Object

当前节点的关系处理

config Object

上下游专用配置处理

$defineMap Object

定义的关系关联数据

Returns:

分组过后的关系信息

Type
Object

(static) onRelationIdentifiers(identifier, source, definition) → {Object}

「标准」Ex.onRelationIdentifiers

1.基本介绍

计算关系的 identifier 专用函数,返回的数据结构如:

{
    "up": [],
    "down": []
}
  • up: 上游关系数据。
  • down: 下游关系数据。

2.函数代码流程

  1. 先从X_CATEGORY分类表中(每一个分类对应一个identifier)提取和传入模型标识符匹配的分类数据。
  2. 读取当前模型标识符的所有父类(包括祖辈)直到根节点。
  3. 展开树中检索和当前模型标识符匹配的节点(二次计算)。
  4. 计算相关的所有上游下游数据信息。

3.关系结构

整体的关系结构如:

    A     -------   B
   / \             / \
  A1  A2          B1  B2

如上图结构中

  1. 若计算A2B
    1. A2到B
    2. A到B
  2. 若计算A2B1
    1. A2到B
    2. A2到B1
    3. A到B1
    4. A到B

计算两个节点之间关系时,实际上是两颗树之间任意节点的关联计算(两两计算,只要有定义就计算)。

Parameters:
Name Type Description
identifier String

统一标识符

source Array

关系数据源

definition Array

关系定义数据源

Returns:

返回关系数据对象

Type
Object

(static) onRelationType(reference, record) → {undefined|Object}

「标准」Ex.onRelationType

1.基本介绍

计算关系类型专用函数,根据关系定义计算当前关系的类型。

2.类型表

CMDB系统定义的关系类型如:

类型值 类型名
containment 包含
deployed 运行于
connection 连接
dependency 依赖
Parameters:
Name Type Description
reference Object | ReactComponent

React对应组件引用

record Object

当前数据记录

Returns:

返回唯一关系值

Type
undefined | Object

(static) onTree(keys, data, config) → {Array}

「标准」Ex.onTree

1.基本介绍

树形菜单专用处理函数

     const calculated = Ex.onTree(selected, data, {
         mode: $selection.mode,
         tree: config.tree,
     });

2.基础结构

2.1.树结构

参考Ux.toTreeArray文档。

2.2.树选择

选择模式参考Ux.Tree文档。

Parameters:
Name Type Description
keys Array

配置数据信息

data Array

树相关数据源

config Object

树相关配置

Returns:

返回最终树信息

Type
Array

(static) toArray(data) → {Array}

「标准」Ex.toArray

1.基本介绍

DataArray和Array的统一数据处理,返回最终的 Array 数组,该方法类似于 Ux.ambArray方法,但判断条件不同。

2.核心

2.1.判断条件

  1. Ux.ambArray中判断使用了data instanceof DataArray
  2. Ex.toArray中判断则使用了Ux.isFunction(data.to),因为它包含了to()方法。
Parameters:
Name Type Description
data any

输入数据

Returns:

最终返回数组

Type
Array

(static) toColor(current, mode) → {WebColor}

「标准」Ex.toColor

1.基本介绍

随机读取一个颜色信息,这个方法主要用在Dashboard上。

  1. 如果传入 current,则读取 current 上的颜色信息。
  2. 如果不传入 current,则随机读取颜色信息。
Parameters:
Name Type Default Description
current Number

索引数据

mode String KFC_8

模式

Returns:

返回颜色值

Type
WebColor

(static) toDialog(dialog) → {Object}

「标准」Ex.toDialog

1.基本介绍

直接执行dialog参数的合并,用来生成<Modal/>的基础配置

{
    content: "传入配置效果"
}
Parameters:
Name Type Description
dialog Object

窗口专用配置

Returns:

处理后的配置

Type
Object

(static) toIdentifier(config, program) → {String}

「标准」Ex.toIdentifier

1.基本介绍

根据传入配置计算统一标识符

  1. __DEFAULT__:默认的统一标识符,如果不存在则使用该值。
  2. __PATTERN__:执行 format 专用表达式解析转换。

如果传入配置解析不了modelId

2.核心点

这个方法主要用于读取不同模型标识符对应的配置,通常格式如:

{
     "__DEFAULT__": "120a1719-ba5b-4b45-9768-dddf7048b186",
     "ci.device": "120a1719-ba5b-4b45-9768-dddf7048b186",
     "ci.server": "38ba3c92-0fa7-4df0-9c6c-2a9b33822107",
     "ci.application": "fc452465-3735-4227-a911-b2080b18ce10",
     "ci.business": "3168a6ea-9c4d-40ed-8c6c-ec3122da0ee4",
     "ci.database": "35303c14-de93-4978-a29b-b523fb0aefcb",
     "ci.middleware": "8b4c140c-9fa5-4d5d-8254-ea868d3e72ad",
     "...":"..."
}

上述转换内容如:

  1. 读取的都是配置的核心主键,如UI_CONTROL中的主键。
  2. 读取的表单唯一值,如UI_FORM中的code(借用__PATTERN__配置)。
Parameters:
Name Type Description
config Object

基本配置信息

program String

编程专用配置信息,传入的identifier

Returns:

返回最终的统一标识符

Type
String

(static) toModelId(reference, field) → {String}

「标准」Ex.toModelId

1.基本介绍

module 中提取配置信息,并执行 identifier 的计算。

2.核心

2.1.内部调用

内部调用了toIdentifier执行最终操作。

2.2.数据源

  • 配置数据:X_MODULE中定义了提取数据的字段信息以及配置信息。
  • 配置抽取:直接从$inited数据中提取modelId作为模型标识符的提取基础。
Parameters:
Name Type Description
reference Object | ReactComponent

React对应组件引用

field String

字段信息

Returns:

返回最终的模型ID(统一标识符计算值)

Type
String

(static) toNamespace(reference) → {string|undefined}

「标准」Ex.toNamespace

1.基本介绍

名空间计算

  1. 传入是 string, 直接来
  2. 传入是 非 string,走 React

2.核心

2.1.关于多租户

  1. 一个应用只有一个名空间,所以这个维度和租户维度有些区别。
  2. 租户维度依靠sigma执行,应用维度依靠appId
  3. 名空间和appId执行绑定,一个应用只能有一个名空间。
Parameters:
Name Type Description
reference Object | ReactComponent

React对应组件引用

Returns:

返回合法名空间

Type
string | undefined

(static) toUri(uri, $app) → {string}

「标准」Ex.toUri

1.基本介绍

  1. Uri专用配置处理,构造路径信息,根据Z_ROUTE来计算最终的路径信息。
  2. 计算过程中,还根据路径前缀,执行去/符号的特殊操作(规范化)。
Parameters:
Name Type Description
uri String

原始路径信息

$app DataObject

应用程序对象

Returns:

返回最终的Uri信息

Type
string

(static) upCondition(state, prevState) → {Object}

「标准」Ex.upCondition

检查 $condition 状态信息,计算最终状态值:

{
    original: "原始状态",
    current: "新状态"
}
Parameters:
Name Type Description
state State

当前状态

prevState State

之前状态

Returns:

返回计算后的状态信息

Type
Object

(static) upList(props, prevProps) → {Object}

「标准」Ex.upList

检查 $options, $identifier 状态信息,计算最终状态值:

{
    original: "原始属性",
    current: "新属性"
}

移除 component 相关配置信息

  1. 解决第一次多选闪屏的问题
  2. 在切换页面的过程中,实际上 component 的改动不重要,因为 component 应该在两种情况彻底更改
    • $options 发生变更
    • $identifier 发生变更

二者是从属关系,所以在 rxPostSelected 触发时,保证不闪屏,所以不检查 component

Parameters:
Name Type Description
props Props

当前树形

prevProps Props

之前树形

Returns:

返回计算后的状态信息

Type
Object

(static) upLoading(state, prevState) → {Object}

「标准」Ex.upLoading

检查 $loading 状态信息,计算最终状态值:

{
    original: "原始状态",
    current: "新状态"
}
Parameters:
Name Type Description
state State

当前状态

prevState State

之前状态

Returns:

返回计算后的状态信息

Type
Object

(static) upQuery(state, prevState) → {Object}

「标准」Ex.upQuery

检查 $query 状态信息,计算最终状态值:

{
    original: "原始状态",
    current: "新状态"
}
Parameters:
Name Type Description
state State

当前状态

prevState State

之前状态

Returns:

返回计算后的状态信息

Type
Object

(static) upValue(state, prevState, key) → {Object}

「标准」Ex.upValue

检查输入的 key 状态信息,计算最终状态值:

{
    original: "原始状态",
    current: "新状态"
}
Parameters:
Name Type Description
state State

当前状态

prevState State

之前状态

key String

状态值

Returns:
Type
Object