@opentiny/vue-docs 3.26.7 → 3.27.0

package/demos/apis/query-builder.js

@@ -1,4 +1,349 @@
 export default {
   mode: ['pc'],
-  apis: []
+  apis: [
+    {
+      name: 'query-builder',
+      type: 'component',
+      props: [
+        {
+          name: 'showNewRule',
+          type: 'boolean',
+          defaultValue: 'true',
+          desc: {
+            'zh-CN': '是否显示新增条件',
+            'en-US': 'Whether to show new conditions'
+          },
+          mode: ['pc'],
+          pcDemo: 'handle',
+          mfDemo: ''
+        },
+        {
+          name: 'showNewGroup',
+          type: 'boolean',
+          defaultValue: 'true',
+          desc: {
+            'zh-CN': '是否显示新增子条件组',
+            'en-US': 'Whether to show new sub-condition groups'
+          },
+          mode: ['pc'],
+          pcDemo: 'handle',
+          mfDemo: ''
+        },
+        {
+          name: 'isRuleDisable',
+          type: 'boolean',
+          defaultValue: 'false',
+          desc: {
+            'zh-CN': '是否禁用新增条件',
+            'en-US': 'Whether to disable new conditions'
+          },
+          mode: ['pc'],
+          pcDemo: 'handle',
+          mfDemo: ''
+        },
+        {
+          name: 'isGroupDisable',
+          type: 'boolean',
+          defaultValue: 'false',
+          desc: {
+            'zh-CN': '是否禁用新增子条件组',
+            'en-US': 'Whether to disable new sub-condition groups'
+          },
+          mode: ['pc'],
+          pcDemo: 'handle',
+          mfDemo: ''
+        },
+        {
+          name: 'disabled',
+          type: 'boolean',
+          defaultValue: 'false',
+          desc: {
+            'zh-CN': '是否全部禁用',
+            'en-US': 'Whether to disable all'
+          },
+          mode: ['pc'],
+          pcDemo: 'handle',
+          mfDemo: ''
+        },
+        {
+          name: 'ruleLimit',
+          type: 'number',
+          defaultValue: 'infinity',
+          desc: {
+            'zh-CN': '设置新增条件的最大数量',
+            'en-US': 'Set the maximum number of new conditions'
+          },
+          mode: ['pc'],
+          pcDemo: 'limit',
+          mfDemo: ''
+        },
+        {
+          name: 'groupLimit',
+          type: 'number',
+          defaultValue: 'infinity',
+          desc: {
+            'zh-CN': '设置新增子条件组的最大数量',
+            'en-US': 'Set the maximum number of new sub-condition groups'
+          },
+          mode: ['pc'],
+          pcDemo: 'limit',
+          mfDemo: ''
+        },
+        {
+          name: 'config',
+          typeAnchorName: 'IQueryBuilderConfig',
+          type: 'IQueryBuilderConfig',
+          desc: {
+            'zh-CN': '设置查询构建器的配置',
+            'en-US': 'Set the configuration for the query builder'
+          },
+          mode: ['pc'],
+          pcDemo: 'basic-usage',
+          mfDemo: ''
+        },
+        {
+          name: 'autoSelectField',
+          type: 'boolean',
+          defaultValue: 'true',
+          desc: {
+            'zh-CN': '范围域是否会默认选择',
+            'en-US': 'Whether the range field will be selected by default'
+          },
+          mode: ['pc'],
+          pcDemo: 'basic-usage',
+          mfDemo: ''
+        },
+        {
+          name: 'autoSelectOperator',
+          type: 'boolean',
+          defaultValue: 'true',
+          desc: {
+            'zh-CN': '运算符是否会默认选择',
+            'en-US': 'Whether the operator will be selected by default'
+          },
+          mode: ['pc'],
+          pcDemo: 'basic-usage',
+          mfDemo: ''
+        },
+        {
+          name: 'parseNumbers',
+          type: 'boolean',
+          defaultValue: 'false',
+          desc: {
+            'zh-CN': '数字会被转化为 Number 类型',
+            'en-US': 'Whether the numbers will be converted to Number type'
+          },
+          mode: ['pc'],
+          pcDemo: 'basic-usage',
+          mfDemo: ''
+        },
+        {
+          name: 'showCloneButtons',
+          type: 'boolean',
+          defaultValue: 'false',
+          desc: {
+            'zh-CN': '是否展示复制按钮，即整条规则可以被复制',
+            'en-US': 'Whether to show clone buttons, allowing entire rules to be cloned'
+          },
+          mode: ['pc'],
+          pcDemo: 'basic-usage',
+          mfDemo: ''
+        },
+        {
+          name: 'showCombinatorsBetweenRules',
+          type: 'boolean',
+          defaultValue: 'false',
+          desc: {
+            'zh-CN': '组合子数组统一修改，且不再展示在连线上，以下拉选择形式出现',
+            'en-US':
+              'Whether to show combinators between rules, allowing unified modification and appearing as a dropdown selection instead of on the connecting line'
+          },
+          mode: ['pc'],
+          pcDemo: 'basic-usage',
+          mfDemo: ''
+        },
+        {
+          name: 'showLockButtons',
+          type: 'boolean',
+          defaultValue: 'false',
+          desc: {
+            'zh-CN': '展示锁定按钮，即整条规则可以被锁定',
+            'en-US': 'Whether to show lock buttons, allowing entire rules to be locked'
+          },
+          mode: ['pc'],
+          pcDemo: 'basic-usage',
+          mfDemo: ''
+        },
+        {
+          name: 'showNotToggle',
+          type: 'boolean',
+          defaultValue: 'false',
+          desc: {
+            'zh-CN': '展示 not 条件切换框',
+            'en-US': 'Whether to show not condition toggle'
+          },
+          mode: ['pc'],
+          pcDemo: 'basic-usage',
+          mfDemo: ''
+        },
+        {
+          name: 'displayOnlyField',
+          type: 'boolean',
+          defaultValue: 'false',
+          desc: {
+            'zh-CN': '是否仅展示字段选择器功能',
+            'en-US': 'Whether to display only the field selector functionality'
+          },
+          mode: ['pc'],
+          pcDemo: 'display-only-field',
+          mfDemo: ''
+        },
+        {
+          name: 'max-height',
+          type: 'number',
+          desc: {
+            'zh-CN': '设置组件最大高度',
+            'en-US': 'Set the maximum height of the component'
+          },
+          mode: ['pc'],
+          pcDemo: 'max-height',
+          mfDemo: ''
+        },
+        {
+          name: 'bindProps',
+          type: 'object',
+          desc: {
+            'zh-CN': '控制某一类组件的参数',
+            'en-US': 'Control the parameters of a certain type of component'
+          },
+          mode: ['pc'],
+          pcDemo: 'sub-component-param',
+          mfDemo: ''
+        },
+        {
+          name: 'allowDelAll',
+          type: 'boolean',
+          defaultValue: 'false',
+          desc: {
+            'zh-CN': '是否允许删除所有规则',
+            'en-US': 'Whether to allow deleting all rules'
+          },
+          mode: ['pc'],
+          pcDemo: '',
+          mfDemo: ''
+        },
+        {
+          name: 'fields',
+          type: 'Array',
+          defaultValue: '[]',
+          desc: {
+            'zh-CN': '字段列表',
+            'en-US': 'Field list'
+          },
+          mode: ['pc'],
+          pcDemo: 'tree-field',
+          mfDemo: ''
+        },
+        {
+          name: 'validateQuery',
+          type: 'boolean',
+          defaultValue: 'false',
+          desc: {
+            'zh-CN': '是否启用查询校验',
+            'en-US': 'Whether to enable query validation'
+          },
+          mode: ['pc'],
+          pcDemo: 'advanced-mode',
+          mfDemo: ''
+        },
+        {
+          name: 'query',
+          type: 'IQueryBuilderQuery',
+          typeAnchorName: 'IQueryBuilderQuery',
+          desc: {
+            'zh-CN': '查询数据',
+            'en-US': 'Query Data'
+          },
+          mode: ['pc'],
+          pcDemo: 'display-only-field',
+          mfDemo: ''
+        },
+        {
+          name: 'on-query-change',
+          type: 'function',
+          desc: {
+            'zh-CN': '查询数据改变时触发方法',
+            'en-US': 'Triggered when query data changes'
+          },
+          mode: ['pc'],
+          pcDemo: 'display-only-field',
+          mfDemo: ''
+        }
+      ]
+    }
+  ],
+  types: [
+    {
+      name: 'IQueryBuilderConfig',
+      type: 'type',
+      code: `type IQueryBuilderConfig = {
+  ruleLimit?: number;  // 设置新增条件的最大数量
+  groupLimit?: number;  // 设置新增子条件组的最大数量
+  showNewRule?: boolean;  // 是否显示新增条件
+  showNewGroup?: boolean;  // 是否显示新增子条件组
+  isRuleDisable?: boolean;  // 是否禁用新增条件
+  isGroupDisable?: boolean;  // 是否禁用新增子条件组
+  disabled?: boolean;  // 是否全部禁用
+  autoSelectField?: boolean;  // 范围域是否会默认选择
+  autoSelectOperator?: boolean;  // 运算符是否会默认选择
+  parseNumbers?: boolean;  // 数字会被转化为 Number 类型
+  showCloneButtons?: boolean;  // 是否展示复制按钮，即整条规则可以被复制
+  showCombinatorsBetweenRules?: boolean;  // 组合子数组统一修改，且不再展示在连线上，以下拉选择形式出现
+  showLockButtons?: boolean;  // 展示锁定按钮，即整条规则可以被锁定
+  showNotToggle?: boolean;  // 展示 not 条件切换框
+  displayOnlyField?: boolean;  // 是否仅展示字段选择器功能
+  bindProps?: { // 控制某一类组件的参数
+    [key: string]: any;
+  };
+  allowDelAll?: boolean;  // 是否允许删除所有规则
+  fields?: Array<{
+    name: string; // 格式化数据中的值（形参）
+    label: string; // 范围域在规则生成器中对外展示名称
+    operators: Record<string, any>[]; // 运算符自定义
+    defaultValue?: boolean; // 值域的默认值
+    validator?: (r: Record<string, any>) => boolean; // 校验规则
+    inputType?: string; // 值域的数值类型
+    valueEditorType?: string; // 值域编辑器的类型
+    values?: Array<Record<string, any>>;
+    valueSources?: string[];  // 值域类型可选择
+    comparator?: string; //分组时的比较器
+    groupNumber?: string; //分组的组别
+  }>;  // 字段列表
+  combinators?: Array<{
+    name: string;
+    label: string;
+  }>;  // 组合子数组配置
+  validateQuery?: boolean;  // 是否启用查询校验
+}`
+    },
+    {
+      name: 'IQueryBuilderQuery',
+      type: 'type',
+      code: `type IQueryBuilderQuery = {
+      id?: string;
+      combinator: string;
+      not?: boolean;
+      rules: Array<IQueryBuilderQuery | IQueryBuilderRule>;
+    }
+    
+    type IQueryBuilderRule = {
+      id?: string; // 规则 id
+      field: string;  // 字段
+      operator: string; // 运算符
+      value: any;   // 值域
+      valueSource?: string; // 值域类型
+}
+      `
+    }
+  ]
 }

