序篇

相关推荐

• Oinone 7天入门到精通

  4.2.8 自定义组件与设计器结合（新）

  界面设计器组件管理页面添加组件 进入组件的元件管理页面 点击“添加元件” 设计元件的属性 这里以是否“显示清除按钮”作为自定义属性从左侧拖入到中间设计区域，然后发布 点击“返回组件” 鼠标悬浮到卡片的更多按钮的图标，弹出下拉弹出“低无一体”的按钮 在弹窗内点击“生成SDK”的按钮 生成完成后，点击“下载模板工程” 解压模板工程kunlun-sdk.zip 解压后先查看README.MD，了解一下工程运行要点，可以先运行 npm i 安装依赖 再看kunlun-plugin目录下已经有生成好的组件对应的ts和vue文件 下面在vue文件内增加自定义代码，可以运行 npm run dev 在开发模式下调试看效果 <template> <div class="my-form-string-input"> <oio-input :value="realValue" @update:value="change" > <template #prepend>MyPrepend</template> </oio-input> </div> </template> <script lang="ts"> import { defineComponent, ref } from 'vue'; import { OioInput } from '@kunlun/vue-ui-antd'; export default defineComponent({ name: 'customField1', components: { OioInput }, props: { value: { type: String }, change: { type: Function }, }, setup(props) { const realValue = ref<string | null | undefined>(props.value); return { realValue }; } }); </script> <style lang="scss"> .my-form-string-input { border: 1px solid red; } </style> 确定改好代码后运行 npm run build，生成上传所需的js和css文件 可以看到 kunlun-plugin目录下多出了dist目录，我们需要的是 kunlun-plugin.umd.js 和 kunlun-plugin.css 这2个文件 再次回到组件的“低无一体”管理弹窗页面，上传上面生成的js和css文件，并点击“确定”保存，到这里我们的组件就新增完成了。 下面我们再到页面设计器的页面中使用上面设计的组件（这里的表单页面是提前准备好的，这里就不介绍如何新建表单页面了） 将左侧组件库拉直最底部，可以看到刚刚新建的组件，将其拖至中间设计区域，我们可以看到自定义组件的展示结果跟刚刚的代码是对应上的（ps: 如果样式未生效，请刷新页面查看，因为刚刚上传的js和css文件在页面初始加载的时候才会导入进来，刚刚上传的动作未导入新上传的代码文件），再次点击设计区域中的自定义组件，可以看到右侧属性设置面板也出现了元件设计时拖入的属性。 最后再去运行时的页面查看效果，与代码逻辑一致！

  史, 昂

  2024年5月23日

  1.1K000
