From 2be6d1347a737205a3c63aac9c7d2d365dd704eb Mon Sep 17 00:00:00 2001 From: gimmyhehe <975402925@qq.com> Date: Wed, 8 Jan 2025 11:01:05 +0800 Subject: [PATCH] docs(grid): [grid] add updateFooter demo (#2755) --- examples/sites/demos/apis/grid.js | 1115 ++--------------- ...ter-row-or-column-span-composition-api.vue | 34 +- .../grid/footer/footer-row-or-column-span.vue | 34 +- .../footer/update-footer-composition-api.vue | 104 ++ .../pc/app/grid/footer/update-footer.spec.ts | 11 + .../pc/app/grid/footer/update-footer.vue | 114 ++ .../demos/pc/app/grid/webdoc/grid-footer.js | 11 + 7 files changed, 385 insertions(+), 1038 deletions(-) create mode 100644 examples/sites/demos/pc/app/grid/footer/update-footer-composition-api.vue create mode 100644 examples/sites/demos/pc/app/grid/footer/update-footer.spec.ts create mode 100644 examples/sites/demos/pc/app/grid/footer/update-footer.vue diff --git a/examples/sites/demos/apis/grid.js b/examples/sites/demos/apis/grid.js index 6ee0ea03a6..1cdc08dea7 100644 --- a/examples/sites/demos/apis/grid.js +++ b/examples/sites/demos/apis/grid.js @@ -155,7 +155,7 @@ export default { 'en-US': 'This field needs to be configured when encapsulating grid-column and is provided for table collection configuration' }, - mode: ['pc'], + mode: ['pc', 'mobile-first'], pcDemo: 'grid-faq#custom-column' }, { @@ -559,7 +559,7 @@ export default { 'zh-CN': '自定义表格 loading ', 'en-US': 'Whether the table is being loaded.' }, - mode: ['pc'], + mode: ['pc', 'mobile-first'], pcDemo: 'grid-loading#loading-grid-custom-loading' }, { @@ -738,7 +738,7 @@ export default { 'zh-CN': '设置列宽拖拽参数', 'en-US': 'Set column width drag parameters' }, - mode: ['pc'], + mode: ['pc', 'mobile-first'], pcDemo: 'grid-size#size-resizable-config', mfDemo: '' }, @@ -1550,20 +1550,9 @@ export default { 'zh-CN': '手动清除单元格激活状态', 'en-US': 'Manually clear cell activation status' }, - mode: ['pc'], + mode: ['pc', 'mobile-first'], pcDemo: 'grid-edit#edit-has-row-change' }, - { - name: 'clearActived()', - type: '', - defaultValue: '', - desc: { - 'zh-CN': '手动清除单元格激活状态', - 'en-US': '' - }, - mode: ['mobile-first'], - mfDemo: '' - }, { name: 'clearAll', type: '() => void', @@ -1574,21 +1563,9 @@ export default { 'en-US': 'Manually clear all conditions in the table and restore the table to the initial state. (This may be used in the scenario of adding, deleting, modifying, and querying, for example, clearing the table cache after data is saved.)' }, - mode: ['pc'], + mode: ['pc', 'mobile-first'], pcDemo: 'grid-toolbar#toolbar-insert-delete-update' }, - { - name: 'clearAll()', - type: '', - defaultValue: '', - desc: { - 'zh-CN': - '手动清除表格所有条件,还原到初始状态(对于增删改查的场景中可能会用到,比如在数据保存之后清除表格缓存)', - 'en-US': '' - }, - mode: ['mobile-first'], - mfDemo: '' - }, { name: 'clearCurrentColumn', type: '() => void', @@ -1597,20 +1574,9 @@ export default { 'zh-CN': '用于当前列,手动清空当前高亮的状态', 'en-US': 'This command is used to manually clear the current highlighted status.' }, - mode: ['pc'], + mode: ['pc', 'mobile-first'], pcDemo: 'grid-highlight#highlight-highlight-current-column' }, - { - name: 'clearCurrentColumn()', - type: '', - defaultValue: '', - desc: { - 'zh-CN': '用于当前列,手动清空当前高亮的状态', - 'en-US': '' - }, - mode: ['mobile-first'], - mfDemo: '' - }, { name: 'clearCurrentRow', type: '() => void', @@ -1619,20 +1585,9 @@ export default { 'zh-CN': '用于当前行,手动清空当前高亮的状态', 'en-US': 'For the current line. Manually clear the highlighted status.' }, - mode: ['pc'], + mode: ['pc', 'mobile-first'], pcDemo: 'grid-highlight#highlight-highlight-current-row' }, - { - name: 'clearCurrentRow()', - type: '', - defaultValue: '', - desc: { - 'zh-CN': '用于当前行,手动清空当前高亮的状态', - 'en-US': '' - }, - mode: ['mobile-first'], - mfDemo: '' - }, { name: 'clearData', typeAnchorName: 'IRow', @@ -1644,21 +1599,9 @@ export default { 'en-US': 'Manually clear the cell content. If no parameter is transferred, the entire table content is cleared. If a row is transferred, the specified row content is cleared. If a specified field is transferred, the field content is cleared.' }, - mode: ['pc'], + mode: ['pc', 'mobile-first'], pcDemo: 'grid-toolbar#toolbar-clear-data' }, - { - name: 'clearData(rows, field)', - type: '', - defaultValue: '', - desc: { - 'zh-CN': - '手动清空单元格内容,如果不传参数,则清空整个表格内容,如果传了行则清空指定行内容,如果传了指定字段,则清空该字段内容', - 'en-US': '' - }, - mode: ['mobile-first'], - mfDemo: '' - }, { name: 'clearFilter', type: '(field: string)=> void', @@ -1668,20 +1611,9 @@ export default { 'en-US': 'Manually clear the filter criteria (if field is not transferred, all filter criteria are cleared). Data will be restored to the unfiltered state.' }, - mode: ['pc'], + mode: ['pc', 'mobile-first'], pcDemo: 'grid-filter#filter-default-filter' }, - { - name: 'clearFilter(field)', - type: '', - defaultValue: '', - desc: { - 'zh-CN': '手动清空筛选条件(如果不传 field 则清空所有筛选条件),数据会恢复成未筛选的状态', - 'en-US': '' - }, - mode: ['mobile-first'], - mfDemo: '' - }, { name: 'clearRadioRow', type: '() => void', @@ -1690,20 +1622,9 @@ export default { 'zh-CN': '用于单选行,手动清空用户的选择', 'en-US': 'This is used to select a single row. Manually clear the user selection.' }, - mode: ['pc'], + mode: ['pc', 'mobile-first'], pcDemo: 'grid-operation-column#operation-column-clear-and-set-radio-row' }, - { - name: 'clearRadioRow()', - type: '', - defaultValue: '', - desc: { - 'zh-CN': '用于单选行,手动清空用户的选择', - 'en-US': '' - }, - mode: ['mobile-first'], - mfDemo: '' - }, { name: 'clearRowExpand', type: '() => void', @@ -1712,20 +1633,9 @@ export default { 'zh-CN': '手动清空展开行状态,数据会恢复成未展开的状态', 'en-US': 'Manually clear the expanded row status. The data will be restored to the unexpanded state.' }, - mode: ['pc'], + mode: ['pc', 'mobile-first'], pcDemo: 'grid-expand#expand-set-row-expansion' }, - { - name: 'clearRowExpand()', - type: '', - defaultValue: '', - desc: { - 'zh-CN': '手动清空展开行状态,数据会恢复成未展开的状态', - 'en-US': '' - }, - mode: ['mobile-first'], - mfDemo: '' - }, { name: 'clearScroll', type: '() => void', @@ -1734,20 +1644,9 @@ export default { 'zh-CN': '手动清除滚动相关信息,还原到初始状态', 'en-US': 'Manually clear scrolling information and restore the original state.' }, - mode: ['pc'], + mode: ['pc', 'mobile-first'], pcDemo: 'grid-size#size-max-min-grid-height' }, - { - name: 'clearScroll()', - type: '', - defaultValue: '', - desc: { - 'zh-CN': '手动清除滚动相关信息,还原到初始状态', - 'en-US': '' - }, - mode: ['mobile-first'], - mfDemo: '' - }, { name: 'clearSelected', type: '() => void', @@ -1756,20 +1655,9 @@ export default { 'zh-CN': '手动清除单元格选中状态', 'en-US': 'Clear cell selection manually' }, - mode: ['pc'], + mode: ['pc', 'mobile-first'], pcDemo: 'grid-highlight#highlight-highlight-cell' }, - { - name: 'clearSelected()', - type: '', - defaultValue: '', - desc: { - 'zh-CN': '手动清除单元格选中状态', - 'en-US': '' - }, - mode: ['mobile-first'], - mfDemo: '' - }, { name: 'clearSelection', type: '() => void', @@ -1778,20 +1666,9 @@ export default { 'zh-CN': '用于多选行,手动清空用户的选择', 'en-US': 'For selecting multiple lines. Manually clear the user selection.' }, - mode: ['pc'], + mode: ['pc', 'mobile-first'], pcDemo: 'grid-operation-column#operation-column-selection-operation' }, - { - name: 'clearSelection()', - type: '', - defaultValue: '', - desc: { - 'zh-CN': '用于多选行,手动清空用户的选择', - 'en-US': '' - }, - mode: ['mobile-first'], - mfDemo: '' - }, { name: 'clearSort', type: '() => void', @@ -1800,20 +1677,9 @@ export default { 'zh-CN': '手动清空排序条件,数据会恢复成未排序的状态', 'en-US': 'Manually clear the sorting conditions. Data will be restored to the unsorted state.' }, - mode: ['pc'], + mode: ['pc', 'mobile-first'], pcDemo: 'grid-sort#sort-default-sort' }, - { - name: 'clearSort()', - type: '', - defaultValue: '', - desc: { - 'zh-CN': '手动清空排序条件,数据会恢复成未排序的状态', - 'en-US': '' - }, - mode: ['mobile-first'], - mfDemo: '' - }, { name: 'clearTreeExpand', type: '() => void', @@ -1823,20 +1689,9 @@ export default { 'en-US': 'Manually clear the expanded state of the tree node. The data will be restored to the un-folded state.' }, - mode: ['pc'], + mode: ['pc', 'mobile-first'], pcDemo: 'grid-tree-table#tree-table-tree-grid-insert-delete-update' }, - { - name: 'clearTreeExpand()', - type: '', - defaultValue: '', - desc: { - 'zh-CN': '手动清空树形节点的展开状态,数据会恢复成未展开的状态', - 'en-US': '' - }, - mode: ['mobile-first'], - mfDemo: '' - }, { name: 'closeFilter', type: '() => void', @@ -1845,20 +1700,9 @@ export default { 'zh-CN': '手动关闭筛选面板(某些特殊场景可能会用到)', 'en-US': 'Manually close the filter panel (which may be used in some special scenarios)' }, - mode: ['pc'], + mode: ['pc', 'mobile-first'], pcDemo: 'grid-filter#filter-default-filter' }, - { - name: 'closeFilter()', - type: '', - defaultValue: '', - desc: { - 'zh-CN': '手动关闭筛选面板(某些特殊场景可能会用到)', - 'en-US': '' - }, - mode: ['mobile-first'], - mfDemo: '' - }, { name: 'closeMenu', type: '() => void', @@ -1867,31 +1711,9 @@ export default { 'zh-CN': '手动关闭快捷菜单(某些特殊场景可能会用到)', 'en-US': 'Manually close the shortcut menu (which may be used in some special scenarios)' }, - mode: ['pc'], + mode: ['pc', 'mobile-first'], pcDemo: 'grid-context-menu#context-menu-cell-menu' }, - { - name: 'closeMenu()', - type: '', - defaultValue: '', - desc: { - 'zh-CN': '手动关闭快捷菜单(某些特殊场景可能会用到)', - 'en-US': '' - }, - mode: ['mobile-first'], - mfDemo: '' - }, - { - name: 'createData(records)', - type: '', - defaultValue: '', - desc: { - 'zh-CN': '创建 data 对象(对于某些特殊场景可能会用到,会自动对数据的字段名进行检测,如果不存在就自动定义)', - 'en-US': '' - }, - mode: ['mobile-first'], - mfDemo: '' - }, { name: 'createRow', typeAnchorName: 'IRow', @@ -1902,20 +1724,9 @@ export default { 'en-US': 'Create a IRow | IRows object. (This method may be used when data needs to be manually inserted in some special scenarios.)' }, - mode: ['pc'], + mode: ['pc', 'mobile-first'], pcDemo: 'grid-tree-table#tree-table-tree-grid-insert-delete-update' }, - { - name: 'createRow(records)', - type: '', - defaultValue: '', - desc: { - 'zh-CN': '创建 Row|Rows 对象(对于某些特殊场景需要对数据进行手动插入时可能会用到)', - 'en-US': '' - }, - mode: ['mobile-first'], - mfDemo: '' - }, { name: 'exportCsv', typeAnchorName: 'IExportCsvOptions', @@ -1926,20 +1737,9 @@ export default { 'en-US': 'Exports table data to a .csv file. (All mainstream browsers are supported. IRows or columns cannot be combined.)' }, - mode: ['pc'], + mode: ['pc', 'mobile-first'], pcDemo: 'grid-import-export#import-export-export-excel' }, - { - name: 'exportCsv(options)', - type: '', - defaultValue: '', - desc: { - 'zh-CN': '将表格数据导出为 .csv 文件(支持所有主流的浏览器,不支持合并行或列)', - 'en-US': '' - }, - mode: ['mobile-first'], - mfDemo: '' - }, { name: 'fullValidate', typeAnchorName: 'IRow', @@ -1950,20 +1750,9 @@ export default { 'en-US': 'Complete table verification function. The difference between this function and validate is that all rules of full data are verified.' }, - mode: ['pc'], + mode: ['pc', 'mobile-first'], pcDemo: 'grid-validation#validation-before-submit-validation' }, - { - name: 'fullValidate(rows, callback)', - type: '', - defaultValue: '', - desc: { - 'zh-CN': '表格完整校验函数,和 validate 的区别就是会对全量数据的所有规则进行完整校验', - 'en-US': '' - }, - mode: ['mobile-first'], - mfDemo: '' - }, { name: 'getActiveRow', typeAnchorName: 'IRow', @@ -1973,20 +1762,9 @@ export default { 'zh-CN': '获取已激活的行数据', 'en-US': 'Obtain activated row data' }, - mode: ['pc'], + mode: ['pc', 'mobile-first'], pcDemo: 'grid-edit#edit-trigger-mode-hm-editing' }, - { - name: 'getActiveRow()', - type: '', - defaultValue: '', - desc: { - 'zh-CN': '获取已激活的行数据', - 'en-US': '' - }, - mode: ['mobile-first'], - mfDemo: '' - }, { name: 'getColumnByField', typeAnchorName: 'IColumnConfig', @@ -1996,20 +1774,9 @@ export default { 'zh-CN': '根据列的字段名获取列', 'en-US': 'Obtain columns based on column field names.' }, - mode: ['pc'], + mode: ['pc', 'mobile-first'], pcDemo: 'grid-large-data#large-data-scroll-to' }, - { - name: 'getColumnByField(field)', - type: '', - defaultValue: '', - desc: { - 'zh-CN': '根据列的字段名获取列', - 'en-US': '' - }, - mode: ['mobile-first'], - mfDemo: '' - }, { name: 'getColumnById', typeAnchorName: 'IColumnConfig', @@ -2019,20 +1786,9 @@ export default { 'zh-CN': '根据列的唯一主键获取列', 'en-US': 'Obtain a column based on the unique primary key of the column.' }, - mode: ['pc'], + mode: ['pc', 'mobile-first'], pcDemo: '' }, - { - name: 'getColumnById(colid)', - type: '', - defaultValue: '', - desc: { - 'zh-CN': '根据列的唯一主键获取列', - 'en-US': '' - }, - mode: ['mobile-first'], - mfDemo: '' - }, { name: 'getColumnIndex', typeAnchorName: 'IColumnConfig', @@ -2042,20 +1798,9 @@ export default { 'zh-CN': '根据 column 获取相对于 columns 中的索引', 'en-US': 'Obtain the index relative to the column based on the column.' }, - mode: ['pc'], + mode: ['pc', 'mobile-first'], pcDemo: '' }, - { - name: 'getColumnIndex(column)', - type: '', - defaultValue: '', - desc: { - 'zh-CN': '根据 column 获取相对于 columns 中的索引', - 'en-US': '' - }, - mode: ['mobile-first'], - mfDemo: '' - }, { name: 'getColumnNode', typeAnchorName: 'IColumnConfig', @@ -2065,20 +1810,9 @@ export default { 'zh-CN': '根据 th/td 元素获取对应的 column 信息', 'en-US': 'Obtain the column information based on the th/td element.' }, - mode: ['pc'], + mode: ['pc', 'mobile-first'], pcDemo: '' }, - { - name: 'getColumnNode(cell)', - type: '', - defaultValue: '', - desc: { - 'zh-CN': '根据 th/td 元素获取对应的 column 信息', - 'en-US': '' - }, - mode: ['mobile-first'], - mfDemo: '' - }, { name: 'getColumns', typeAnchorName: 'IColumnConfig', @@ -2088,20 +1822,9 @@ export default { 'zh-CN': '获取表格的可视列,也可以指定索引获取列', 'en-US': 'Obtains the visual column of the table or specifies the index to obtain the column.' }, - mode: ['pc'], + mode: ['pc', 'mobile-first'], pcDemo: 'grid-custom#custom-server-storage' }, - { - name: 'getColumns(columnIndex)', - type: '', - defaultValue: '', - desc: { - 'zh-CN': '获取表格的可视列,也可以指定索引获取列', - 'en-US': '' - }, - mode: ['mobile-first'], - mfDemo: '' - }, { name: 'getCurrentRow', typeAnchorName: 'IRow', @@ -2111,20 +1834,9 @@ export default { 'zh-CN': '用于当前行,获取当前行的数据', 'en-US': 'This is used for the current row to obtain the data of the current row.' }, - mode: ['pc'], + mode: ['pc', 'mobile-first'], pcDemo: 'grid-event#event-get-row-method' }, - { - name: 'getCurrentRow()', - type: '', - defaultValue: '', - desc: { - 'zh-CN': '用于当前行,获取当前行的数据', - 'en-US': '' - }, - mode: ['mobile-first'], - mfDemo: '' - }, { name: 'getData', typeAnchorName: 'IRow', @@ -2135,20 +1847,9 @@ export default { 'en-US': 'The behavior of obtaining data is the same as that of data. You can also specify an index to obtain data.' }, - mode: ['pc'], + mode: ['pc', 'mobile-first'], pcDemo: 'grid-toolbar#toolbar-clear-data' }, - { - name: 'getData(rowIndex)', - type: '', - defaultValue: '', - desc: { - 'zh-CN': '获取数据,和 data 的行为一致,也可以指定索引获取数据', - 'en-US': '' - }, - mode: ['mobile-first'], - mfDemo: '' - }, { name: 'getInsertRecords', typeAnchorName: 'IRow', @@ -2158,20 +1859,9 @@ export default { 'zh-CN': '获取新增的数据', 'en-US': 'Obtain the new data' }, - mode: ['pc'], + mode: ['pc', 'mobile-first'], pcDemo: 'grid-toolbar#toolbar-insert-delete-update' }, - { - name: 'getInsertRecords()', - type: '', - defaultValue: '', - desc: { - 'zh-CN': '获取新增的数据', - 'en-US': '' - }, - mode: ['mobile-first'], - mfDemo: '' - }, { name: 'getRadioRow', typeAnchorName: 'IRow', @@ -2181,20 +1871,9 @@ export default { 'zh-CN': '用于单选行,获取当已选中的数据', 'en-US': 'This command is used to select a single row to obtain the selected data.' }, - mode: ['pc'], + mode: ['pc', 'mobile-first'], pcDemo: 'grid-event#event-get-row-method' }, - { - name: 'getRadioRow()', - type: '', - defaultValue: '', - desc: { - 'zh-CN': '用于单选行,获取当已选中的数据', - 'en-US': '' - }, - mode: ['mobile-first'], - mfDemo: '' - }, { name: 'getRecordset', typeAnchorName: 'IRecordset', @@ -2205,20 +1884,9 @@ export default { 'en-US': 'Obtaining a table data set (Obtain the data of adding, deleting, and changing. It is very convenient for adding, deleting, modifying, and querying tables.)' }, - mode: ['pc'], + mode: ['pc', 'mobile-first'], pcDemo: 'grid-toolbar#toolbar-insert-delete-update' }, - { - name: 'getRecordset()', - type: '', - defaultValue: '', - desc: { - 'zh-CN': '获取表格数据集(获取新增、删除、更改的数据,对于增删改查表格非常方便)', - 'en-US': '' - }, - mode: ['mobile-first'], - mfDemo: '' - }, { name: 'getRemoveRecords', typeAnchorName: 'IRow', @@ -2228,20 +1896,9 @@ export default { 'zh-CN': '获取已删除的数据', 'en-US': 'Obtain deleted data' }, - mode: ['pc'], + mode: ['pc', 'mobile-first'], pcDemo: 'grid-toolbar#toolbar-insert-delete-update' }, - { - name: 'getRemoveRecords()', - type: '', - defaultValue: '', - desc: { - 'zh-CN': '获取已删除的数据', - 'en-US': '' - }, - mode: ['mobile-first'], - mfDemo: '' - }, { name: 'getRowById', typeAnchorName: 'IRow', @@ -2251,20 +1908,9 @@ export default { 'zh-CN': '根据行的唯一主键获取行', 'en-US': 'Obtain a row based on the unique primary key of the row.' }, - mode: ['pc'], + mode: ['pc', 'mobile-first'], pcDemo: 'grid-event#event-get-row-method' }, - { - name: 'getRowById(rowid)', - type: '', - defaultValue: '', - desc: { - 'zh-CN': '根据行的唯一主键获取行', - 'en-US': '' - }, - mode: ['mobile-first'], - mfDemo: '' - }, { name: 'getRowIndex', typeAnchorName: 'IRow', @@ -2274,20 +1920,9 @@ export default { 'zh-CN': '根据 row 获取相对于 data 中的索引', 'en-US': 'Obtains indexes relative to data based on rows.' }, - mode: ['pc'], + mode: ['pc', 'mobile-first'], pcDemo: 'grid-event#event-get-row-method' }, - { - name: 'getRowIndex(row:Object)', - type: '', - defaultValue: '', - desc: { - 'zh-CN': '根据 row 获取相对于 data 中的索引', - 'en-US': '' - }, - mode: ['mobile-first'], - mfDemo: '' - }, { name: 'getRowNode', typeAnchorName: 'IRow', @@ -2297,20 +1932,9 @@ export default { 'zh-CN': '根据 tr 元素获取对应的 row 信息', 'en-US': 'Obtain row information based on the tr element.' }, - mode: ['pc'], + mode: ['pc', 'mobile-first'], pcDemo: 'grid-event#event-get-row-method' }, - { - name: 'getRowNode(tr)', - type: '', - defaultValue: '', - desc: { - 'zh-CN': '根据 tr 元素获取对应的 row 信息', - 'en-US': '' - }, - mode: ['mobile-first'], - mfDemo: '' - }, { name: 'getAllSelection', typeAnchorName: 'IRow', @@ -2323,7 +1947,7 @@ export default { 'zh-CN': '获取所有翻页中保存的已选中的数据', 'en-US': 'This command is used to select multiple lines to obtain the selected data.' }, - mode: ['pc'], + mode: ['pc', 'mobile-first'], pcDemo: 'grid-operation-column#operation-column-grid-pager-reserve' }, { @@ -2335,20 +1959,9 @@ export default { 'zh-CN': '用于多选行,获取当前页已选中的数据', 'en-US': 'This command is used to select multiple lines to obtain the selected data.' }, - mode: ['pc'], + mode: ['pc', 'mobile-first'], pcDemo: 'grid-toolbar#toolbar-insert-delete-update' }, - { - name: 'getSelectRecords(notCopy)', - type: '', - defaultValue: '', - desc: { - 'zh-CN': '用于多选行,获取已选中的数据', - 'en-US': '' - }, - mode: ['mobile-first'], - mfDemo: '' - }, { name: 'getTableColumn', typeAnchorName: 'IRow', @@ -2359,20 +1972,9 @@ export default { 'en-US': 'Obtains columns in the current table. (full table header column, full table header column after processing condition, table header column in current rendering)' }, - mode: ['pc'], + mode: ['pc', 'mobile-first'], pcDemo: 'grid-custom#custom-hide-column' }, - { - name: 'getTableColumn()', - type: '', - defaultValue: '', - desc: { - 'zh-CN': '获取当前表格的列(完整的全量表头列、处理条件之后的全量表头列、当前渲染中的表头列)', - 'en-US': '' - }, - mode: ['mobile-first'], - mfDemo: '' - }, { name: 'getTableData', typeAnchorName: 'IRow', @@ -2384,21 +1986,9 @@ export default { 'en-US': 'Obtains data in the current table. (complete table body data, full table body data after processing conditions, table body data in the current rendering, table tail data in the current rendering)' }, - mode: ['pc'], + mode: ['pc', 'mobile-first'], pcDemo: 'grid-toolbar#toolbar-clear-data' }, - { - name: 'getTableData()', - type: '', - defaultValue: '', - desc: { - 'zh-CN': - '获取当前表格的数据(完整的全量表体数据、处理条件之后的全量表体数据、当前渲染中的表体数据、当前渲染中的表尾数据)', - 'en-US': '' - }, - mode: ['mobile-first'], - mfDemo: '' - }, { name: 'getUpdateRecords', typeAnchorName: 'IRow', @@ -2408,20 +1998,9 @@ export default { 'zh-CN': '获取已修改的数据', 'en-US': 'Obtain modified data' }, - mode: ['pc'], + mode: ['pc', 'mobile-first'], pcDemo: 'grid-toolbar#toolbar-insert-delete-update' }, - { - name: 'getUpdateRecords()', - type: '', - defaultValue: '', - desc: { - 'zh-CN': '获取已修改的数据', - 'en-US': '' - }, - mode: ['mobile-first'], - mfDemo: '' - }, { name: 'handleFetch', type: '() => Promise', @@ -2430,20 +2009,9 @@ export default { 'zh-CN': '触发表格的 fetch-data ', 'en-US': 'Fetch-data of the trigger table' }, - mode: ['pc'], + mode: ['pc', 'mobile-first'], pcDemo: 'grid-data-source#data-source-request-service' }, - { - name: 'handleFetch()', - type: '', - defaultValue: '', - desc: { - 'zh-CN': '触发表格的fetch-data', - 'en-US': '' - }, - mode: ['mobile-first'], - mfDemo: '' - }, { name: 'hasActiveRow', typeAnchorName: 'IRow', @@ -2453,20 +2021,9 @@ export default { 'zh-CN': '检查行是否已激活为编辑状态', 'en-US': 'Check whether the row has been activated and is in the editing state.' }, - mode: ['pc'], + mode: ['pc', 'mobile-first'], pcDemo: 'grid-edit#edit-trigger-mode-hm-editing' }, - { - name: 'hasActiveRow(row)', - type: '', - defaultValue: '', - desc: { - 'zh-CN': '检查行是否已激活为编辑状态', - 'en-US': '' - }, - mode: ['mobile-first'], - mfDemo: '' - }, { name: 'hasRowChange', typeAnchorName: 'IRow', @@ -2476,20 +2033,9 @@ export default { 'zh-CN': '检查行或列数据是否发生改变', 'en-US': 'Check whether the row or column data is changed.' }, - mode: ['pc'], + mode: ['pc', 'mobile-first'], pcDemo: 'grid-edit#edit-has-row-change' }, - { - name: 'hasRowChange(row, field)', - type: '', - defaultValue: '', - desc: { - 'zh-CN': '检查行或列数据是否发生改变', - 'en-US': '' - }, - mode: ['mobile-first'], - mfDemo: '' - }, { name: 'hasRowExpand', typeAnchorName: 'IRow', @@ -2499,20 +2045,9 @@ export default { 'zh-CN': '检查行是否已展开', 'en-US': 'Check whether the row is expanded.' }, - mode: ['pc'], + mode: ['pc', 'mobile-first'], pcDemo: 'grid-expand#expand-has-row-expand' }, - { - name: 'hasRowExpand(row)', - type: '', - defaultValue: '', - desc: { - 'zh-CN': '检查行是否已展开', - 'en-US': '' - }, - mode: ['mobile-first'], - mfDemo: '' - }, { name: 'hasTreeExpand', typeAnchorName: 'IRow', @@ -2522,20 +2057,9 @@ export default { 'zh-CN': '检查树节点是否已展开', 'en-US': 'Check whether the tree node is expanded.' }, - mode: ['pc'], + mode: ['pc', 'mobile-first'], pcDemo: 'grid-tree-table#tree-table-has-tree-expand' }, - { - name: 'hasTreeExpand(row)', - type: '', - defaultValue: '', - desc: { - 'zh-CN': '检查树节点是否已展开', - 'en-US': '' - }, - mode: ['mobile-first'], - mfDemo: '' - }, { name: 'hideColumn', typeAnchorName: 'IColumnConfig', @@ -2545,20 +2069,9 @@ export default { 'zh-CN': '隐藏指定列', 'en-US': 'Hide a specified column.' }, - mode: ['pc'], + mode: ['pc', 'mobile-first'], pcDemo: 'grid-custom#custom-hide-column' }, - { - name: 'hideColumn(column)', - type: '', - defaultValue: '', - desc: { - 'zh-CN': '隐藏指定列', - 'en-US': '' - }, - mode: ['mobile-first'], - mfDemo: '' - }, { name: 'insert', typeAnchorName: 'IRow', @@ -2569,20 +2082,9 @@ export default { 'en-US': 'Add data to the table.; Insert data into the table, add one or more rows of data from the first row' }, - mode: ['pc'], + mode: ['pc', 'mobile-first'], pcDemo: 'grid-toolbar#toolbar-insert-delete-update' }, - { - name: 'insert(records)', - type: '', - defaultValue: '', - desc: { - 'zh-CN': '在表格中新增数据', - 'en-US': '' - }, - mode: ['mobile-first'], - mfDemo: '' - }, { name: 'insertAt', typeAnchorName: 'IRow', @@ -2594,21 +2096,9 @@ export default { 'en-US': 'Inserts one or more rows into a table. Second parameter: row specified position (tree tables are not supported), null inserted from the first row, and –1 inserted from the last row' }, - mode: ['pc'], + mode: ['pc', 'mobile-first'], pcDemo: 'grid-toolbar#toolbar-insert-remove-rows' }, - { - name: 'insertAt(records, row)', - type: '', - defaultValue: '', - desc: { - 'zh-CN': - '往表格插入数据,从指定位置插入一行或多行;第二个参数:row 指定位置(不支持树表格)、null从第一行插入、-1 从最后插入', - 'en-US': '' - }, - mode: ['mobile-first'], - mfDemo: '' - }, { name: 'loadColumn', typeAnchorName: 'IColumnConfig', @@ -2619,20 +2109,9 @@ export default { 'en-US': 'Load column configuration (This function may be used in the scenario where table columns need to be reloaded or partially incremented.)' }, - mode: ['pc'], + mode: ['pc', 'mobile-first'], pcDemo: 'grid-large-data#large-data-load-column' }, - { - name: 'loadColumn(columns)', - type: '', - defaultValue: '', - desc: { - 'zh-CN': '加载列配置(对于表格列需要重载、局部递增场景下可能会用到)', - 'en-US': '' - }, - mode: ['mobile-first'], - mfDemo: '' - }, { name: 'loadData', typeAnchorName: 'IRow', @@ -2643,20 +2122,9 @@ export default { 'en-US': 'Load data (This parameter may be used in the scenario where table data needs to be reloaded or partially incremented.)' }, - mode: ['pc'], + mode: ['pc', 'mobile-first'], pcDemo: 'grid-large-data#large-data-full-data-loading' }, - { - name: 'loadData(data)', - type: '', - defaultValue: '', - desc: { - 'zh-CN': '加载数据(对于表格数据需要重载、局部递增场景下可能会用到)', - 'en-US': '' - }, - mode: ['mobile-first'], - mfDemo: '' - }, { name: 'recalculate', type: '() => Promise', @@ -2666,20 +2134,9 @@ export default { 'en-US': 'Recalculate the table. (This may be used in some special scenarios, such as hidden tables and column width update.)' }, - mode: ['pc'], + mode: ['pc', 'mobile-first'], pcDemo: 'grid-size#size-recalculate' }, - { - name: 'recalculate()', - type: '', - defaultValue: '', - desc: { - 'zh-CN': '重新计算表格(对于某些特殊场景可能会用到,比如隐藏的表格、更新列宽...等)', - 'en-US': '' - }, - mode: ['mobile-first'], - mfDemo: '' - }, { name: 'refreshColumn', type: '() => Promise', @@ -2689,20 +2146,9 @@ export default { 'en-US': 'Refresh column configuration (This parameter may be used in the scenario of displaying or hiding columns.)' }, - mode: ['pc'], + mode: ['pc', 'mobile-first'], pcDemo: 'grid-custom#custom-hide-column' }, - { - name: 'refreshColumn()', - type: '', - defaultValue: '', - desc: { - 'zh-CN': '刷新列配置(对于显示/隐藏列场景下可能会用到)', - 'en-US': '' - }, - mode: ['mobile-first'], - mfDemo: '' - }, { name: 'refreshData', type: '() => Promise', @@ -2713,21 +2159,9 @@ export default { 'en-US': 'Data data is refreshed synchronously. If this method is used, the component does not record the status of adding, deleting, and modifying, and can only implement the corresponding logic. (This parameter may be used in some special scenarios, for example, when a node element in a deep tree changes.)' }, - mode: ['pc'], + mode: ['pc', 'mobile-first'], pcDemo: 'grid-tree-table#tree-table-tree-grid-insert-delete-update' }, - { - name: 'refreshData()', - type: '', - defaultValue: '', - desc: { - 'zh-CN': - '同步刷新 data 数据;如果用了该方法,那么组件将不再记录增删改的状态,只能自行实现对应逻辑(对于某些特殊的场景,比如深层树节点元素发生变动时可能会用到)', - 'en-US': '' - }, - mode: ['mobile-first'], - mfDemo: '' - }, { name: 'reloadCustoms', typeAnchorName: 'IColumnConfig', @@ -2739,20 +2173,9 @@ export default { 'en-US': 'Initialize loading to display or hide columns (which may be used in asynchronous update scenarios).' }, - mode: ['pc'], + mode: ['pc', 'mobile-first'], pcDemo: 'grid-custom#custom-server-storage' }, - { - name: 'reloadCustoms(customs, sort)', - type: '', - defaultValue: '', - desc: { - 'zh-CN': '初始化加载显示/隐藏列(对于异步更新的场景下可能会用到)', - 'en-US': '' - }, - mode: ['mobile-first'], - mfDemo: '' - }, { name: 'remove', typeAnchorName: 'IRow', @@ -2763,20 +2186,9 @@ export default { 'en-US': 'Deletes data in a specified row. Multiple data records in a specified row or [row, ...] are deleted. If the value is empty, all data records are deleted.' }, - mode: ['pc'], + mode: ['pc', 'mobile-first'], pcDemo: 'grid-toolbar#toolbar-insert-delete-update' }, - { - name: 'remove(rows)', - type: '', - defaultValue: '', - desc: { - 'zh-CN': '删除指定行数据,指定 row 或 [row, ...] 删除多条数据,如果为空则删除所有数据', - 'en-US': '' - }, - mode: ['mobile-first'], - mfDemo: '' - }, { name: 'removeSelecteds', type: '() => Promise', @@ -2785,20 +2197,9 @@ export default { 'zh-CN': '删除已选中的所有行数据', 'en-US': 'Delete all selected rows.' }, - mode: ['pc'], + mode: ['pc', 'mobile-first'], pcDemo: 'grid-toolbar#toolbar-insert-delete-update' }, - { - name: 'removeSelecteds()', - type: '', - defaultValue: '', - desc: { - 'zh-CN': '删除已选中的所有行数据', - 'en-US': '' - }, - mode: ['mobile-first'], - mfDemo: '' - }, { name: 'resetAll', type: '() => void', @@ -2808,20 +2209,9 @@ export default { 'en-US': 'Manually reset all operations in the column to the initial state. If the toolbar has been associated, the operations will be updated accordingly.' }, - mode: ['pc'], + mode: ['pc', 'mobile-first'], pcDemo: 'grid-custom#custom-reset-resizable' }, - { - name: 'resetAll()', - type: '', - defaultValue: '', - desc: { - 'zh-CN': '手动重置列的所有操作,还原到初始状态(如果已关联工具栏,则会同步更新)', - 'en-US': '' - }, - mode: ['mobile-first'], - mfDemo: '' - }, { name: 'resetCustoms', type: '() => Promise', @@ -2831,20 +2221,9 @@ export default { 'en-US': 'Manually reset the display/hide operations of columns to restore the initial status (if the toolbar has been associated, it will be updated accordingly)' }, - mode: ['pc'], + mode: ['pc', 'mobile-first'], pcDemo: 'grid-custom#custom-reset-resizable' }, - { - name: 'resetCustoms()', - type: '', - defaultValue: '', - desc: { - 'zh-CN': '手动重置列的显示/隐藏操作,还原到初始状态(如果已关联工具栏,则会同步更新)', - 'en-US': '' - }, - mode: ['mobile-first'], - mfDemo: '' - }, { name: 'resetResizable', type: '() => Promise', @@ -2854,20 +2233,9 @@ export default { 'en-US': 'Manually reset the column width and drag the column width to the initial state (if the toolbar has been associated, the column width will be updated accordingly).' }, - mode: ['pc'], + mode: ['pc', 'mobile-first'], pcDemo: 'grid-custom#custom-reset-resizable' }, - { - name: 'resetResizable()', - type: '', - defaultValue: '', - desc: { - 'zh-CN': '手动重置列宽拖动的操作,还原到初始状态(如果已关联工具栏,则会同步更新)', - 'en-US': '' - }, - mode: ['mobile-first'], - mfDemo: '' - }, { name: 'revertData', typeAnchorName: 'IRow', @@ -2877,19 +2245,8 @@ export default { 'zh-CN': '还原更改,还原指定行 row 或者整个表格的数据', 'en-US': 'Restore the data of a specified row or the entire table.' }, - mode: ['pc'], - pcDemo: 'grid-edit#edit-revert-data' - }, - { - name: 'revertData(rows, field)', - type: '', - defaultValue: '', - desc: { - 'zh-CN': '还原更改,还原指定行 row 或者整个表格的数据', - 'en-US': '' - }, - mode: ['mobile-first'], - mfDemo: '' + mode: ['pc', 'mobile-first'], + pcDemo: 'grid-edit#edit-revert-data' }, { name: 'scrollTo', @@ -2899,20 +2256,9 @@ export default { 'zh-CN': '如果有滚动条,则滚动到对应的位置', 'en-US': 'If there is a scroll bar, scroll to the corresponding position.' }, - mode: ['pc'], + mode: ['pc', 'mobile-first'], pcDemo: 'grid-large-data#large-data-scroll-to' }, - { - name: 'scrollTo(scrollLeft, scrollTop)', - type: '', - defaultValue: '', - desc: { - 'zh-CN': '如果有滚动条,则滚动到对应的位置', - 'en-US': '' - }, - mode: ['mobile-first'], - mfDemo: '' - }, { name: 'scrollToColumn', typeAnchorName: 'IColumnConfig', @@ -2922,20 +2268,9 @@ export default { 'zh-CN': '如果有滚动条,则滚动到对应的列', 'en-US': 'If there is a scroll bar, scroll to the corresponding column.' }, - mode: ['pc'], + mode: ['pc', 'mobile-first'], pcDemo: 'grid-large-data#large-data-scroll-to' }, - { - name: 'scrollToColumn(column)', - type: '', - defaultValue: '', - desc: { - 'zh-CN': '如果有滚动条,则滚动到对应的列', - 'en-US': '' - }, - mode: ['mobile-first'], - mfDemo: '' - }, { name: 'scrollToRow', typeAnchorName: 'IRow', @@ -2945,20 +2280,9 @@ export default { 'zh-CN': '如果有滚动条,则滚动到对应的行', 'en-US': 'If there is a scroll bar, scroll to the corresponding line.' }, - mode: ['pc'], + mode: ['pc', 'mobile-first'], pcDemo: 'grid-large-data#large-data-scroll-to' }, - { - name: 'scrollToRow(row)', - type: '', - defaultValue: '', - desc: { - 'zh-CN': '如果有滚动条,则滚动到对应的行', - 'en-US': '' - }, - mode: ['mobile-first'], - mfDemo: '' - }, { name: 'setActiveCell', typeAnchorName: 'IRow', @@ -2968,20 +2292,9 @@ export default { 'zh-CN': '激活单元格编辑', 'en-US': 'Activate cell editing' }, - mode: ['pc'], + mode: ['pc', 'mobile-first'], pcDemo: 'grid-edit#edit-trigger-mode-hm-editing' }, - { - name: 'setActiveCell(row, field)', - type: '', - defaultValue: '', - desc: { - 'zh-CN': '激活单元格编辑', - 'en-US': '' - }, - mode: ['mobile-first'], - mfDemo: '' - }, { name: 'setActiveRow', typeAnchorName: 'IRow', @@ -2991,20 +2304,9 @@ export default { 'zh-CN': '激活行编辑,如果是 mode=cell 则默认激活第一个单元格', 'en-US': 'Activate line editing. If mode=cell is selected, the first cell is activated by default.' }, - mode: ['pc'], + mode: ['pc', 'mobile-first'], pcDemo: 'grid-edit#edit-trigger-mode-hm-editing' }, - { - name: 'setActiveRow(row)', - type: '', - defaultValue: '', - desc: { - 'zh-CN': '激活行编辑,如果是 mode=cell 则默认激活第一个单元格', - 'en-US': '' - }, - mode: ['mobile-first'], - mfDemo: '' - }, { name: 'setAllRowExpansion', type: '(checked: boolean)=> Promise', @@ -3013,20 +2315,9 @@ export default { 'zh-CN': '设置所有行的展开与否', 'en-US': 'Set whether to expand all rows.' }, - mode: ['pc'], + mode: ['pc', 'mobile-first'], pcDemo: 'grid-expand#expand-set-row-expansion' }, - { - name: 'setAllRowExpansion(checked)', - type: '', - defaultValue: '', - desc: { - 'zh-CN': '设置所有行的展开与否', - 'en-US': '' - }, - mode: ['mobile-first'], - mfDemo: '' - }, { name: 'setAllSelection', type: '(checked: boolean)=> void', @@ -3036,20 +2327,9 @@ export default { 'en-US': 'The input parameter is boolean, which is used to select multiple lines and set the selected status of all lines.' }, - mode: ['pc'], + mode: ['pc', 'mobile-first'], pcDemo: 'grid-operation-column#operation-column-selection-operation' }, - { - name: 'setAllSelection(checked)', - type: '', - defaultValue: '', - desc: { - 'zh-CN': '用于多选行,设置所有行的选中状态', - 'en-US': '' - }, - mode: ['mobile-first'], - mfDemo: '' - }, { name: 'setAllTreeExpansion', type: '(checked: boolean)=> Promise', @@ -3058,20 +2338,9 @@ export default { 'zh-CN': '设置所有树节点的展开与否', 'en-US': 'Sets whether to expand all tree nodes.' }, - mode: ['pc'], + mode: ['pc', 'mobile-first'], pcDemo: 'grid-tree-table#tree-table-set-tree-expansion' }, - { - name: 'setAllTreeExpansion(checked)', - type: '', - defaultValue: '', - desc: { - 'zh-CN': '设置所有树节点的展开与否', - 'en-US': '' - }, - mode: ['mobile-first'], - mfDemo: '' - }, { name: 'setCurrentRow', typeAnchorName: 'IRow', @@ -3081,20 +2350,9 @@ export default { 'zh-CN': '用于当前行,设置某一行为高亮状态', 'en-US': 'Sets the highlight status of a row for the current row.' }, - mode: ['pc'], + mode: ['pc', 'mobile-first'], pcDemo: 'grid-highlight#highlight-set-current-row' }, - { - name: 'setCurrentRow(row)', - type: '', - defaultValue: '', - desc: { - 'zh-CN': '用于当前行,设置某一行为高亮状态', - 'en-US': '' - }, - mode: ['mobile-first'], - mfDemo: '' - }, { name: 'setRadioRow', typeAnchorName: 'IRow', @@ -3104,20 +2362,9 @@ export default { 'zh-CN': '用于单选行,设置某一行为选中状态', 'en-US': 'Select a row and set the selected status of a row.' }, - mode: ['pc'], + mode: ['pc', 'mobile-first'], pcDemo: 'grid-operation-column#operation-column-clear-and-set-radio-row' }, - { - name: 'setRadioRow(row)', - type: '', - defaultValue: '', - desc: { - 'zh-CN': '用于单选行,设置某一行为选中状态', - 'en-US': '' - }, - mode: ['mobile-first'], - mfDemo: '' - }, { name: 'setRowExpansion', typeAnchorName: 'IRow', @@ -3127,20 +2374,9 @@ export default { 'zh-CN': '设置展开行,第二个参数设置这一行展开与否', 'en-US': 'Set the expansion row, and set whether to expand the row.' }, - mode: ['pc'], + mode: ['pc', 'mobile-first'], pcDemo: 'grid-expand#expand-set-row-expansion' }, - { - name: 'setRowExpansion(rows, checked)', - type: '', - defaultValue: '', - desc: { - 'zh-CN': '设置展开行,二个参数设置这一行展开与否', - 'en-US': '' - }, - mode: ['mobile-first'], - mfDemo: '' - }, { name: 'setSelection', typeAnchorName: 'IRow', @@ -3151,20 +2387,9 @@ export default { 'en-US': 'This parameter is used to select multiple lines. The second parameter is whether to select or not.' }, - mode: ['pc'], + mode: ['pc', 'mobile-first'], pcDemo: 'grid-operation-column#operation-column-selection-operation' }, - { - name: 'setSelection(rows, checked)', - type: '', - defaultValue: '', - desc: { - 'zh-CN': '用于多选行,设置行为选中状态,第二个参数为选中与否', - 'en-US': '' - }, - mode: ['mobile-first'], - mfDemo: '' - }, { name: 'setTreeExpansion', typeAnchorName: 'IRow', @@ -3174,20 +2399,9 @@ export default { 'zh-CN': '设置展开树形节点,第二个参数设置这一行展开与否', 'en-US': 'Set the expansion tree node and set whether to expand the row.' }, - mode: ['pc'], + mode: ['pc', 'mobile-first'], pcDemo: 'grid-tree-table#tree-table-set-tree-expansion' }, - { - name: 'setTreeExpansion(rows, checked)', - type: '', - defaultValue: '', - desc: { - 'zh-CN': '设置展开树形节点,二个参数设置这一行展开与否', - 'en-US': '' - }, - mode: ['mobile-first'], - mfDemo: '' - }, { name: 'showColumn', typeAnchorName: 'IColumnConfig', @@ -3197,20 +2411,9 @@ export default { 'zh-CN': '显示指定列', 'en-US': 'Display the specified column.' }, - mode: ['pc'], + mode: ['pc', 'mobile-first'], pcDemo: 'grid-custom#custom-hide-column' }, - { - name: 'showColumn(column)', - type: '', - defaultValue: '', - desc: { - 'zh-CN': '显示指定列', - 'en-US': '' - }, - mode: ['mobile-first'], - mfDemo: '' - }, { name: 'sort', type: "(field: string, order?: 'asc' | 'desc')=> Promise", @@ -3219,20 +2422,9 @@ export default { 'zh-CN': '手动对表格进行排序(如果 order 为空则自动切换排序)', 'en-US': 'Sort the table manually. If the value of order is empty, the table is automatically sorted.' }, - mode: ['pc'], + mode: ['pc', 'mobile-first'], pcDemo: 'grid-sort#sort-sort' }, - { - name: 'sort(field, order)', - type: '', - defaultValue: '', - desc: { - 'zh-CN': '手动对表格进行排序(如果 order 为空则自动切换排序)', - 'en-US': '' - }, - mode: ['mobile-first'], - mfDemo: '' - }, { name: 'toggleAllSelection', type: '() => Promise', @@ -3241,20 +2433,9 @@ export default { 'zh-CN': '用于多选行,切换所有行的选中状态', 'en-US': 'Selection of multiple lines and switch the selected status of all lines.' }, - mode: ['pc'], + mode: ['pc', 'mobile-first'], pcDemo: 'grid-operation-column#operation-column-selection-operation' }, - { - name: 'toggleAllSelection()', - type: '', - defaultValue: '', - desc: { - 'zh-CN': '用于多选行,切换所有行的选中状态', - 'en-US': '' - }, - mode: ['mobile-first'], - mfDemo: '' - }, { name: 'toggleRowExpansion', typeAnchorName: 'IRow', @@ -3264,20 +2445,9 @@ export default { 'zh-CN': '用于可展开表格,切换展开行', 'en-US': 'For expanding tables or switching rows.' }, - mode: ['pc'], + mode: ['pc', 'mobile-first'], pcDemo: 'grid-expand#expand-set-row-expansion' }, - { - name: 'toggleRowExpansion(row)', - type: '', - defaultValue: '', - desc: { - 'zh-CN': '用于可展开表格,切换展开行', - 'en-US': '' - }, - mode: ['mobile-first'], - mfDemo: '' - }, { name: 'toggleRowSelection', typeAnchorName: 'IRow', @@ -3287,20 +2457,9 @@ export default { 'zh-CN': '用于多选行,切换某一行的选中状态', 'en-US': 'Selection of multiple lines and switch the selected status of a line.' }, - mode: ['pc'], + mode: ['pc', 'mobile-first'], pcDemo: 'grid-operation-column#operation-column-selection-operation' }, - { - name: 'toggleRowSelection(row)', - type: '', - defaultValue: '', - desc: { - 'zh-CN': '用于多选行,切换某一行的选中状态', - 'en-US': '' - }, - mode: ['mobile-first'], - mfDemo: '' - }, { name: 'toggleTreeExpansion', typeAnchorName: 'IRow', @@ -3310,18 +2469,18 @@ export default { 'zh-CN': '用于可树形表格,切换展开树形节点', 'en-US': 'This parameter is used to switch and expand tree nodes in a tree table.' }, - mode: ['pc'], + mode: ['pc', 'mobile-first'], pcDemo: 'grid-tree-table#tree-table-set-tree-expansion' }, { - name: 'toggleTreeExpansion(row)', + name: 'updateFooter', type: '', defaultValue: '', desc: { - 'zh-CN': '用于可树形表格,切换展开树形节点', + 'zh-CN': '更新表尾数据', 'en-US': '' }, - mode: ['mobile-first'], + mode: ['pc', 'mobile-first'], mfDemo: '' }, { @@ -3335,7 +2494,7 @@ export default { 'en-US': 'Table verification function. If a row or rows is specified, the specified row or multiple rows are verified. Otherwise, the entire table is verified. This callback function is called after the verification is complete and the following parameters are transferred: (Whether the verification is successful. The fields in the latest column fail the verification.) If no callback function is passed in, a promise is returned' }, - mode: ['pc'], + mode: ['pc', 'mobile-first'], pcDemo: 'grid-validation#validation-before-submit-validation' }, { @@ -3413,7 +2572,7 @@ export default { 'zh-CN': '列对齐方式', 'en-US': 'Column pair mode; The optional values for this property are left, center, right' }, - mode: ['pc'], + mode: ['pc', 'mobile-first'], pcDemo: 'grid-align#align-grid-align' }, { @@ -3425,7 +2584,7 @@ export default { 'zh-CN': '给单元格附加 className,也可以是函数', 'en-US': 'Add a class name to a cell. The class name can also be the Function' }, - mode: ['pc'], + mode: ['pc', 'mobile-first'], pcDemo: 'grid-custom-style#custom-style-class-name' }, { @@ -3438,7 +2597,7 @@ export default { 'en-US': 'Cell editing rendering configuration item, which can also be the function Function(h, params). Sets the editing type of the table column' }, - mode: ['pc'], + mode: ['pc', 'mobile-first'], pcDemo: 'grid-editor#editor-custom-editor-select' }, { @@ -3449,7 +2608,7 @@ export default { 'zh-CN': '设置表格列的单元格显示字段', 'en-US': 'Set the cell display field for table columns' }, - mode: ['pc'], + mode: ['pc', 'mobile-first'], pcDemo: 'grid#base-basic-usage' }, { @@ -3462,7 +2621,7 @@ export default { 'en-US': 'Set the filtering configuration of the table column. The default value is false. No filtering information is configured.' }, - mode: ['pc'], + mode: ['pc', 'mobile-first'], pcDemo: 'grid-filter#filter-default-filter' }, { @@ -3475,7 +2634,7 @@ export default { 'en-US': 'Fix columns on the left. Freezable can be frozen or unfrozen, but can be operated in the table personalized panel. Frozen can only be frozen but cannot be operated in the personalized panel. Fix the column to the left or right (Note: The fixed columns should be placed on the left and right sides.) The optional values of this attribute are left (fixed left) and right (fixed right)' }, - mode: ['pc'], + mode: ['pc', 'mobile-first'], pcDemo: 'grid-fixed#fixed-left-fixed' }, { @@ -3487,7 +2646,7 @@ export default { 'en-US': 'Alignment mode of the column at the end of the table; The optional values for this property are left, center, right' }, - mode: ['pc'], + mode: ['pc', 'mobile-first'], pcDemo: 'grid-align#align-footer-align' }, { @@ -3499,7 +2658,7 @@ export default { 'zh-CN': '给表尾的单元格附加 className,也可以是函数', 'en-US': 'Add a class name to the cell at the end of the table. The class name can also be the Function' }, - mode: ['pc'], + mode: ['pc', 'mobile-first'], pcDemo: 'grid-custom-style#custom-style-footer-style' }, { @@ -3511,7 +2670,7 @@ export default { 'zh-CN': '开启该列数据异步渲染', 'en-US': 'Enable the asynchronous rendering of the column data' }, - mode: ['pc'], + mode: ['pc', 'mobile-first'], pcDemo: 'grid-renderer#renderer-inner-renderer' }, { @@ -3524,7 +2683,7 @@ export default { 'en-US': 'Sets the display and editing mode of the current table column. Sets the display and obtaining editing type of the current table column. It can also be the function' }, - mode: ['pc'], + mode: ['pc', 'mobile-first'], pcDemo: 'grid-renderer#renderer-inner-renderer' }, { @@ -3536,7 +2695,7 @@ export default { 'en-US': 'The alignment mode of the table header column; The optional values for this property are left, center, right' }, - mode: ['pc'], + mode: ['pc', 'mobile-first'], pcDemo: 'grid-align#align-header-align' }, { @@ -3548,7 +2707,7 @@ export default { 'zh-CN': '设置列头样式名称;给表头的单元格附加 className,也可以是函数', 'en-US': 'Set the column header style name. Add className to the cell in the table header, or the function' }, - mode: ['pc'], + mode: ['pc', 'mobile-first'], pcDemo: 'grid-custom-style#custom-style-header-style' }, { @@ -3560,7 +2719,7 @@ export default { 'zh-CN': '只对 type=index 有效,自定义索引方法', 'en-US': 'This parameter is valid only for type=index' }, - mode: ['pc'], + mode: ['pc', 'mobile-first'], pcDemo: 'grid-serial-column#serial-column-custom-serial-column' }, { @@ -3572,7 +2731,7 @@ export default { 'en-US': 'Minimum column width; The remaining space will be allocated in proportion. The optional values of this property are integers, px,%' }, - mode: ['pc'], + mode: ['pc', 'mobile-first'], pcDemo: 'grid-size#size-min-width' }, { @@ -3585,7 +2744,7 @@ export default { 'en-US': "is an attribute built in the filter object. Whether multiple selections are allowed for filtering. Sets whether to display the check box in the selected column. This parameter is valid only when columnType is set to'select'." }, - mode: ['pc'], + mode: ['pc', 'mobile-first'], pcDemo: 'grid-filter#filter-default-filter' }, { @@ -3596,7 +2755,7 @@ export default { 'zh-CN': '额外的参数(自定义一些数据参数,对于某些特殊的场景可能会用到)', 'en-US': 'Extra parameters (User-defined data parameters, which may be used in some special scenarios)' }, - mode: ['pc'], + mode: ['pc', 'mobile-first'], pcDemo: '' }, { @@ -3607,7 +2766,7 @@ export default { 'zh-CN': '是否使用服务端排序,如果设置为 true 则不会对数据进行处理', 'en-US': 'Whether to use server sorting. If this parameter is set to true, data will not be processed.' }, - mode: ['pc'], + mode: ['pc', 'mobile-first'], pcDemo: 'grid-sort#sort-server-sort' }, { @@ -3621,7 +2780,7 @@ export default { 'en-US': 'Set the rendering type of the table column. The priority of the column is higher than that of the column type attribute. Cell rendering configuration item. Its priority is higher than that of the formatText attribute of the column' }, - mode: ['pc'], + mode: ['pc', 'mobile-first'], pcDemo: 'grid-renderer#renderer-custom-renderer' }, { @@ -3633,7 +2792,7 @@ export default { 'en-US': 'Mandatory. If this parameter is not set, the system will automatically generate a value based on the verification rule.' }, - mode: ['pc'], + mode: ['pc', 'mobile-first'], pcDemo: '' }, { @@ -3645,7 +2804,7 @@ export default { 'en-US': 'Set whether the column width can be adjusted. Allows you to drag the column width to adjust the column size.' }, - mode: ['pc'], + mode: ['pc', 'mobile-first'], pcDemo: 'grid-custom#custom-column-width' }, { @@ -3657,7 +2816,7 @@ export default { 'zh-CN': '表单的验证功能', 'en-US': 'Form verification function' }, - mode: ['pc'], + mode: ['pc', 'mobile-first'], pcDemo: '' }, { @@ -3670,7 +2829,7 @@ export default { 'en-US': 'When the table header content is too long, the ellipsis is displayed. The optional values for this property are ellipsis (only the ellipsis is displayed), title (and the native title is displayed), tooltip (and the tooltip prompt is displayed)' }, - mode: ['pc'], + mode: ['pc', 'mobile-first'], pcDemo: 'grid-tip#tip-column-header-tip' }, { @@ -3681,7 +2840,7 @@ export default { 'zh-CN': '表格列头是否需要提示', 'en-US': 'Whether to prompt the table column header.' }, - mode: ['pc'], + mode: ['pc', 'mobile-first'], pcDemo: 'grid-tip#tip-column-header-tip' }, { @@ -3692,7 +2851,7 @@ export default { 'zh-CN': '是否显示列头编辑图标,在编辑时有效', 'en-US': 'Whether to display the column header editing icon. This parameter is valid during editing.' }, - mode: ['pc'], + mode: ['pc', 'mobile-first'], pcDemo: 'grid-edit#edit-editing' }, { @@ -3705,7 +2864,7 @@ export default { 'en-US': 'When the content is too long, an ellipsis is displayed. The optional values for this property are ellipsis (only the ellipsis is displayed), title (and the native title is displayed), tooltip (and the tooltip is displayed)' }, - mode: ['pc'], + mode: ['pc', 'mobile-first'], pcDemo: 'grid-tip#tip-cell-tip' }, { @@ -3716,7 +2875,7 @@ export default { 'zh-CN': '表格列单元格是否需要提示', 'en-US': 'Does the table column cells require prompts?' }, - mode: ['pc'], + mode: ['pc', 'mobile-first'], pcDemo: 'grid-tip#tip-cell-tip' }, { @@ -3727,7 +2886,7 @@ export default { 'zh-CN': '只对 sortable 有效,自定义排序的属性', 'en-US': 'This parameter is valid only for sortable. It is a user-defined sorting attribute.' }, - mode: ['pc'], + mode: ['pc', 'mobile-first'], pcDemo: 'grid-sort#sort-combinations-sort' }, { @@ -3739,7 +2898,7 @@ export default { 'zh-CN': '自定义所有列的排序方法,当触发排序时会调用该函数', 'en-US': 'Customize the sorting method of all columns. When sorting is triggered.' }, - mode: ['pc'], + mode: ['pc', 'mobile-first'], pcDemo: 'grid-sort#sort-custom-sort' }, { @@ -3750,7 +2909,7 @@ export default { 'zh-CN': '设置该列数据是否可以排序', 'en-US': 'Whether the data in the column can be sorted.; Allow Sorting Columns' }, - mode: ['pc'], + mode: ['pc', 'mobile-first'], pcDemo: 'grid-sort#sort-default-sort' }, { @@ -3761,7 +2920,7 @@ export default { 'zh-CN': '列标题(支持开启国际化),可以是函数', 'en-US': 'Column title (internationalization can be enabled). It can be the function' }, - mode: ['pc'], + mode: ['pc', 'mobile-first'], pcDemo: 'grid#base-basic-usage' }, { @@ -3772,7 +2931,7 @@ export default { 'zh-CN': '只对 tree-config 配置时有效,指定为树节点', 'en-US': 'This parameter is valid only when tree-config is configured. It is specified as a tree node.' }, - mode: ['pc'], + mode: ['pc', 'mobile-first'], pcDemo: 'grid-tree-table#tree-table-tree-grid-base' }, { @@ -3783,7 +2942,7 @@ export default { 'zh-CN': '设置内置列的类型', 'en-US': 'Set the type of the built-in column' }, - mode: ['pc'], + mode: ['pc', 'mobile-first'], pcDemo: 'grid-serial-column#serial-column-default-serial-column' }, { @@ -3796,7 +2955,7 @@ export default { 'en-US': 'Set the column width. The value can be pixel, percentage, or auto. If the value is auto, the column width automatically adapts.; column width; The optional value of this property is integer/px/%' }, - mode: ['pc'], + mode: ['pc', 'mobile-first'], pcDemo: 'grid-size#size-fixed-column-width' } ], @@ -3811,7 +2970,7 @@ export default { '自定义显示内容模板,作用插槽参数说明:slots.default({ $table, column, row },h),$table:表格组件对象,column:当前列配置,row:当前行数据,h:vue的渲染函数', 'en-US': 'Customized display content template' }, - mode: ['pc'], + mode: ['pc', 'mobile-first'], pcDemo: 'grid-slot#slot-default-slot' }, { @@ -3822,7 +2981,7 @@ export default { '自定义可编辑组件模板,作用插槽参数说明:slots.edit({ $table, column, row },h),$table:表格组件对象,column:当前列配置,row:当前行数据,h:vue的渲染函数', 'en-US': 'Customized Editable Component Template' }, - mode: ['pc'], + mode: ['pc', 'mobile-first'], pcDemo: 'grid-slot#slot-editor-slot' }, { @@ -3833,7 +2992,7 @@ export default { '自定义筛选模板,作用插槽参数说明:slots.filter({ $grid, values, args, context },h),$grid:表格组件对象,values:筛选项集合,args:筛选相关参数,context:筛选面板组件上下文对象', 'en-US': 'User-defined filtering template' }, - mode: ['pc'], + mode: ['pc', 'mobile-first'], pcDemo: 'grid-filter#filter-custom-filter' }, { @@ -3844,7 +3003,7 @@ export default { '自定义表头内容的模板,作用插槽参数说明:slots.header({ $table, column, columnIndex,$rowIndex},h),$table:表格组件对象,column:当前列配置,columnIndex:当前列索引,$rowIndex:当前行索引,h:vue的渲染函数', 'en-US': 'Template of custom table header content' }, - mode: ['pc'], + mode: ['pc', 'mobile-first'], pcDemo: 'grid-slot#slot-header-slot' } ] @@ -3862,7 +3021,7 @@ export default { 'en-US': 'Intercept method before full screen is disabled. If false is returned, the full screen is disabled. If true is returned, the full screen is not disabled.' }, - mode: ['pc'], + mode: ['pc', 'mobile-first'], pcDemo: 'grid-toolbar#toolbar-grid-full-screen' }, { @@ -3874,7 +3033,7 @@ export default { 'en-US': 'Intercept method before full screen, If false is returned, the full screen is blocked. If true is returned, the full screen is not blocked.' }, - mode: ['pc'], + mode: ['pc', 'mobile-first'], pcDemo: 'grid-toolbar#toolbar-grid-full-screen' }, { @@ -3885,7 +3044,7 @@ export default { 'zh-CN': '按钮列表', 'en-US': 'Button List' }, - mode: ['pc'], + mode: ['pc', 'mobile-first'], pcDemo: 'grid-toolbar#toolbar-insert-delete-update' }, { @@ -3897,7 +3056,7 @@ export default { 'en-US': 'Sets whether the table can be displayed in full screen mode or whether the container needs to be displayed in full screen mode.; Sets whether to display the full-screen button on the toolbar.' }, - mode: ['pc'], + mode: ['pc', 'mobile-first'], pcDemo: 'grid-toolbar#toolbar-grid-full-screen' }, { @@ -3908,7 +3067,7 @@ export default { 'zh-CN': '唯一 ID 标识', 'en-US': 'Unique ID' }, - mode: ['pc'], + mode: ['pc', 'mobile-first'], pcDemo: 'grid-custom#custom-column-width' }, { @@ -3919,7 +3078,7 @@ export default { 'zh-CN': '工具栏组件开启表格刷新功能', 'en-US': 'The table refresh function is enabled for the toolbar component.' }, - mode: ['pc'], + mode: ['pc', 'mobile-first'], pcDemo: 'grid-toolbar#toolbar-refresh-grid' }, { @@ -3930,7 +3089,7 @@ export default { 'zh-CN': '列宽拖动配置(需要设置 id)', 'en-US': 'Column width dragging configuration (id needs to be set)' }, - mode: ['pc'], + mode: ['pc', 'mobile-first'], pcDemo: 'grid-custom#custom-column-width' }, { @@ -3944,7 +3103,7 @@ export default { 'en-US': 'Whether to display the table attribute on the personalized panel. This parameter is valid only when the name attribute of the table is set. Set whether to display personalized configuration for toolbar attributes (id needs to be set)' }, - mode: ['pc'], + mode: ['pc', 'mobile-first'], pcDemo: 'grid-custom#custom-column-width' }, { @@ -3955,7 +3114,7 @@ export default { 'zh-CN': '表格的尺寸', 'en-US': 'Dimension; The options of this attribute are medium, small, and mini' }, - mode: ['pc'], + mode: ['pc', 'mobile-first'], pcDemo: 'grid-toolbar#toolbar-copy-row-data' } ], @@ -3969,7 +3128,7 @@ export default { 'zh-CN': '当工具栏的按钮被点击时会后触发该事件', 'en-US': 'This event is triggered when a button on the toolbar is clicked' }, - mode: ['pc'], + mode: ['pc', 'mobile-first'], pcDemo: 'grid-validation#validation-before-submit-validation' }, { @@ -3982,7 +3141,7 @@ export default { 'en-US': 'Click the Cancel button on the personalized panel to trigger the event. settingConfigs: personalized data of the table' }, - mode: ['pc'], + mode: ['pc', 'mobile-first'], pcDemo: 'grid-custom#custom-ordercolumn-local' }, { @@ -3993,7 +3152,7 @@ export default { 'zh-CN': '点击个性化面板的重置按钮触发该事件', 'en-US': 'Click the Reset button on the personalized panel to trigger the event.' }, - mode: ['pc'], + mode: ['pc', 'mobile-first'], pcDemo: 'grid-custom#custom-ordercolumn-local' }, { @@ -4006,7 +3165,7 @@ export default { 'en-US': 'Click the OK button on the personalized panel to trigger the event. settingConfigs: personalized data of the table' }, - mode: ['pc'], + mode: ['pc', 'mobile-first'], pcDemo: 'grid-custom#custom-ordercolumn-local' } ], @@ -4019,7 +3178,7 @@ export default { 'zh-CN': '按钮列表', 'en-US': 'Button List' }, - mode: ['pc'], + mode: ['pc', 'mobile-first'], pcDemo: 'grid-toolbar#toolbar-custom-toolbar' }, { @@ -4029,7 +3188,7 @@ export default { 'zh-CN': '工具栏插槽', 'en-US': 'Toolbar slot' }, - mode: ['pc'], + mode: ['pc', 'mobile-first'], pcDemo: 'grid-toolbar#toolbar-custom-toolbar' } ] diff --git a/examples/sites/demos/pc/app/grid/footer/footer-row-or-column-span-composition-api.vue b/examples/sites/demos/pc/app/grid/footer/footer-row-or-column-span-composition-api.vue index 889469cef8..4fa13b4925 100644 --- a/examples/sites/demos/pc/app/grid/footer/footer-row-or-column-span-composition-api.vue +++ b/examples/sites/demos/pc/app/grid/footer/footer-row-or-column-span-composition-api.vue @@ -85,23 +85,13 @@ function footerMethod({ columns, data }) { return '全部的员工数量' } - if (column.property === 'employees') { - return data.map((item) => item[column.property]).reduce((acc, item) => acc + item) + if (columnIndex === 2) { + return data.map((item) => item.employees).reduce((acc, item) => acc + item) } return null }), - columns.map((column, columnIndex) => { - if (columnIndex === 0) { - return null - } - - if (column.property === 'employees') { - return null - } - - return null - }) + columns.map(() => null) ] } @@ -111,25 +101,9 @@ function footerRowspanMethod({ $rowIndex, columnIndex }) { return { rowspan: 2, colspan: 2 } } - if (columnIndex === 1) { - return { rowspan: 0, colspan: 0 } - } - - if (columnIndex === 3) { + if (columnIndex === 2) { return { rowspan: 2, colspan: 1 } } - } else if ($rowIndex === 1) { - if (columnIndex === 0) { - return { rowspan: 0, colspan: 0 } - } - - if (columnIndex === 1) { - return { rowspan: 0, colspan: 0 } - } - - if (columnIndex === 3) { - return { rowspan: 0, colspan: 0 } - } } } diff --git a/examples/sites/demos/pc/app/grid/footer/footer-row-or-column-span.vue b/examples/sites/demos/pc/app/grid/footer/footer-row-or-column-span.vue index e5963015bc..7e452cff6f 100644 --- a/examples/sites/demos/pc/app/grid/footer/footer-row-or-column-span.vue +++ b/examples/sites/demos/pc/app/grid/footer/footer-row-or-column-span.vue @@ -93,23 +93,13 @@ export default { return '全部的员工数量' } - if (column.property === 'employees') { - return data.map((item) => item[column.property]).reduce((acc, item) => acc + item) + if (columnIndex === 2) { + return data.map((item) => item.employees).reduce((acc, item) => acc + item) } return null }), - columns.map((column, columnIndex) => { - if (columnIndex === 0) { - return null - } - - if (column.property === 'employees') { - return null - } - - return null - }) + columns.map(() => null) ] }, footerRowspanMethod({ $rowIndex, columnIndex }) { @@ -118,25 +108,9 @@ export default { return { rowspan: 2, colspan: 2 } } - if (columnIndex === 1) { - return { rowspan: 0, colspan: 0 } - } - - if (columnIndex === 3) { + if (columnIndex === 2) { return { rowspan: 2, colspan: 1 } } - } else if ($rowIndex === 1) { - if (columnIndex === 0) { - return { rowspan: 0, colspan: 0 } - } - - if (columnIndex === 1) { - return { rowspan: 0, colspan: 0 } - } - - if (columnIndex === 3) { - return { rowspan: 0, colspan: 0 } - } } } } diff --git a/examples/sites/demos/pc/app/grid/footer/update-footer-composition-api.vue b/examples/sites/demos/pc/app/grid/footer/update-footer-composition-api.vue new file mode 100644 index 0000000000..2c597c0eab --- /dev/null +++ b/examples/sites/demos/pc/app/grid/footer/update-footer-composition-api.vue @@ -0,0 +1,104 @@ + + + diff --git a/examples/sites/demos/pc/app/grid/footer/update-footer.spec.ts b/examples/sites/demos/pc/app/grid/footer/update-footer.spec.ts new file mode 100644 index 0000000000..b3b940fbb1 --- /dev/null +++ b/examples/sites/demos/pc/app/grid/footer/update-footer.spec.ts @@ -0,0 +1,11 @@ +import { test, expect } from '@playwright/test' + +test('表尾合并行或列', async ({ page }) => { + page.on('pageerror', (exception) => expect(exception).toBeNull()) + const demo = page.locator('#update-footer') + await page.goto('grid-footer#update-footer') + await expect(demo.getByRole('cell', { name: '5310' })).toBeVisible() + await demo.getByRole('cell', { name: '1300' }).click() + await demo.locator('.tiny-numeric__increase').click() + await expect(demo.getByRole('cell', { name: '5311' })).toBeVisible() +}) diff --git a/examples/sites/demos/pc/app/grid/footer/update-footer.vue b/examples/sites/demos/pc/app/grid/footer/update-footer.vue new file mode 100644 index 0000000000..4dc2594032 --- /dev/null +++ b/examples/sites/demos/pc/app/grid/footer/update-footer.vue @@ -0,0 +1,114 @@ + + + diff --git a/examples/sites/demos/pc/app/grid/webdoc/grid-footer.js b/examples/sites/demos/pc/app/grid/webdoc/grid-footer.js index 7904699855..09d3b597bd 100644 --- a/examples/sites/demos/pc/app/grid/webdoc/grid-footer.js +++ b/examples/sites/demos/pc/app/grid/webdoc/grid-footer.js @@ -30,6 +30,17 @@ export default { '

Use footer-method and footer-span-method to set the total row or column logic of the table tail. show-footer

\n must be configured' }, 'codeFiles': ['footer/footer-row-or-column-span.vue'] + }, + { + 'demoId': 'update-footer', + 'name': { 'zh-CN': '手动更新表尾数据', 'en-US': 'Manually Update Footer Data' }, + 'desc': { + 'zh-CN': + '

默认情况下,只有当编辑失焦后才会更新表尾数据,通过 updateFooter 可以手动更新表尾数据。

\n', + 'en-US': + '

By default, footer data is only updated when editing loses focus. You can manually update footer data using the updateFooter method.

\n' + }, + 'codeFiles': ['footer/update-footer.vue'] } ], apis: [{ 'name': 'grid-footer', 'type': 'component', 'props': [], 'events': [], 'slots': [] }]