fix(query-builder): document supplement #3814
Open
Conversation
This file contains hidden or bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
WalkthroughUpdated demo metadata file to add English translations for query-builder demo descriptions, introduced inline code formatting for technical terms, and changed the display-only-field demo label from "Basic" to "Simple Mode". Changes
Estimated code review effort🎯 2 (Simple) | ⏱️ ~8 minutes
Poem
Pre-merge checks and finishing touches✅ Passed checks (3 passed)
✨ Finishing touches
🧪 Generate unit tests (beta)
Thanks for using CodeRabbit! It's free for OSS, and your support helps us grow. If you like it, consider giving us a shout-out. Comment |
![coderabbitai[bot]](https://avatars.githubusercontent.com/in/347564?s=60&v=4){kind=small}
There was a problem hiding this comment.
Actionable comments posted: 2
📜 Review details
Configuration used: CodeRabbit UI
Review profile: CHILL
Plan: Pro
📒 Files selected for processing (1)
examples/sites/demos/pc/app/query-builder/webdoc/query-builder.js(5 hunks)
⏰ Context from checks skipped due to timeout of 90000ms. You can increase the timeout in your CodeRabbit configuration to a maximum of 15 minutes (900000ms). (1)
- GitHub Check: PR E2E Test (pnpm test:e2e3)
| <code>autoSelectField</code>：范围域是否会默认选择，勾选则默认为第一个选项；反之则默认为----- \n <code>autoSelectOperator</code>：运算符是否会默认选择，勾选则默认选择第一个选项，反之则默认为----- \n <code>disabled</code>：禁用所有规则 \n <code>parseNumbers</code>：数字会被转化为 Number 类型，而非 String 类型 \n <code>showCloneButtons</code>：展示复制按钮，即整条规则可以被复制 \n <code>showCombinatorsBetweenRules</code>：组合子数组统一修改，且不再展示在连线上，以下拉选择形式出现 \n <code>showLockButtons</code>：展示锁定按钮，即整条规则可以被锁定 \n <code>showNotToggle</code>：展示 not 条件切换框 \n <code>displayOnlyField</code>：是否仅展示字段选择器 \n </div> \n 二、fields 数据配置 \n <pre> <code>\n fields 中的数据（只用于说明各字段含义，无业务特定性） \n { \n name: 'isMusician', //name：格式化数据中的值（形参） \n label: 'Is a musician', //label：范围域在规则生成器中对外展示名称 \n valueEditorType: 'checkbox', //placeholder：值域的默认缺省值 \n operators: [ //运算符自定义，name 为格式化数据中的值，label 为范围域对外展示的名称 \n { \n name: '=', \n label: '=' \n } \n ], \n bindProps: { // 通过 bindProps 参数可对某一类组件进行参数控制 \n input:{ \n clearable:true \n }, \n select:{ \n filterable:true \n } \n }, \n defaultValue: false, //defaultOperator：运算符的默认缺省选择 \n validator: (r) => !!r.value //validator：校验规则（该功能点还在迭代开发中……） \n inputType: 'number', //值域的数值类型 \n valueEditorType: 'radio' //值域编辑器的类型 \n defaultValue: false, //值域的默认值 \n values: [ //值域的可选域配置（下拉） \n { \n label: 'Percussion instruments', \n options: [ \n { \n name: 'Clapstick', \n label: 'Clapstick' \n } \n ] \n } \n ], \n values: [ //值域的可选域配置（单选） \n { \n name: 'M', \n label: 'Male' \n }, \n { \n name: 'F', \n label: 'Female' \n }, \n { \n name: 'O', \n label: 'Other' \n } \n ], \n valueSources: ['field', 'value'], //值域类型可选择 \n comparator: 'groupNumber', //分组时的比较器 \n groupNumber: 'group1', //分组的组别 \n }, \n // 组合子数组配置，label 为展示字符，name 为数据值 \n combinators: [ \n { \n name: 'and', \n label: '且' \n }, \n { \n name: 'or', \n label: '或' \n } \n ] \n </code></pre> <br>`, | ||
| 'en-US': '' | ||
| <code>config</code>属性说明，<code>autoSelectField</code>：范围域是否会默认选择，勾选则默认为第一个选项；反之则默认为----- \n <code>autoSelectOperator</code>：运算符是否会默认选择，勾选则默认选择第一个选项，反之则默认为----- \n <code>disabled</code>：禁用所有规则 \n <code>parseNumbers</code>：数字会被转化为 Number 类型，而非 String 类型 \n <code>showCloneButtons</code>：展示复制按钮，即整条规则可以被复制 \n <code>showCombinatorsBetweenRules</code>：组合子数组统一修改，且不再展示在连线上，以下拉选择形式出现 \n <code>showLockButtons</code>：展示锁定按钮，即整条规则可以被锁定 \n <code>showNotToggle</code>：展示 not 条件切换框 \n <code>displayOnlyField</code>：是否仅展示字段选择器 \n </div> \n fields 数据配置 \n <pre> <code>fields 中的数据（只用于说明各字段含义，无业务特定性） \n { \n name: 'isMusician', //name：格式化数据中的值（形参） \n label: 'Is a musician', //label：范围域在规则生成器中对外展示名称 \n valueEditorType: 'checkbox', //placeholder：值域的默认缺省值 \n operators: [ //运算符自定义，name 为格式化数据中的值，label 为范围域对外展示的名称 \n { \n name: '=', \n label: '=' \n } \n ], \n bindProps: { // 通过 bindProps 参数可对某一类组件进行参数控制 \n input:{ \n clearable:true \n }, \n select:{ \n filterable:true \n } \n }, \n defaultValue: false, //defaultOperator：运算符的默认缺省选择 \n validator: (r) => !!r.value //validator：校验规则（该功能点还在迭代开发中……） \n inputType: 'number', //值域的数值类型 \n valueEditorType: 'radio' //值域编辑器的类型 \n defaultValue: false, //值域的默认值 \n values: [ //值域的可选域配置（下拉） \n { \n label: 'Percussion instruments', \n options: [ \n { \n name: 'Clapstick', \n label: 'Clapstick' \n } \n ] \n } \n ], \n values: [ //值域的可选域配置（单选） \n { \n name: 'M', \n label: 'Male' \n }, \n { \n name: 'F', \n label: 'Female' \n }, \n { \n name: 'O', \n label: 'Other' \n } \n ], \n valueSources: ['field', 'value'], //值域类型可选择 \n comparator: 'groupNumber', //分组时的比较器 \n groupNumber: 'group1', //分组的组别 \n }, \n // 组合子数组配置，label 为展示字符，name 为数据值 \n combinators: [ \n { \n name: 'and', \n label: '且' \n }, \n { \n name: 'or', \n label: '或' \n } \n ] \n </code></pre> <br>`, | ||
| 'en-US': `<code>config</code> Attribute Description, <code>autoSelectField</code>: Whether the range field is automatically selected by default. If checked, the first option will be selected by default; otherwise, it defaults to ----- <code>autoSelectOperator</code>: Whether the operator is automatically selected by default. If checked, the first option will be selected by default; otherwise, it defaults to ----- <code>disabled</code>: Disable all rules <code>parseNumbers</code>: Numbers will be converted to the Number type, not the String type <code>showCloneButtons</code>: Display copy buttons, allowing the entire rule to be copied <code>showCombinatorsBetweenRules</code>: Uniformly modify the combinator array, which no longer appears on the connection line but instead appears as a dropdown selection <code>showLockButtons</code>: Display lock buttons, allowing the entire rule to be locked <code>showNotToggle</code>: Display the not condition toggle box <code>displayOnlyField</code>: Whether only the field selector is displayed. \n fields data configuration \n<pre><code>Data in fields (only used to explain the meaning of each field, no business specificity) \n {\n name: 'isMusician',//name: values (formal parameters) in formatted data \n label: 'Is a musician',//label: the external display name of the range field in the rule generator \n valueEditorType: 'checkbox',//placeholder: the default value of the value field \n operators: [//operator customization, name is the value in formatted data, label is the external display name of the range field \n {\n name: '=', \n label: '=' \n} \n], \n BindProps: {//The bindProps parameter can be used to control the parameters of a certain type of component\n input:{ \n clearable:true \n }, \n select:{ \n filterable:true \n } \n }, \n defaultValue: false, //defaultOperator： The default selection for operators is validator: (r)=>!! r. Value//validator: validation rules (this feature is still under iterative development...) \n inputType: 'number',//numeric type of value range \n valueEditorType: 'radio'//type of value range editor \n defaultValue: false,//default value of value range \n values: [//optional range configuration of value range (drop-down))\n { \n label: 'Percussion instruments', \n options: [ \n { \n name: 'Clapstick', \n label: 'Clapstick' \n } \n ] \n } \n ], \n values: [//Optional field configuration for value range (single choice)\n { \n name: 'M', \n label: 'Male' \n }, \n { \n name: 'F', \n label: 'Female' \n }, \n { \n name: 'O', \n label: 'Other' \n } \n ], \n valueSources: ['field', 'value'], //The range type can be selected as \n comparator:'groupNumber ',//comparator for grouping \n groupNumber:'group1',//grouping group \n}, \n//combination subarray configuration, label is the display character, name is the data value \n combiners: [\n {\n name: 'and', \n label: 'and' \n}, \n {\n name: 'or', \n label: 'or' \n} \n] \n</code></press><br>` |
There was a problem hiding this comment.
Correct property name case and closing tag in en-US block.
BindProps should remain camelCased as bindProps, otherwise the doc instructs a non-existent option. The same string ends with </press>, which breaks the HTML block. Please fix both.
Apply this diff to address the issues:
- 'en-US': `<code>config</code> Attribute Description, ... BindProps: {//The bindProps parameter ...\n</code></press><br>`
+ 'en-US': `<code>config</code> Attribute Description, ... <code>bindProps</code>: {//The <code>bindProps</code> parameter ...\n</code></pre><br>`Committable suggestion skipped: line range outside the PR's diff.
🤖 Prompt for AI Agents
In examples/sites/demos/pc/app/query-builder/webdoc/query-builder.js around line
14, change the incorrect property name BindProps to camelCase bindProps in the
en-US string and replace the erroneous closing tag </press> with the correct
</pre> to properly close the code block.
| 'en-US': ' ' | ||
| 'zh-CN': '<code>config</code>配置添加<code>displayOnlyField</code>属性，开启简易模式仅展示字段选择器功能', | ||
| 'en-US': | ||
| '<code>config</code>Configure to add<code>showOnlyField</code>attribute, enable simple mode to only display field selector function' |
There was a problem hiding this comment.
Attribute name typo in en-US translation.
The English description tells users to set <code>showOnlyField</code>, but the actual option is displayOnlyField. This mismatch will cause the feature to fail for readers following the doc. Please align the attribute name.
Apply this diff to fix the typo:
- '<code>config</code>Configure to add<code>showOnlyField</code>attribute, enable simple mode to only display field selector function'
+ '<code>config</code>Configure to add<code>displayOnlyField</code>attribute, enabling simple mode to only display the field selector'📝 Committable suggestion
‼️ IMPORTANT
Carefully review the code before committing. Ensure that it accurately replaces the highlighted code, contains no missing lines, and has no issues with indentation. Thoroughly test & benchmark the code to ensure it meets the requirements.
Suggested change
| '<code>config</code>Configure to add<code>showOnlyField</code>attribute, enable simple mode to only display field selector function' | |
| '<code>config</code>Configure to add<code>displayOnlyField</code>attribute, enabling simple mode to only display the field selector' |
🤖 Prompt for AI Agents
In examples/sites/demos/pc/app/query-builder/webdoc/query-builder.js around line
27, the en-US string mistakenly references the attribute name
<code>showOnlyField</code> while the actual option is displayOnlyField; update
the translation text to reference displayOnlyField (replace "showOnlyField" with
"displayOnlyField") so the docs match the real API and users won't be misled.
Sign up for free
to join this conversation on GitHub.
Already have an account?
Sign in to comment
1 participant
Add this suggestion to a batch that can be applied as a single commit.
This suggestion is invalid because no changes were made to the code.
Suggestions cannot be applied while the pull request is closed.
Suggestions cannot be applied while viewing a subset of changes.
Only one suggestion per line can be applied in a batch.
Add this suggestion to a batch that can be applied as a single commit.
Applying suggestions on deleted lines is not supported.
You must change the existing code in this line in order to create a valid suggestion.
Outdated suggestions cannot be applied.
This suggestion has been applied or marked resolved.
Suggestions cannot be applied from pending reviews.
Suggestions cannot be applied on multi-line comments.
Suggestions cannot be applied while the pull request is queued to merge.
Suggestion cannot be applied right now. Please check back later.
PR
PR Checklist
Please check if your PR fulfills the following requirements:
PR Type
What kind of change does this PR introduce?
补充文档
What is the current behavior?
Issue Number: #3810
What is the new behavior?
Does this PR introduce a breaking change?
PR Checklist
Please check if your PR fulfills the following requirements:
PR Type
What kind of change does this PR introduce?
补充文档
What is the current behavior?
Issue Number: N/A
What is the new behavior?
Does this PR introduce a breaking change?
Other information
Summary by CodeRabbit