• Oinone 7天入门到精通

  7.3.2 原业务加审批流程

  场景说明 场景描述：全员营销标准产品的功能并未有任务发放的审批流，在实际执行中，当营销专员配置好任务后，需部门领导对整个活动如该任务内容、形式、参与人员进行审批。 业务需求：在发布任务这个流程中增加审批节点。 实战训练 Step1 原业务分析 点击菜单【任务中心】通过URL上的model参数找到对应模型编码为【gemini.biz.GeminiTaskProxy】 进入模型设计器主页面，应用选择【全员营销】、选择【系统模型】、通过搜索关键字【任务】选择【Gemini任务代理】，展示方式从图模式切换到表单模式，对比【模型编码】 但目前模型为代理模型，代理模型是用于代理存储模型的数据管理器能力，同时又可以扩展出非存储数据信息的交互功能的模型。因为在代理模型中新增的字段都是非存储字段，所以如果要增加【审核状态】的字段一定以要在存储模型增加。其父模型的查看有两种方式 表单模式下可以直接看父模型 在图模式和表单模式下点击继承关系 点击【Gemini任务】，进入【Gemini任务】的模型设计界面，可以看出该模型所在模块为【全员营销核心业务】，从【系统字段】中找到【任务状态】字段，点击查看字段详情，我们可以看到【业务类型】为数据字典，字典类型为【任务状态】。 在模型设计器的管理页面上方点击【数字字典】选项卡，模块选择为【全员营销核心业务】，选择【系统字典】就可以查看到【任务状态】数字字典 总结如下： 给【Gemini任务】模型增加一个【任务审批状态】，记录审批状态 在任务创建的时候，修改【任务状态】为【关闭】确保任务未审批通过的时，用户无法操作该任务。 审批通过后，恢复【任务状态】为【初始化】 我们先来整理下核心流程即：任务审批流程。 Step2 利用模型设计器设计模型 在模型设计器的管理页面上方点击【数字字典】选项卡，模块选择为【全员营销核心业务】，点击添加【数据字典】按钮，设置对应数据项 设置【字典名称】为【审批状态】 设置【字典项类型】为【文本】 通过【添加数据字典项】按钮增加对应数据字典项，如审核中、审核失败、审核成功 在模型设计器的管理页面上方点击【模型】选项卡，模块选择为【全员营销核心业务】，选择【系统模型】、搜索任务选择【Gemini任务】，点击添加字段 为模型【Gemini任务】添加字段 设置【字段名称】为【任务审批状态】 设置【字段业务类型】为数据字典，并选择关联数据字典为【任务审批状态】 最后点击【创建】按钮完成操作 回到【Gemini任务】设计区，我们可以看到在模型的【自定义字段】选项卡下方多了一个【任务审批状态】字段 Step3 利用界面设计器，设计出必要的审核页面 进入界面设计器，应用选择全员营销，模型选择【Gemini任务】，点击添加页面下的直接创建 设置页面标题、模型（自动带上可切换）、业务类型（运营管理后续会扩展其他类型）、视图类型（表单）后点击确认按钮进入【Gemini任务】表单设计页面 进入页面设计器，对【Gemini任务】表单页面进行设计（更多细节介绍，请参考界面设计产品使用手册） 左侧为物料区：分为组件、模型。 【组件】选项卡下为通用物料区，我们可以为页面增加对应布局、字段（如同在模型设计器增加字段）、动作、数据、多媒体等等 【模型】选项卡下为页面对应模型的自定义字段、系统字段、以及模型已有动作 中间是设计区域 右侧为属性面板，在设计区域选择中组件会显示对应组件的可配置参数 在左侧【组件】选项卡下，拖入布局组件【分组】，并设置组件【标题属性】为基础信息 在左侧【模型】选项卡下，分别系统字段中的【任务标题】、【任务开始时间】、【任务结束时间】、【视频标题】、【视频风格】、【任务描述】拖入【基础信息】分组，并点击【任务描述】，在右侧属性面板的【交互】分组中设置宽度为1。最后别忘了点击【发布】按钮完成页面的发布 Step4 通过流程设计器，设计对应业务流程 进入流程设计器，点击【创建】按钮 注意：流程中需要获取【关系字段】的除关联字段(一般为ID)以外的字段需要通过【数据获取】节点单独获取【关系字段】的对象数据。所以在流程设计中经常会用到【数据获取】节点 左上角编辑流程名称为【任务审批流程】，点击第一个【触发】节点，触发方式选择模型触发，模型选择【Gemini任务】，触发场景选择【新增或更新数据时】，【筛选条件】设置为【任务审批状态】为空或【任务审批状态】等于【审核中】，点击该节点的【保存】按钮 点击流程图节点间的【+】图标选择增加【获取数据】节点，或者拖动左侧物料区【获取数据】到特定的【+】图标 点击【获取数据】，在右侧属性面板中设置【获取数据条数】为多条，选择模型为【Gemini用户任务实例】，点击【筛选条件】的【{X}】图标，进行数据获取的条件设置 选择条件字段为【任务ID】条件操作符为【等于】，条件为变量的导购字段的ID。当上下文只有一个变量时默认不需要选择，这里默认的是【模型触发：[Gemini任务]】，设置好以后点击确认，回到属性面板设置【未获取到数据时执行方式】为【终止流程】，并点击节点【保持】按钮 增加【更新数据】节点，在右侧属性面板中 【更新模型】选择【模型触发：[Gemini任务]】 【字段列表】点击【创建】按钮 字段选择 更新【任务状态】字段 表达式设置为：【已关闭】。 【字段列表】点击【创建】按钮 字段选择 更新【任务审核状态】字段 表达式设置为：【审核中】。 最终完成的【模型触发：[Gemini任务]】更新设置 a. 【模型触发：[Gemini任务]】的【任务状态】字段等于数字字典的【已关闭】，任务审核状态为【审核中】 b. 最后点击节点【保持】按钮。 再增加【更新数据】节点，在右侧属性面板中 【更新模型】选择【获取数据[Gemini用户任务实例]】 【字段列表】点击【创建】按钮 字段选择 更新【任务状态】字段 表达式设置为：【已关闭】。 最终完成的【获取数据[Gemini用户任务实例]】更新设置 a. 【获取数据[Gemini用户任务实例]】的【任务状态】字段等于数字字典的【已关闭】 b. 最后点击节点【保持】按钮。 增加【审批】节点，在右侧属性面板中 【审批模型】选择模型为【模型触发：[Gemini任务]】 【选择视图】选择前面新建的页面【流程中的任务编辑页】 【审批人】选择角色为【超级管理员】 【数据】权限全部设置为【查看】 其他配置项默认，需要了解更多请查看产品使用手册 最后点击节点【保持】按钮。 新增【审核分支】，在【通过】分支中增加两个数据更新节点，跟审核前的两个数据更新节点对应 【模型触发：[Gemini任务]】的【任务状态】字段等于数字字典的【初始化】，任务审核状态为【审核通过】 【获取数据[Gemini用户任务实例]】的【任务状态】字段等于数字字典的【初始化】 流程确保保持并发布过，点击右上角【发布流程】完成流程的保存与发布 Step5 检验效果 创建任务后，任务状态为【关闭】状态，任务列表中的任务状态为多个状态的计算值 审核通过后，任务状态为【进行中】状态，任务列表中的任务状态为多个状态的计算值

  史, 昂

  2024年5月23日

  985000