package/demos/apis/select.js

@@ -360,6 +360,19 @@ export default {
           mode: ['pc'],
           pcDemo: 'filter-method'
         },
+        {
+          name: 'optimization',
+          type: 'boolean',
+          defaultValue: 'false',
+          desc: {
+            'zh-CN': '是否开启大数据虚拟滚动功能。仅配置式（使用 options 属性）时支持',
+            'en-US':
+              'Whether to enable the big data virtual scrolling feature. Supported only when configured (using the options attribute)'
+          },
+          mode: ['pc', 'mobile-first'],
+          pcDemo: 'optimization',
+          mfDemo: 'optimization'
+        },
         {
           name: 'options',
           typeAnchorName: 'IOption',
@@ -422,6 +435,19 @@ export default {
           pcDemo: 'popup-style-position',
           mfDemo: 'popup-style-position'
         },
+        {
+          name: 'popper-options',
+          typeAnchorName: 'IPopperOption',
+          type: 'IPopperOption',
+          defaultValue: ' { }',
+          desc: {
+            'zh-CN': '弹出层参数',
+            'en-US': 'Advanced parameters; Refer to the description of IPopperOption'
+          },
+          mode: ['pc', 'mobile-first'],
+          pcDemo: '',
+          mfDemo: ''
+        },
         {
           name: 'remote',
           type: 'boolean',
@@ -1021,6 +1047,21 @@ interface ITreeOption {
       code: `
 type IPlacement = 'top' | 'top-start' | 'top-end' | 'bottom' | 'bottom-start' | 'bottom-end' | 'left' | 'left-start' | 'left-end' | 'right' | 'right-start' | 'right-end'
 `
+    },
+    {
+      name: 'IPopperOption',
+      type: 'interface',
+      code: `
+    interface IPopperOption {
+      bubbling: boolean // 是否监听元素所有上级有滚动元素的scroll事件，监听到则更新popper的位置。用于解决某些弹出层位置在页面滚动时，位置不正确的场景，默认false
+      followReferenceHide: boolean // 当触发源隐藏时，自动隐藏弹出层，默认true
+      removeOnDestroy: boolean // 弹出层消失后，是否移除弹出层的DOM元素，布尔false
+      updateHiddenPopperOnScroll: boolean  // 滚动过程中是否更新隐藏的弹出层位置
+      boundariesElement: 'viewport' | 'body' | HTMLElement // 滚动过程中,弹出层的碰撞边界。 默认值为： 'viewport'
+      ignoreBoundaries: boolean  // 忽略边界判断，弹出的位置始终是设置的 placement 值
+      scrollParent:  HTMLElement  // 指定滚动的父节点，优化级最高。 默认为null
+    }
+          `
     }
   ]
 }

