amis中条件组合器condition-builder的使用 和 解析

1.amis中配置一个条件组合器,condition-builder。并根据自己业务需求配置source。这里用了一些自定义filter来进行预处理。


{"type": "condition-builder","label": "条件组合","name": "node.conditions","description": "","source": "${m.config|doTree:undefined:'dataType,name':'this.utils.convertCondField(item); if((item.children && item.children.length)) {item.disabled=true;}'}","id": "u:91c6f78eb6c4","selectMode": "tree","searchable": true}

source表达式中用到的部分函数如下:

  //根据不同的数据类型,使用condition-builder中不同的组件类型来展示。

 function convertCondField(item){ switch (item.dataType) {case "string":item.type = 'text';break;case "bool": // 0 or 1case "bit": _.merge(item, {"type": "custom","value": {"type": "switch","trueValue": 1,"falseValue": 0},"operators": ["equal","not_equal"]})break;case "float":case "double":item.type = 'number';item.step = 0.01break;default:item.type = 'number';break;}}

  //doTree filter函数定义

  function doTree(arr, filter, extraParams, callback) { // 支持lodash断言过滤.  函数断言传入字符串形式: 'return (n)=>{ return n.enable }'  |   ${m.children|doTree:{nodeClass:'state'}}return _.map(filter !== undefined ? _.filter(arr, filter) : arr, (n) => {const result = {label:n["label"] ||n["title"] ||n["browseName"] ||n["displayName"],value: n["name"] || n["value"],};_.forEach(extraParams, extraParam => {result[extraParam] = n[extraParam];});if (n.children) {result.children = doTree(n.children, filter, extraParams, callback);} else {result.disabled = false;}try{callback && callback(result);}catch(e){console.error(e)}return result;});}

  //注册doTree进入到filter中

  amisLib.registerFilter('doTree', function (arr, filter, extraParams, callback) {this.utils = utils;filter = resolveFilter(filter);extraParams = extraParams?.split(",");callback = callback ? new Function('item', callback).bind(this) : callback;return doTree(arr, filter, extraParams, callback);});

source最终生成结果如下:

[{"label": "冷热源系统","value": "冷热源系统","name": "冷热源系统","children": [{"label": "主机","value": "冷热源系统.主机","name": "冷热源系统.主机","children": [{"label": "1号主机","value": "冷热源系统.主机.1号主机","name": "冷热源系统.主机.1号主机","children": [{"label": "冷冻水供水温度","value": "冷热源系统.主机.1号主机.冷冻水供水温度","dataType": "short","name": "冷热源系统.主机.1号主机.冷冻水供水温度","disabled": false,"type": "number"},{"label": "冷冻水回水温度","value": "冷热源系统.主机.1号主机.冷冻水回水温度","dataType": "short","name": "冷热源系统.主机.1号主机.冷冻水回水温度","disabled": false,"type": "number"},{"label": "冷却水出口温度","value": "冷热源系统.主机.1号主机.冷却水出口温度","dataType": "short","name": "冷热源系统.主机.1号主机.冷却水出口温度","disabled": false,"type": "number"},{"label": "累计制冷量","value": "冷热源系统.主机.1号主机.累计制冷量","dataType": "float","name": "冷热源系统.主机.1号主机.累计制冷量","disabled": false,"type": "number","step": 0.01},{"label": "COP","value": "冷热源系统.主机.1号主机.COP","dataType": "short","name": "冷热源系统.主机.1号主机.COP","disabled": false,"type": "number"},{"label": "累计耗电量","value": "冷热源系统.主机.1号主机.累计耗电量","dataType": "float","name": "冷热源系统.主机.1号主机.累计耗电量","disabled": false,"type": "number","step": 0.01},{"label": "方法","value": "冷热源系统.主机.1号主机.方法","name": "冷热源系统.主机.1号主机.方法","disabled": false,"type": "number"}],"type": "number","disabled": true}],"type": "number","disabled": true}],"type": "number","disabled": true}
]

2.选中条件选择器之后的amis json结构如下:

const conditions = {"id": "a6dbc0b12fe6","conjunction": "and","children": [{"id": "f5d7bc47bec9","left": {"type": "field","field": "冷热源系统.主机.1号主机.冷冻水供水温度"},"op": "less","right": 50}]
}

//封装data数据

const fact = {['冷热源系统.主机.1号主机.冷冻水供水温度']: 28['冷热源系统.主机.1号主机.累计制冷量']: 50.08
}


3.后端校验condition是否为true。

 3-1.由于nodejs端兼容性问题,不能直接引入amis-core来使用,需将amis源码amis-core/src/utils 放到 common/amisUtils中(主要是resolveCondition.ts相关文件)。并移除了部分不兼容的代码,如dom.tsx等。

npm install typescript -g

根目录下创建tsconfig.json:

{"compilerOptions": {"target": "es5","forceConsistentCasingInFileNames": true,"allowSyntheticDefaultImports": true,"esModuleInterop": true,// 转换为cjs语法时,fix (0 , assign_1.default) is not a function 问题。 //会加入一个__importDefault来解决此问题。如下:var __importDefault = (this && this.__importDefault) || function (mod) { return (mod && mod.__esModule) ? mod : { "default": mod }; };"module": "commonJS","jsx": "react","declaration": true,"sourceMap": true,"experimentalDecorators": true,"skipLibCheck": true,"typeRoots": ["./node_modules/@types"],"types": ["node","lodash"],"lib": ["es5","dom","es2015.collection"]}
}

tsc // 编译common/amisUtils为cjs格式。

3-2.使用resolveCondition对conditions条件进行判定:

const { resolveCondition, resolveConditionAsync } = require('../common/amisUtils');let result = resolveCondition(conditions, fact, false);
console.log(result); //输出结果为true

ps:前端校验condition是否为true:

const { resolveCondition } = amisRequire("amis");
let result = resolveCondition(conditions, fact, false);
console.log(result); //输出结果为true

本文来自互联网用户投稿,该文观点仅代表作者本人,不代表本站立场。本站仅提供信息存储空间服务,不拥有所有权,不承担相关法律责任。如若转载,请注明出处:http://www.mzph.cn/pingmian/40474.shtml

如若内容造成侵权/违法违规/事实不符,请联系多彩编程网进行投诉反馈email:809451989@qq.com,一经查实,立即删除!

相关文章

Python 插入、替换、提取、或删除Excel中的图片

Excel是主要用于处理表格和数据的工具,我们也能在其中插入、编辑或管理图片,为工作表增添视觉效果,提升报告的吸引力。本文将详细介绍如何使用Python操作Excel中的图片,包含以下4个基础示例: 文章目录 Python 在Excel…

.NET 漏洞情报 | 某整合管理平台SQL注入

01阅读须知 此文所提供的信息只为网络安全人员对自己所负责的网站、服务器等(包括但不限于)进行检测或维护参考,未经授权请勿利用文章中的技术资料对任何计算机系统进行入侵操作。利用此文所提供的信息而造成的直接或间接后果和损失&#xf…

AI-算力集群通往AGI

背景: 自GPT-4发布以来,全球AI能力的发展势头有放缓的迹象。 但这并不意味着Scaling Law失效,也不是因为训练数据不够,而是结结实实的遇到了算力瓶颈。 具体来说,GPT-4的训练算力约2e25 FLOP,近期发布的几个…

驱使ai学习搭子,写出一份“完美”的代码“文档”

自己把控“核心关键”,ai会把文档写得比您预想的“完美”。 (笔记模板由python脚本于2024年07月04日 10:44:39创建,本篇笔记适合喜欢结伴ai学习的coder翻阅) 【学习的细节是欢悦的历程】 Python 官网:https://www.python.org/ Free&#xff…

PHP房产小程序微信小程序系统源码

🏠—— 购房租房,一“指”搞定🏡 🔍【开篇:房产新视界,尽在掌握】 在这个信息爆炸的时代,找房子不再是一场漫长的奔波。有了“房产微信小程序”,无论是购房还是租房,都…

【PCIe】P2P DMA

PCIe P2P (peer-to-peer communication)是PCIe的一种特性,它使两个PCIe设备之间可以直接传输数据,而不需要使用主机RAM作为临时存储。如下图3的走向 比如EP1要发送和数据给EP2,操作流程如下: 1. 打开EP1的dma控制器;--client侧 …

配置jupyter时出现问题?怎么办?

在自己创建的虚拟环境(nmjpytorch)安装完jupyter,没有跳转到链接,问题如图: 解决方法: 1、查看自己的tornado版本为5.1.1,坑太高了,降低版本为4.5.3 2、卸载tornado-5.1.1 3、安装t…

firewalld(7)NAT、端口转发

简介 在前面的文章中已经介绍了firewalld了zone、rich rule等规则设置,并且在iptables的文章中我们介绍了网络防火墙、还有iptables的target,包括SNAT、DNAT、MASQUERADE、REDIRECT的原理和配置。那么在这篇文章中,将继续介绍在firewalld中的NAT的相关配…

git常用命令速查表

Git相关概念简述 版本库:git在本地开辟的一个存储空间,一般在 .git 文件里。工作区(workspace): 就是编辑器里面的代码,我们平常开发直接操作的就是工作区。暂存区(index/stage):暂时存放文件的…

如何用Python实现三维可视化?

Python拥有很多优秀的三维图像可视化工具,主要基于图形处理库WebGL、OpenGL或者VTK。 这些工具主要用于大规模空间标量数据、向量场数据、张量场数据等等的可视化,实际运用场景主要在海洋大气建模、飞机模型设计、桥梁设计、电磁场分析等等。 本文简单…

告别写作难题,这些AI写作工具让你文思泉涌

在现实生活中,除了专业的文字工作者,各行各业都避免不了需要写一些东西,比如策划案、论文、公文、讲话稿、总结计划……等等。而随着科技的进步,数字化时代的深入发展,AI已经成为日常工作中必不可少的工具了&#xff0…

学习LLM的随笔

1、信息量、信息熵、交叉熵和困惑度 注:因为真实分布的概率为1,所以在分类任务中交叉熵可以简化为上述形式。 (1)信息熵:信息熵中使用 l o g 2 ( p ( x ) ) log_2(p(x)) log2​(p(x)) 来表示对 x x x 编码需要的…

Linux Vim 最全面教程(Linux)

文章目录 前言一、vim工作模式1、命令模式2、编辑模式3、末行模式 二、常用其他按键说明总结 前言 vim是一款功能文本编辑器,也是早年vi编辑器的加强版,它的最大特色就是使用命令进行编辑,完全脱离了鼠标的操作。代码补全、编译和错误跳转等…

二叉树基础

一.树 1.树的定义 在计算机科学中,树是一种用于表示层次结构的抽象数据类型和非线性数据结构。树由一组节点(Nodes)和节点之间的关系(通常通过边表示)组成。 2.特性 树是一种递归的数据结构:树可以定义为…

论文学习笔记1:Federated Graph Neural Networks: Overview, Techniques, and Challenges

文章目录 一、introduction二、FedGNN术语与分类2.1主要分类法2.2辅助分类法 三、GNN-ASSISTED FL3.1Centralized FedGNNs3.2Decentralized FedGNNs 四、FL-ASSISTED GNNS4.1horizontal FedGNNs4.1.1Clients Without Missing Edges4.1.1.1Non-i.i.d. problem4.1.1.2Graph embed…

超详细!大模型面经指南(附答案)

目录 大模型(LLMs)基础面 1. 目前 主流的开源模型体系 有哪些? 2. prefix LM 和 causal LM 区别是什么? 3. 涌现能力是啥原因? 4. 大模型LLM的架构介绍? 大模型(LLMs)进阶面 1. l…

3d模型成组后可以弯曲嘛?---模大狮模型网

在展览3D模型设计领域,创新与技术不断推动着模型的复杂性和功能性。一个常见的问题是,当3D模型成组后,是否可以灵活地弯曲或调整形态?本文将深入探讨这一问题,并探索现代设计中的可能性与挑战。 一、灵活性与设计需求 3D模型在展…

小白学webgl合集-绘制有透视颜色不一样的立方体

效果 原理 结合透视矩阵和视觉矩阵进行绘制 知识点 01透视矩阵 透视矩阵将视图空间中的坐标转换为裁剪空间中的坐标,使得更远的物体看起来更小。 function perspectiveMatrix(fov, aspect, near, far) {const f 1.0 / Math.tan(fov / 2);const nf 1 / (near …

德旺训练营称重问题

这是考小学的分治策略,小学的分治策略几乎都是分三组。本着这个策略,我们做看看。 第一次称重: 分三组,16,16,17,拿两个16称,得到A情况,一样重,那么假铜钱在那组17个里面。B情况不…

亚马逊SC账号升级VC账号的新浪潮已然席卷整个电商界!

当前电商市场竞争激烈,亚马逊卖家追求业务增长。现有Amazon SC账号卖家有机会升级为VC账号,提供重要机遇。 SC账号是亚马逊常见卖家类型,为众多个人和企业提供销售平台。而VC账号则代表与亚马逊更紧密的合作关系,享有更多优惠、广…