• Oinone 7天入门到精通

  3.2.2 启动前端工程

  本节核心是带大家直观的感受下我们上节构建的demo模块，并搭建前端环境为后续学习打下基础 一、使用vue-cli构建工程 ##demo-front是项目名，可以替换成自己的 vue create –preset http://ss.gitlab.pamirs.top/:qilian/pamirs-archetype-front4 –clone demo-front –registry http://nexus.shushi.pro/repository/kunlun/ 图3-2-2-1 使用vue-cli构建工程 如果启动报错，清除node_modules后重新npm i mac清除命令：npm run cleanOs windows清除命令: npm run clean 若安装失败，检查本地node、npm、vue对应的版本 图3-2-2-2 检查本地的版本 或者下载前端工程本地运行[oinone-front.zip](oinone-front)(575 KB) 二、启动前端工程 找到README.MD文件，根据文件一步一步操作就行。 找到vue.config.js文件，修改devServer.proxy.pamirs.target为后端服务的地址和端口 const WidgetLoaderPlugin = require('@kunlun/widget-loader/dist/plugin.js').default; const Dotenv = require('dotenv-webpack'); module.exports = { lintOnSave: false, runtimeCompiler: true, configureWebpack: { module: { rules: [ { test: /\.widget$/, loader: '@kunlun/widget-loader' } ] }, plugins: [new WidgetLoaderPlugin(), new Dotenv()], resolveLoader: { alias: { '@kunlun/widget-loader': require.resolve('@kunlun/widget-loader') } } }, devServer: { port: 8080, disableHostCheck: true, progress: false, proxy: { pamirs: { // 支持跨域 changeOrigin: true, target: 'http://127.0.0.1:8090' } } } }; 图3-2-2-3 修改后端服务地址与端口 注：要用localhost域名访问，.env文件这里也要改成localhost。如果开发中一定要出现前后端域名不一致，老版本Chrome会有问题，修改可以请参考https://www.cnblogs.com/willingtolove/p/12350429.html 。或者下载新版本Chrome 进入前端工程demo-front文件目录下，执行 npm run dev，最后出现下图就代表启动成功 图3-2-2-4 前端启动成功提示 使用 http://127.0.0.1:8081/login 进行访问，并用admin账号登陆，默认密码为admin 图3-2-2-5 系统登陆页面 点击左上角进行应用切换，会进入App Finder页面，可以看到所有已经安装的应用，可以对照boot的yml配置文件看。但细心的小伙伴应该注意到了，在App Finder页面出现的应用跟我们启动工程yml配置文件中加载的启动模块数不是一一对应的，同时也没有看到我们demo模块。 图3-2-2-6 已安装应用界面 boot工作的yml文件中加载模块 App Finder的应用 说明 – base- common- sequence- expression 无 模块的application = false，为非应用类的模块 – resource – user – auth – business- message – apps- my_center（show=INACTIVE ）- sys_setting （show=INACTIVE ） 有 模块的application = true，为应用类的模块但show=INACTIVE 的则不展示，通过以下方式定义：@Module(show = ActiveEnum.INACTIVE) – demo_core 无 刚建的oinoneDemo工程，默认为false 设计器：无 设计器：无 因为boot中没有加载设计器模块，所以App Finder中的设计器tab选项卡下没有应用 表3-2-2-1 boot工作的yml文件中加载模块及App Finder应用说明 只需要修改oinoneDemo工程的模块定义如下图，那么就可以在App Finder页面看见“oinoneDemo工程”。 图3-2-2-7 修改模块的application属性为true 图3-2-2-8 在App Finder 页面即可看见“OinoneDemo工程” 目前oinone的Demo模块还是一个全空的模块，所以我们点击后会进入一个空白页面。在后续的学习过程中我们会不断完善该模块。 至此恭喜您，前端工程已经启动完成。 三、前端工程结构介绍 ├── public 发布用的目录，index.html入口文件将在这里 │ ├── src 源代码…

  史, 昂

  2024年5月23日

  1.1K000