package/demos/apis/space.js

@@ -0,0 +1,99 @@
+export default {
+  mode: ['pc', 'mobile-first'],
+  apis: [
+    {
+      name: 'space',
+      type: 'component',
+      props: [
+        {
+          name: 'size',
+          type: '[string, number, array]',
+          defaultValue: "'small'",
+          desc: {
+            'zh-CN': '设置间距大小，可为字符串、数字或数组，数组形式为 [横向间距, 纵向间距]',
+            'en-US': 'Set the spacing size. Can be a string, number, or an array like [horizontal, vertical]'
+          },
+          mode: ['pc', 'mobile-first'],
+          pcDemo: 'space-size',
+          mfDemo: 'space-size'
+        },
+        {
+          name: 'align',
+          type: 'string',
+          defaultValue: "'stretch'",
+          desc: {
+            'zh-CN': '设置交叉轴上的对齐方式，对应 CSS align-items 属性',
+            'en-US': 'Set the alignment on the cross axis, corresponding to the CSS align-items property'
+          },
+          mode: ['pc', 'mobile-first'],
+          pcDemo: 'space-align',
+          mfDemo: 'space-align'
+        },
+        {
+          name: 'justify',
+          type: 'string',
+          defaultValue: "'start'",
+          desc: {
+            'zh-CN': '设置主轴上的对齐方式，对应 CSS justify-content 属性',
+            'en-US': 'Set the alignment on the main axis, corresponding to the CSS justify-content property'
+          },
+          mode: ['pc', 'mobile-first'],
+          pcDemo: 'space-justify',
+          mfDemo: 'space-justify'
+        },
+        {
+          name: 'direction',
+          type: 'string',
+          defaultValue: "'row'",
+          desc: {
+            'zh-CN': '设置排列方向，可选值为 row 或 column',
+            'en-US': 'Set the layout direction, options are row or column'
+          },
+          mode: ['pc', 'mobile-first'],
+          pcDemo: 'space-direction',
+          mfDemo: 'space-direction'
+        },
+        {
+          name: 'wrap',
+          type: 'boolean',
+          defaultValue: 'false',
+          desc: {
+            'zh-CN': '是否自动换行，默认为 false',
+            'en-US': 'Whether to wrap to the next line automatically, default is false'
+          },
+          mode: ['pc', 'mobile-first'],
+          pcDemo: 'space-wrap',
+          mfDemo: 'space-wrap'
+        },
+        {
+          name: 'order',
+          type: 'array',
+          defaultValue: '[]',
+          desc: {
+            'zh-CN': '用于指定子元素的显示顺序，数组的值对应插槽中子节点的索引',
+            'en-US':
+              'Used to specify the display order of child elements; the array values correspond to the index of slot children'
+          },
+          mode: ['pc', 'mobile-first'],
+          pcDemo: 'space-order',
+          mfDemo: 'space-order'
+        }
+      ],
+      events: [],
+      methods: [],
+      slots: [
+        {
+          name: 'default',
+          defaultValue: '',
+          desc: {
+            'zh-CN': '用于插入需要布局的子元素',
+            'en-US': 'Used to insert child elements to be laid out'
+          },
+          mode: ['pc', 'mobile-first'],
+          pcDemo: 'basic-usage',
+          mfDemo: 'basic-usage'
+        }
+      ]
+    }
+  ]
+}