• 产品使用手册（改）

  史, 昂

  Oinone 7天入门到精通 2024年5月23日

  1.0K000

• 4.1.16 框架之网关协议-RQSL及扩展

  一、RSQL / FIQL parser RSQL是一种查询语言，用于对RESTful API中的条目进行参数化过滤。它基于FIQL（Feed Item Query Language）——一种URI友好的语法，用于跨Atom Feed中的条目表达过滤器。FIQL非常适合在URI中使用，没有不安全的字符，因此不需要URL编码。另一方面，FIQL的语法不太直观，URL编码也不总是那么重要，因此RSQL还为逻辑运算符和一些比较运算符提供了更友好的语法。 例如，您可以像这样查询资源：/movies?query=name=="Kill Bill";year=gt=2003 or /movies?query=director.lastName==Nolan and year>=2000。详见以下示例： 这是一个用JavaCC和Java编写的完整且经过彻底测试的RSQL解析器。因为RSQL是FIQL的超集，所以它也可以用于解析FIQL。 语法和语义 以下语法规范采用EBNF表示法（ISO 14977）编写。 RSQL表达式由一个或多个比较组成，通过逻辑运算符相互关联： Logical AND : ; or and Logical OR : , or or 默认情况下，AND运算符优先（即，在任何OR运算符之前对其求值）。但是，可以使用带括号的表达式来更改优先级，从而产生所包含表达式产生的任何结果。 input = or, EOF; or = and, { "," , and }; and = constraint, { ";" , constraint }; constraint= ( group | comparison ); group = "(", or, ")"; 比较由选择器、运算符和参数组成。 comparison=选择器、比较运算、参数； 选择器标识要筛选的资源表示形式的字段（或属性、元素…）。它可以是任何不包含保留字符的非空Unicode字符串（见下文）或空格。选择器的特定语法不由此解析器强制执行。 selector=未保留str； 比较运算符采用FIQL表示法，其中一些运算符还具有另一种语法： · Equal to : == · Not equal to : != · Less than : =lt= or < · Less than or equal to : =le= or <= · Greater than operator : =gt= or > · Greater than or equal to : =ge= or >= · In : =in= · Not in : =out= 您还可以使用自己的运算符简单地扩展此解析器（请参阅下一节）。 comparison-op = comp-fiql | comp-alt; comp-fiql = ( ( "=", { ALPHA } ) | "!" ), "="; comp-alt = ( ">" | "<" ), [ "=" ]; 参数可以是单个值，也可以是用逗号分隔的括号中的多个值。不包含任何保留字符或空格的值可以不加引号，其他参数必须用单引号或双引号括起来。 arguments = ( "(", value, { "," , value }, ")" ) | value; value = unreserved-str | double-quoted | single-quoted; unreserved-str = unreserved, {…

  史, 昂

  Oinone 7天入门到精通 2024年5月23日

  973000