package/demos/apis/steps.js

@@ -252,6 +252,21 @@ export default {
           mode: ['mobile-first'],
           mfDemo: ''
         },
+        {
+          name: 'icon',
+          type: '',
+          defaultValue: '',
+          meta: {
+            stable: '3.27.0'
+          },
+          desc: {
+            'zh-CN': '单链型圆形节点插槽',
+            'en-US': 'Single chain circular node slot'
+          },
+          mode: ['pc'],
+          pcDemo: 'slot-icon',
+          mfDemo: ''
+        },
         {
           name: 'item',
           type: '',

package/demos/apis/time-picker.js

@@ -162,6 +162,19 @@ export default {
           mode: ['pc'],
           pcDemo: 'popper-class'
         },
+        {
+          name: 'popper-options',
+          typeAnchorName: 'IPopperOption',
+          type: 'IPopperOption',
+          defaultValue: ' { }',
+          desc: {
+            'zh-CN': '弹出层参数',
+            'en-US': 'Advanced parameters; Refer to the description of IPopperOption'
+          },
+          mode: ['pc', 'mobile-first'],
+          pcDemo: '',
+          mfDemo: ''
+        },
         {
           name: 'range-separator',
           type: 'string',
@@ -381,6 +394,21 @@ interface IPickerOptions {
   selectableRange: string
   // 下拉框中显示的格式
   format: string
+}
+      `
+    },
+    {
+      name: 'IPopperOption',
+      type: 'interface',
+      code: `
+interface IPopperOption {
+  bubbling: boolean // 是否监听元素所有上级有滚动元素的scroll事件，监听到则更新popper的位置。用于解决某些弹出层位置在页面滚动时，位置不正确的场景，默认false
+  followReferenceHide: boolean // 当触发源隐藏时，自动隐藏弹出层，默认true
+  removeOnDestroy: boolean // 弹出层消失后，是否移除弹出层的DOM元素，布尔false
+  updateHiddenPopperOnScroll: boolean  // 滚动过程中是否更新隐藏的弹出层位置
+  boundariesElement: 'viewport' | 'body' | HTMLElement // 滚动过程中,弹出层的碰撞边界。 默认值为： 'viewport'
+  ignoreBoundaries: boolean  // 忽略边界判断，弹出的位置始终是设置的 placement 值
+  scrollParent:  HTMLElement  // 指定滚动的父节点，优化级最高。 默认为null
 }
       `
     }

package/demos/apis/time-select.js

@@ -128,6 +128,19 @@ export default {
           mode: ['pc'],
           pcDemo: ''
         },
+        {
+          name: 'popper-options',
+          typeAnchorName: 'IPopperOption',
+          type: 'IPopperOption',
+          defaultValue: ' { }',
+          desc: {
+            'zh-CN': '弹出层参数',
+            'en-US': 'Advanced parameters; Refer to the description of IPopperOption'
+          },
+          mode: ['pc', 'mobile-first'],
+          pcDemo: '',
+          mfDemo: ''
+        },
         {
           name: 'size',
           type: 'string',
@@ -201,5 +214,22 @@ export default {
       ],
       slots: []
     }
+  ],
+  types: [
+    {
+      name: 'IPopperOption',
+      type: 'interface',
+      code: `
+interface IPopperOption {
+  bubbling: boolean // 是否监听元素所有上级有滚动元素的scroll事件，监听到则更新popper的位置。用于解决某些弹出层位置在页面滚动时，位置不正确的场景，默认false
+  followReferenceHide: boolean // 当触发源隐藏时，自动隐藏弹出层，默认true
+  removeOnDestroy: boolean // 弹出层消失后，是否移除弹出层的DOM元素，布尔false
+  updateHiddenPopperOnScroll: boolean  // 滚动过程中是否更新隐藏的弹出层位置
+  boundariesElement: 'viewport' | 'body' | HTMLElement // 滚动过程中,弹出层的碰撞边界。 默认值为： 'viewport'
+  ignoreBoundaries: boolean  // 忽略边界判断，弹出的位置始终是设置的 placement 值
+  scrollParent:  HTMLElement  // 指定滚动的父节点，优化级最高。 默认为null
+}
+      `
+    }
   ]
 }

package/demos/apis/tree-menu.js

@@ -524,6 +524,20 @@ export default {
           },
           mode: ['pc'],
           pcDemo: 'events'
+        },
+        {
+          name: 'input-change',
+          type: '(data:string) => void',
+          defaultValue: '',
+          desc: {
+            'zh-CN': '输入框输入值时触发的事件',
+            'en-US': 'Event triggered when a value is entered into the input box.'
+          },
+          mode: ['pc'],
+          pcDemo: 'events',
+          meta: {
+            stable: '3.27.0'
+          }
         }
       ],
       methods: [

package/demos/mobile-first/app/calendar-view/basic-usage.vue

@@ -1,5 +1,5 @@
 <template>
-  <tiny-calendar-view :events="eventslist" :year="2023" :month="5"> </tiny-calendar-view>
+  <tiny-calendar-view :events="eventslist" :year="2023" :month="5" :day="15"> </tiny-calendar-view>
 </template>
 
 <script>

package/demos/mobile-first/app/exception/webdoc/exception.js

@@ -29,18 +29,18 @@ export default {
       codeFiles: ['page-empty.vue']
     },
     {
-      demoId: 'component-empty',
+      demoId: 'component-page',
       name: {
         'zh-CN': '组件级空态',
         'en-US': 'Component-level empty state'
       },
       desc: {
         'zh-CN':
-          '<p>通过添加`component-empty`属性展示组件级空态，其中 type 类型有`noperm、 nodata、 weaknet、noresult、 nonews`<br> 对应场景：<br>`noperm` ：无访问权限<br>`nodata` ：暂无数据<br>`weaknet` ：网络不给力<br>`noresult`：无相关搜索结果<br>`nonews`：暂无最新消息<br></p>',
+          '<p>通过添加`component-page`属性展示组件级空态，其中 type 类型有`noperm、 nodata、 weaknet、noresult、 nonews`<br> 对应场景：<br>`noperm` ：无访问权限<br>`nodata` ：暂无数据<br>`weaknet` ：网络不给力<br>`noresult`：无相关搜索结果<br>`nonews`：暂无最新消息<br></p>',
         'en-US':
-          '<p>Add the `component-empty` attribute to display the component-level empty state. The type type can be `noperm, nodata, weaknet, noresult, or nonews`<br>The corresponding scenario is as follows: <br>`noperm`: No access<br>`nodata`: no data<br>`weaknet`: network is not powerful<br>`noresult`: no related search results<br>`nonews`: no latest news<br></p>'
+          '<p>Add the `component-page` attribute to display the component-level empty state. The type type can be `noperm, nodata, weaknet, noresult, or nonews`<br>The corresponding scenario is as follows: <br>`noperm`: No access<br>`nodata`: no data<br>`weaknet`: network is not powerful<br>`noresult`: no related search results<br>`nonews`: no latest news<br></p>'
       },
-      codeFiles: ['component-empty.vue']
+      codeFiles: ['component-page.vue']
     },
     {
       demoId: 'sub-message',

package/demos/mobile-first/app/load-list/webdoc/load-list.en.md

@@ -1,5 +1,5 @@
 ---
-title:LoadListLoadList
+title: LoadListLoadList
 ---
 
 # LoadList Load list