{prefixIcon ?
{prefixIcon} : null}
{labelContent}
diff --git a/src/menu/menu.tsx b/src/menu/menu.tsx
index c019daeef5..fc5aae9b53 100644
--- a/src/menu/menu.tsx
+++ b/src/menu/menu.tsx
@@ -31,14 +31,17 @@ export default defineComponent({
{ [`${prefix}-menu--scroll`]: mode.value !== 'popup' },
'narrow-scrollbar',
]);
- const styles = computed(() => {
+ const expandWidth = computed(() => {
const { width } = props;
- const expandWidth = typeof width === 'number' ? `${width}px` : width;
- return {
- height: '100%',
- width: props.collapsed ? '64px' : expandWidth,
- };
+ const format = (val: string | number) => (typeof val === 'number' ? `${val}px` : val);
+ if (Array.isArray(width)) return width.map((item) => format(item));
+
+ return [format(width), '64px'];
});
+ const styles = computed(() => ({
+ height: '100%',
+ width: props.collapsed ? expandWidth.value[1] : expandWidth.value[0],
+ }));
const activeValue = ref(props.defaultValue || props.value);
const activeValues = ref([]);
const expandValues = ref(props.expanded || []);
diff --git a/src/menu/submenu.tsx b/src/menu/submenu.tsx
index 8f170f79fe..1c52b448a5 100644
--- a/src/menu/submenu.tsx
+++ b/src/menu/submenu.tsx
@@ -168,7 +168,7 @@ export default defineComponent({
paddingLeft += 16;
}
- const needRotate = this.mode === 'popup' && this.isNested;
+ const needRotate = this.mode === 'popup';
const rippleVal = (this.keepAnimation as Record
).ripple ? this.rippleColor : false;
const normalSubmenu = [
diff --git a/src/select-input/useSingle.tsx b/src/select-input/useSingle.tsx
index 2f8cba0477..1fa9610e6f 100644
--- a/src/select-input/useSingle.tsx
+++ b/src/select-input/useSingle.tsx
@@ -24,10 +24,6 @@ const COMMON_PROPERTIES = [
'readonly',
'suffix',
'suffixIcon',
- 'onPaste',
- 'onEnter',
- 'onMouseenter',
- 'onMouseleave',
];
const DEFAULT_KEYS = {
@@ -86,7 +82,7 @@ export default function useSingle(props: TdSelectInputProps, context: SetupConte
readonly: !props.allowInput,
placeholder: singleValueDisplay ? '' : props.placeholder,
suffixIcon: !props.disabled && props.loading ? () => : props.suffixIcon,
- showClearIconOnEmpty: Boolean(props.clearable && inputValue.value),
+ showClearIconOnEmpty: Boolean(props.clearable && (inputValue.value || displayedValue)),
inputClass: {
[`${classPrefix.value}-input--focused`]: popupVisible,
},
@@ -112,6 +108,18 @@ export default function useSingle(props: TdSelectInputProps, context: SetupConte
instance.emit('focus', value.value, { ...context, tagInputValue: val });
!popupVisible && setInputValue(getInputValue(value.value, keys.value), { ...context, trigger: 'input' }); // 聚焦时拿到value
}}
+ onPaste={(context: { e: ClipboardEvent; pasteValue: string }) => {
+ props.onPaste?.(context);
+ instance.emit('paste', context);
+ }}
+ onMouseenter={(context: { e: MouseEvent }) => {
+ props.onMouseenter?.(context);
+ instance.emit('mouseenter', context);
+ }}
+ onMouseleave={(context: { e: MouseEvent }) => {
+ props.onMouseleave?.(context);
+ instance.emit('mouseenter', context);
+ }}
/>
);
};
diff --git a/src/swiper/style/index.js b/src/swiper/style/index.js
index cadf1b5724..de356833ab 100644
--- a/src/swiper/style/index.js
+++ b/src/swiper/style/index.js
@@ -1 +1 @@
-import '../../_common/style/web/components/swiper-new/_index.less';
+import '../../_common/style/web/components/swiper/_index.less';
diff --git a/src/table/base-table-props.ts b/src/table/base-table-props.ts
index db4d937f31..286df9132b 100644
--- a/src/table/base-table-props.ts
+++ b/src/table/base-table-props.ts
@@ -96,7 +96,7 @@ export default {
/** 使用 rowKey 唯一标识一行数据 */
rowKey: {
type: String,
- default: '',
+ default: 'id',
required: true,
},
/** 用于自定义合并单元格，泛型 T 指表格数据类型。示例：`({ row, col, rowIndex, colIndex }) => { rowspan: 2, colspan: 3 }` */
diff --git a/src/table/enhanced-table-props.ts b/src/table/enhanced-table-props.ts
index 34d0ed2200..f66a477122 100644
--- a/src/table/enhanced-table-props.ts
+++ b/src/table/enhanced-table-props.ts
@@ -8,7 +8,11 @@ import { TdEnhancedTableProps } from '../table/type';
import { PropType } from 'vue';
export default {
- /** 树形结构相关配置。`tree.indent` 表示树结点缩进距离，单位：px，默认为 24px。`tree.treeNodeColumnIndex` 表示树结点在第几列渲染，默认为 0 ，第一列。`tree.childrenKey` 表示树形结构子节点字段，默认为 children。`tree.checkStrictly` 表示树形结构的行选中（多选），父子行选中是否独立，默认独立，值为 true */
+ /** 树形结构中，拖拽排序前控制，返回值为 `true` 则继续排序；返回值为 `false` 则中止排序还原数据 */
+ beforeDragSort: {
+ type: Function as PropType,
+ },
+ /** 树形结构相关配置。具体属性文档查看 `TableTreeConfig` 相关描述 */
tree: {
type: Object as PropType,
},
@@ -16,6 +20,8 @@ export default {
treeExpandAndFoldIcon: {
type: Function as PropType,
},
+ /** 异常拖拽排序时触发，如：树形结构中，非同层级之间的交换。`context.code` 指交换异常错误码，固定值；`context.reason` 指交换异常的原因 */
+ onAbnormalDragSort: Function as PropType,
/** 树形结构，用户操作引起节点展开或收起时触发，代码操作不会触发 */
onTreeExpandChange: Function as PropType,
};
diff --git a/src/table/enhanced-table.tsx b/src/table/enhanced-table.tsx
index 7717f79d9e..683b136568 100644
--- a/src/table/enhanced-table.tsx
+++ b/src/table/enhanced-table.tsx
@@ -5,7 +5,9 @@ import baseTableProps from './base-table-props';
import primaryTableProps from './primary-table-props';
import enhancedTableProps from './enhanced-table-props';
import PrimaryTable, { BASE_TABLE_ALL_EVENTS } from './primary-table';
-import { TdEnhancedTableProps, PrimaryTableCol, TableRowData } from './type';
+import {
+ TdEnhancedTableProps, PrimaryTableCol, TableRowData, DragSortContext,
+} from './type';
import useTreeData from './hooks/useTreeData';
import useTreeSelect from './hooks/useTreeSelect';
import { TableListeners } from './base-table';
@@ -17,7 +19,6 @@ const PRIMARY_B_EVENTS = [
'filter-change',
'sort-change',
'data-change',
- 'drag-sort',
'async-loading-click',
];
@@ -34,7 +35,7 @@ export default defineComponent({
setup(props: TdEnhancedTableProps, context: SetupContext) {
const {
- store, dataSource, formatTreeColumn, ...treeInstanceFunctions
+ store, dataSource, formatTreeColumn, swapData, ...treeInstanceFunctions
} = useTreeData(props, context);
const treeDataMap = ref(store.value.treeDataMap);
@@ -64,10 +65,22 @@ export default defineComponent({
return isTreeData ? props.columns : getColumns(props.columns);
});
+ const onDragSortChange = (context: DragSortContext) => {
+ if (props.beforeDragSort && !props.beforeDragSort(context)) return;
+ swapData({
+ current: context.current,
+ target: context.target,
+ currentIndex: context.currentIndex,
+ targetIndex: context.targetIndex,
+ });
+ props.onDragSort?.(context);
+ };
+
return {
store,
dataSource,
tColumns,
+ onDragSortChange,
onInnerSelectChange,
...treeInstanceFunctions,
};
@@ -98,6 +111,7 @@ export default defineComponent({
const on: TableListeners = {
...this.getListener(),
'select-change': this.onInnerSelectChange,
+ 'drag-sort': this.onDragSortChange,
};
// replace `scopedSlots={this.$scopedSlots}` of `v-slots={this.$slots}` in Vue3
return ;
diff --git a/src/table/hooks/tree-store.ts b/src/table/hooks/tree-store.ts
index 00f0fca9ea..54b8f8fc11 100644
--- a/src/table/hooks/tree-store.ts
+++ b/src/table/hooks/tree-store.ts
@@ -1,3 +1,5 @@
+/* eslint-disable class-methods-use-this */
+/* eslint-disable no-param-reassign */
import get from 'lodash/get';
import { isRowSelectedDisabled } from '../utils';
import {
@@ -5,7 +7,7 @@ import {
} from '../type';
import log from '../../_common/js/log';
-export type TableTreeDataMap = Map>;
+export type TableTreeDataMap = Map;
export interface TableRowModel extends TableRowState {
setData?: (key: string | number, data: T) => void;
@@ -16,6 +18,18 @@ export interface KeysType {
childrenKey: string;
}
+export interface SwapParams {
+ current: T;
+ target: T;
+ currentIndex: number;
+ targetIndex: number;
+}
+
+export const TABLE_TREE_ERROR_CODE_NOT_SAME_LEVEL = {
+ code: 1001,
+ reason: 'The same level of rows can not be swapped.',
+};
+
/**
* 表格树形结构处理器
* Vue 和 React 可以通用
@@ -28,7 +42,9 @@ export interface KeysType {
*/
class TableTreeStore {
/** 树形结构 Map 存储 */
- treeDataMap: TableTreeDataMap = new Map();
+ treeDataMap: TableTreeDataMap = new Map();
+
+ expandAllRowIndex: 0;
constructor() {
this.treeDataMap = new Map();
@@ -42,7 +58,7 @@ class TableTreeStore {
*/
initialTreeStore(dataSource: T[], columns: PrimaryTableCol[], keys: KeysType) {
this.treeDataMap?.clear();
- initialTreeDataMap(this.treeDataMap, dataSource, columns[0], keys);
+ this.initialTreeDataMap(this.treeDataMap, dataSource, columns[0], keys);
}
toggleExpandData(p: { rowIndex: number; row: T }, dataSource: T[], keys: KeysType) {
@@ -55,18 +71,14 @@ class TableTreeStore {
log.error('EnhancedTable', '`rowKey` could be wrong, can not get rowValue from `data` by `rowKey`.');
return [];
}
- const r = this.treeDataMap.get(rowValue) || {
- row: p.row,
- rowIndex: p.rowIndex,
- expanded: false,
- };
+ const r = this.treeDataMap.get(rowValue);
r.rowIndex = p.rowIndex;
r.expanded = !r.expanded;
this.treeDataMap.set(rowValue, r);
return this.updateExpandRow(r, dataSource, keys);
}
- updateExpandRow(changeRow: TableRowState, dataSource: T[], keys: KeysType) {
+ updateExpandRow(changeRow: TableRowState, dataSource: T[], keys: KeysType) {
const { row, rowIndex, expanded } = changeRow;
const { treeDataMap } = this;
const childrenNodes = get(row, keys.childrenKey);
@@ -94,22 +106,22 @@ class TableTreeStore {
* @param key 行唯一标识
* @returns {TableRowState} 当前行数据
*/
- getData(key: TableRowValue): TableRowState {
+ getData(key: TableRowValue): TableRowState {
return this.treeDataMap.get(key);
}
/**
* 更新当前行数据，并返回当前行下标
- * @param key 当前行唯一标识值
+ * @param rowValue 当前行唯一标识值
* @param newRowData 新行数据
* @returns {number} rowIndex 设置的行下标
*/
- updateData(key: TableRowValue, newRowData: T, dataSource: T[], keys: KeysType): number {
- const newKey = get(newRowData, keys.rowKey);
- const rowState = this.treeDataMap.get(key);
+ updateData(rowValue: TableRowValue, newRowData: T, dataSource: T[], keys: KeysType): number {
+ const newRowValue = get(newRowData, keys.rowKey);
+ const rowState = this.treeDataMap.get(rowValue);
// Map 没有查询到，或者查询到的 rowIndex 值为 -1，均表示当前数据不在 dataSource 列表中，未显示在页面中
if (!rowState || rowState.rowIndex === -1) {
- updateRowData(dataSource, key, newRowData, {
+ updateRowData(dataSource, rowValue, newRowData, {
rowKey: keys.rowKey,
childrenKey: keys.childrenKey,
});
@@ -117,18 +129,20 @@ class TableTreeStore {
}
const currentRowIndex = rowState.rowIndex;
rowState.row = newRowData;
- this.treeDataMap.set(key, rowState);
+ rowState.id = newRowValue;
+
+ // 更新父元素中存储的当前元素值
if (rowState.parent) {
+ // 更新直接子元素数组
const siblings = get(rowState.parent.row, keys.childrenKey);
- const index = siblings.findIndex((item: T) => get(item, keys.rowKey) === key);
+ const index = siblings.findIndex((item: T) => get(item, keys.rowKey) === rowValue);
siblings[index] = newRowData;
}
- // key 也发生了变化
- if (key !== newKey) {
- this.treeDataMap.set(newKey, rowState);
- this.treeDataMap.delete(key);
- } else {
- this.treeDataMap.set(key, rowState);
+
+ this.treeDataMap.set(newRowValue, rowState);
+ // rowValue 也发生了变化，需移除 旧 rowValue 数据
+ if (rowValue !== newRowValue) {
+ this.treeDataMap.delete(rowValue);
}
return currentRowIndex;
}
@@ -143,23 +157,23 @@ class TableTreeStore {
// 移除当前节点时，展开的节点的子节点需同步移除
const removeNumber = (r.expandChildrenLength || 0) + 1;
dataSource.splice(r.rowIndex, removeNumber);
+
if (r.parent) {
const siblings = get(r.parent.row, keys.childrenKey);
const index = siblings.findIndex((item: TableRowData) => get(item, keys.rowKey) === key);
siblings.splice(index, 1);
- updateRowExpandLength(this.treeDataMap, r.parent.row, -1 * removeNumber, 'delete', {
- rowKey: keys.rowKey,
- childrenKey: keys.childrenKey,
- });
+ updateRowExpandLength(this.treeDataMap, r.parent.row, -1 * removeNumber, 'delete', keys);
}
+
this.treeDataMap.delete(key);
+
// 更新 rowIndex 之后的下标
updateRowIndex(this.treeDataMap, dataSource, {
minRowIndex: r.rowIndex,
rowKey: keys.rowKey,
+ type: 'remove',
});
} else {
- // TODO, remove from dataSource
console.warn('TDesign Table Warn: Do not remove this node, which is not appeared.');
}
return dataSource;
@@ -167,37 +181,34 @@ class TableTreeStore {
/**
* 为当前节点添加子节点，默认添加到最后一个节点
- * @param key 当前节点唯一标识
+ * @param rowValue 当前节点唯一标识
* @param newData 待添加的新节点
*/
- appendTo(key: string | number, newData: T, dataSource: T[], keys: KeysType): T[] {
- const state = this.treeDataMap.get(key);
- if (!state) {
- console.warn(`TDesign Table Warn: ${key} is not exist.`);
- return;
- }
+ appendTo(rowValue: string | number, newData: T, dataSource: T[], keys: KeysType): T[] {
+ const state = this.treeDataMap.get(rowValue);
+ if (!this.validateDataExist(state, rowValue)) return dataSource;
const newRowValue = get(newData, keys.rowKey);
- if (this.treeDataMap.get(newRowValue)) {
- console.warn(`TDesign Table Warn: Duplicated Key. ${newRowValue} is already exists.`);
- return;
- }
+ const mapState = this.treeDataMap.get(newRowValue);
+ if (!this.validateDataDoubleExist(mapState, newRowValue)) return dataSource;
const children: T[] = get(state.row, keys.childrenKey);
// 子节点不存在，则表示为叶子节点
const isShowNewNode = state.expanded || !children?.length;
+ const rowIndex = isShowNewNode ? state.rowIndex + (state.expandChildrenLength || 0) + 1 : -1;
const newState = {
+ id: newRowValue,
row: newData,
+ rowIndex,
level: state.level + 1,
- parent: state,
- path: [...state.path],
expanded: false,
expandChildrenLength: 0,
- rowIndex: isShowNewNode ? state.rowIndex + (state.expandChildrenLength || 0) + 1 : -1,
+ disabled: false,
+ path: [...state.path],
+ parent: state,
};
newState.path = newState.path.concat(newState);
if (children?.length) {
state.row[keys.childrenKey].push(newData);
} else {
- // @ts-ignore
state.row[keys.childrenKey] = [newData];
state.expanded = true;
}
@@ -205,7 +216,7 @@ class TableTreeStore {
// 如果当前节点为展开状态，则需要继续处理
if (isShowNewNode) {
dataSource.splice(newState.rowIndex, 0, newData);
- // 更新展开子节点数量
+ // 更新父元素及祖先元素展开子节点的数量
updateRowExpandLength(this.treeDataMap, state.row, 1, 'insert', {
rowKey: keys.rowKey,
childrenKey: keys.childrenKey,
@@ -214,44 +225,296 @@ class TableTreeStore {
updateRowIndex(this.treeDataMap, dataSource, {
minRowIndex: newState.rowIndex,
rowKey: keys.rowKey,
+ type: 'add',
});
}
+
return dataSource;
}
-}
-export default TableTreeStore;
+ /**
+ * 在当前节点后，插入一个兄弟节点
+ * @param rowValue 当前节点唯一标识
+ * @param newData 待添加的新节点
+ */
+ insertAfter(rowValue: string | number, newData: T, dataSource: T[], keys: KeysType): T[] {
+ return this.insert(rowValue, newData, dataSource, keys, 'after');
+ }
-export function initialTreeDataMap(
- treeDataMap: TableTreeDataMap,
- dataSource: T[],
- column: PrimaryTableCol,
- keys: KeysType,
-) {
- for (let i = 0, len = dataSource.length; i < len; i++) {
- const item = dataSource[i];
- const rowValue = get(item, keys.rowKey);
- if (rowValue === undefined) {
- log.error('EnhancedTable', '`rowKey` could be wrong, can not get rowValue from `data` by `rowKey`.');
- return;
- }
- const state: TableRowState = {
- row: item,
- rowIndex: i,
+ /**
+ * 在当前节点前，插入一个兄弟节点
+ * @param rowValue 当前节点唯一标识
+ * @param newData 待添加的新节点
+ */
+ insertBefore(rowValue: string | number, newData: T, dataSource: T[], keys: KeysType): T[] {
+ return this.insert(rowValue, newData, dataSource, keys, 'before');
+ }
+
+ insert(rowValue: string | number, newData: T, dataSource: T[], keys: KeysType, type: 'before' | 'after') {
+ const state = this.treeDataMap.get(rowValue);
+ if (!this.validateDataExist(state, rowValue)) return dataSource;
+ const newRowValue = get(newData, keys.rowKey);
+ const mapState = this.treeDataMap.get(newRowValue);
+ if (!this.validateDataDoubleExist(mapState, newRowValue)) return dataSource;
+ const rowIndex = type === 'after' ? state.rowIndex + 1 : state.rowIndex;
+ const newState = {
+ id: newRowValue,
+ row: newData,
+ rowIndex,
+ level: state.level,
expanded: false,
- level: 0,
expandChildrenLength: 0,
- disabled: isRowSelectedDisabled(column, item, i),
+ disabled: false,
+ path: state.path.slice(0, -1),
+ parent: state.parent,
};
- state.path = [state];
- treeDataMap.set(rowValue, state);
- const children = get(item, keys.childrenKey);
- if (children?.length) {
- initialTreeDataMap(treeDataMap, children, column, keys);
+ newState.path = newState.path.concat(newState);
+ const dataIndex = type === 'after' ? state.rowIndex + (state.expandChildrenLength + 1) : state.rowIndex;
+ dataSource.splice(dataIndex, 0, newData);
+ const distance = type === 'after' ? 1 : 0;
+ if (state.parent) {
+ const childrenIndex = state.parent.row[keys.childrenKey].findIndex(
+ (t: TableRowData) => rowValue === get(t, keys.rowKey),
+ );
+ state.parent.row[keys.childrenKey].splice(childrenIndex + distance, 0, newData);
+ updateRowExpandLength(this.treeDataMap, state.parent.row, 1, 'insert', keys);
+ }
+ this.treeDataMap.set(newRowValue, newState);
+
+ // 更新 rowIndex 之后的下标
+ updateRowIndex(this.treeDataMap, dataSource, {
+ rowKey: keys.rowKey,
+ minRowIndex: state.rowIndex + 1,
+ type: 'add',
+ });
+
+ return dataSource;
+ }
+
+ /**
+ * 交换数据行
+ * @returns 交换失败返回 false
+ */
+ swapData(
+ dataSource: T[],
+ params: SwapParams,
+ keys: KeysType,
+ ): { dataSource: T[]; result: boolean; code?: number; reason?: string } {
+ const startIndex = params.currentIndex;
+ const endIndex = params.targetIndex;
+ if (startIndex === endIndex) return { dataSource, result: true };
+ const startRowValue = get(params.current, keys.rowKey);
+ const endRowValue = get(params.target, keys.rowKey);
+ const startState = this.treeDataMap.get(startRowValue);
+ const endState = this.treeDataMap.get(endRowValue);
+ if (startState.level !== endState.level) {
+ return {
+ dataSource,
+ result: false,
+ code: TABLE_TREE_ERROR_CODE_NOT_SAME_LEVEL.code,
+ reason: TABLE_TREE_ERROR_CODE_NOT_SAME_LEVEL.reason,
+ };
+ }
+ const startLastIndex = startIndex + startState.expandChildrenLength + 1;
+ const endLastIndex = endIndex + endState.expandChildrenLength + 1;
+ const startRowList = dataSource.slice(startIndex, startLastIndex);
+ const endRowList = dataSource.slice(endIndex, endLastIndex);
+ if (startIndex > endIndex) {
+ const middleRowList = dataSource.slice(endLastIndex, startIndex);
+ const allSwapList = startRowList.concat(endRowList, middleRowList);
+ dataSource.splice(endIndex, allSwapList.length);
+ dataSource.splice(endIndex, 0, ...allSwapList);
+ updateRowIndex(this.treeDataMap, dataSource, {
+ rowKey: keys.rowKey,
+ minRowIndex: endIndex,
+ maxRowIndex: startLastIndex,
+ });
+ } else {
+ const middleRowList = dataSource.slice(startLastIndex, endIndex);
+ const allSwapList = middleRowList.concat(endRowList, startRowList);
+ dataSource.splice(startIndex, allSwapList.length);
+ dataSource.splice(startIndex, 0, ...allSwapList);
+ updateRowIndex(this.treeDataMap, dataSource, {
+ rowKey: keys.rowKey,
+ minRowIndex: startIndex,
+ maxRowIndex: endLastIndex,
+ });
+ }
+
+ // 交换父元素中的两个元素位置
+ if (startState.parent) {
+ const children = startState.parent.row[keys.childrenKey];
+ let count = 0;
+ for (let i = 0, len = children.length; i < len; i++) {
+ if (get(children[i], keys.rowKey) === startRowValue) {
+ children[i] = params.target;
+ count += 1;
+ }
+ if (get(children[i], keys.rowKey) === endRowValue) {
+ children[i] = params.current;
+ count += 1;
+ }
+ if (count >= 2) break;
+ }
+ }
+
+ return { dataSource, result: true };
+ }
+
+ /**
+ * 展开所有节点
+ */
+ expandAll(dataSource: T[], keys: KeysType) {
+ this.expandAllRowIndex = 0;
+ const expandLoop = (
+ dataSource: T[],
+ keys: KeysType,
+ newData: T[] = [],
+ parentExpanded = false,
+ parent: TableRowState = null,
+ ) => {
+ for (let i = 0, len = dataSource.length; i < len; i++) {
+ const item = dataSource[i];
+ const rowValue = get(item, keys.rowKey);
+ const state = this.treeDataMap.get(rowValue);
+ const children = get(item, keys.childrenKey);
+ const originalExpanded = state.expanded;
+ state.rowIndex = this.expandAllRowIndex;
+ state.expanded = true;
+ state.expandChildrenLength = children?.length || 0;
+ this.expandAllRowIndex += 1;
+ if (!parentExpanded) {
+ newData.push(item);
+ }
+ this.treeDataMap.set(rowValue, state);
+ if (children?.length && !originalExpanded) {
+ // 同步更新父元素的展开数量
+ let tmpParent = parent;
+ while (tmpParent?.row) {
+ tmpParent.expandChildrenLength += children.length;
+ this.treeDataMap.set(tmpParent.id, tmpParent);
+ tmpParent = tmpParent.parent;
+ }
+ // 继续子元素
+ expandLoop(children, keys, newData, originalExpanded, state);
+ }
+ }
+ return newData;
+ };
+ return expandLoop(dataSource, keys);
+ }
+
+ /**
+ * 收起所有节点
+ */
+ foldAll(dataSource: T[], keys: KeysType) {
+ const newData: T[] = [];
+ for (let i = 0, len = dataSource.length; i < len; i++) {
+ const item = dataSource[i];
+ const rowValue = get(item, keys.rowKey);
+ const state = this.treeDataMap.get(rowValue);
+ state.rowIndex = state.level === 0 ? i : -1;
+ state.expanded = false;
+ state.expandChildrenLength = 0;
+ if (state.level === 0) {
+ newData.push(item);
+ }
+ const children = get(item, keys.childrenKey);
+ if (children?.length) {
+ this.foldAll(children, keys);
+ }
}
+ return newData;
+ }
+
+ /**
+ * 初始化树形结构 Map
+ * @param treeDataMap 树形结构 Map
+ * @param dataSource 数据源
+ * @param column 树形结构列
+ * @param keys 字段映射关系
+ * @param level 层级
+ * @param parent 父元素
+ * @returns void
+ */
+ initialTreeDataMap(
+ treeDataMap: TableTreeDataMap,
+ dataSource: T[],
+ column: PrimaryTableCol,
+ keys: KeysType,
+ level = 0,
+ parent: TableRowState = null,
+ ) {
+ for (let i = 0, len = dataSource.length; i < len; i++) {
+ const item = dataSource[i];
+ const rowValue = get(item, keys.rowKey);
+ if (rowValue === undefined) {
+ log.error('EnhancedTable', '`rowKey` could be wrong, can not get rowValue from `data` by `rowKey`.');
+ return;
+ }
+ const children = get(item, keys.childrenKey);
+ const state: TableRowState = {
+ id: rowValue,
+ row: item,
+ rowIndex: level === 0 ? i : -1,
+ level,
+ expanded: false,
+ expandChildrenLength: 0,
+ disabled: isRowSelectedDisabled(column, item, i),
+ parent,
+ };
+ state.path = parent ? parent.path.concat(state) : [state];
+ treeDataMap.set(rowValue, state);
+ if (children?.length) {
+ this.initialTreeDataMap(treeDataMap, children, column, keys, level + 1, state);
+ }
+ }
+ }
+
+ // column.checkProps 和 column.disabled 会影响行的禁用状态，因此当列发生变化时，需要重置禁用状态
+ updateDisabledState(dataSource: T[], column: PrimaryTableCol, keys: KeysType) {
+ for (let i = 0, len = dataSource.length; i < len; i++) {
+ const item = dataSource[i];
+ const rowValue = get(item, keys.rowKey);
+ if (rowValue === undefined) {
+ log.error('EnhancedTable', '`rowKey` could be wrong, can not get rowValue from `data` by `rowKey`.');
+ return;
+ }
+ const state = this.treeDataMap.get(rowValue);
+ state.disabled = isRowSelectedDisabled(column, item, i);
+ this.treeDataMap.set(rowValue, state);
+ const children = get(item, keys.childrenKey);
+ if (children?.length) {
+ this.updateDisabledState(children, column, keys);
+ }
+ }
+ }
+
+ /**
+ * 校验数据合法性
+ */
+ validateDataExist(state: TableRowState, rowValue: string | number) {
+ if (!state) {
+ console.warn(`TDesign Table Warn: ${rowValue} does not exist.`);
+ return false;
+ }
+ return true;
+ }
+
+ /**
+ * 校验数据是否已存在
+ */
+ validateDataDoubleExist(state: TableRowState, rowValue: string | number) {
+ if (state) {
+ console.warn(`TDesign Table Warn: Duplicated Key. ${rowValue} already exists.`);
+ return false;
+ }
+ return true;
}
}
+export default TableTreeStore;
+
/**
* 更新展开的子节点数量
* @param rowSate 行数据和状态
@@ -298,26 +561,23 @@ export function clearRowExpandLength(treeDataMap: TableTreeDataMap, row: T, k
*/
export function updateChildrenRowState(
treeDataMap: TableTreeDataMap,
- rowState: TableRowState,
+ rowState: TableRowState,
expanded: boolean,
keys: KeysType,
) {
- const { row, level = 0, rowIndex } = rowState;
+ const { row, rowIndex } = rowState;
const childrenNodes = get(row, keys.childrenKey);
childrenNodes.forEach((item: T, kidRowIndex: number) => {
const rowValue = get(item, keys.rowKey);
const index = expanded ? rowIndex + 1 + kidRowIndex : -1;
const curState = treeDataMap.get(rowValue);
- const newState: TableRowState = {
+ const newState: TableRowState = {
...curState,
row: item,
rowIndex: index,
expanded: false,
parent: rowState,
- level: level + 1,
- path: [],
};
- newState.path = newState.path.concat(newState);
treeDataMap.set(rowValue, newState);
// 父节点展开，子节点不一定展开；父节点收起，则所有子节点收起
if (!expanded) {
@@ -361,7 +621,12 @@ export function updateRowData(
export function updateRowIndex(
treeDataMap: TableTreeDataMap,
dataSource: T[],
- extra: { rowKey: string; minRowIndex?: number; maxRowIndex?: number },
+ extra: {
+ rowKey: string;
+ minRowIndex?: number;
+ maxRowIndex?: number;
+ type?: 'add' | 'remove';
+ },
) {
const start = extra.minRowIndex || 0;
const end = extra.maxRowIndex || dataSource.length;
diff --git a/src/table/hooks/useDragSort.ts b/src/table/hooks/useDragSort.ts
index a3dd5ca350..4099217f94 100644
--- a/src/table/hooks/useDragSort.ts
+++ b/src/table/hooks/useDragSort.ts
@@ -83,9 +83,9 @@ export default function useDragSort(props: TdPrimaryTableProps, context: SetupCo
const { oldIndex: currentIndex, newIndex: targetIndex } = evt;
const params: DragSortContext = {
currentIndex,
- current: data[currentIndex],
+ current: props.data[currentIndex],
targetIndex,
- target: data[targetIndex],
+ target: props.data[targetIndex],
currentData: swapDragArrayElement(props.data, currentIndex, targetIndex),
e: evt,
sort: 'row',
diff --git a/src/table/hooks/useTreeData.tsx b/src/table/hooks/useTreeData.tsx
index 580c0e4013..e4e6084650 100644
--- a/src/table/hooks/useTreeData.tsx
+++ b/src/table/hooks/useTreeData.tsx
@@ -5,7 +5,7 @@ import { AddRectangleIcon, MinusRectangleIcon } from 'tdesign-icons-vue';
import cloneDeep from 'lodash/cloneDeep';
import get from 'lodash/get';
import { CreateElement } from 'vue';
-import TableTreeStore from './tree-store';
+import TableTreeStore, { SwapParams } from './tree-store';
import {
TdEnhancedTableProps, PrimaryTableCol, TableRowData, TableRowValue, TableRowState,
} from '../type';
@@ -28,6 +28,13 @@ export default function useTreeData(props: TdEnhancedTableProps, context: SetupC
childrenKey: props.tree?.childrenKey || 'children',
}));
+ const checkedColumn = computed(() => columns.value.find((col) => col.colKey === 'row-select'));
+
+ watch(checkedColumn, (column) => {
+ if (!store.value) return;
+ store.value.updateDisabledState(dataSource.value, column, rowDataKeys.value);
+ });
+
function getFoldIcon(h: CreateElement) {
const params = { type: 'fold' };
const defaultFoldIcon = t(global.value.treeExpandAndFoldIcon, h, params) || ;
@@ -52,15 +59,15 @@ export default function useTreeData(props: TdEnhancedTableProps, context: SetupC
if (!data) return [];
// 如果没有树形解构，则不需要相关逻辑
if (!props.tree || !Object.keys(props.tree).length) {
- // @ts-ignore
dataSource.value = data;
return;
}
- const newVal = cloneDeep(data);
- // @ts-ignore
- dataSource.value = newVal;
- // @ts-ignore
+ let newVal = cloneDeep(data);
store.value.initialTreeStore(newVal, props.columns, rowDataKeys.value);
+ if (props.tree?.defaultExpandAll) {
+ newVal = store.value.expandAll(newVal, rowDataKeys.value);
+ }
+ dataSource.value = newVal;
},
{ immediate: true },
);
@@ -95,23 +102,19 @@ export default function useTreeData(props: TdEnhancedTableProps, context: SetupC
* 组件实例方法，展开或收起某一行
* @param p 行数据
*/
- function toggleExpandData(p: { row: TableRowData; rowIndex: number; trigger?: 'inner' }) {
- if (!props.tree) {
- console.error('toggleExpandData can only be used in tree data.');
- return;
- }
+ function toggleExpandData(p: { row: TableRowData; rowIndex: number }, trigger?: 'expand-fold-icon') {
dataSource.value = store.value.toggleExpandData(p, dataSource.value, rowDataKeys.value);
- if (p.trigger === 'inner') {
- const rowValue = get(p.row, rowDataKeys.value.rowKey);
- const params = {
- row: p.row,
- rowIndex: p.rowIndex,
- rowState: store.value?.treeDataMap?.get(rowValue),
- };
- props.onTreeExpandChange?.(params);
- // Vue3 ignore next line
- context.emit('tree-expand-change', params);
- }
+ const rowValue = get(p.row, rowDataKeys.value.rowKey);
+ const rowState = store.value?.treeDataMap?.get(rowValue);
+ const params = {
+ row: p.row,
+ rowIndex: p.rowIndex,
+ rowState,
+ trigger,
+ };
+ props.onTreeExpandChange?.(params);
+ // Vue3 ignore next line
+ context.emit('tree-expand-change', params);
}
function getTreeNodeColumnCol() {
@@ -143,7 +146,7 @@ export default function useTreeData(props: TdEnhancedTableProps, context: SetupC
return (
{!!childrenNodes.length && (
-
toggleExpandData({ ...p, trigger: 'inner' })}>
+ toggleExpandData(p, 'expand-fold-icon')}>
{iconNode}
)}
@@ -191,7 +194,7 @@ export default function useTreeData(props: TdEnhancedTableProps, context: SetupC
*/
function remove(key: TableRowValue) {
// 引用传值，可自动更新 dataSource。（dataSource 本是内部变量，可以在任何地方进行任何改变）
- dataSource.value = store.value.remove(key, dataSource.value, rowDataKeys.value);
+ dataSource.value = [...store.value.remove(key, dataSource.value, rowDataKeys.value)];
}
/**
@@ -201,26 +204,69 @@ export default function useTreeData(props: TdEnhancedTableProps, context: SetupC
*/
function appendTo(key: TableRowValue, newData: T) {
// 引用传值，可自动更新 dataSource。（dataSource 本是内部变量，可以在任何地方进行任何改变）
- dataSource.value = store.value.appendTo(key, newData, dataSource.value, rowDataKeys.value);
+ dataSource.value = [...store.value.appendTo(key, newData, dataSource.value, rowDataKeys.value)];
+ }
+
+ /**
+ * 当前节点之后，插入节点
+ */
+ function insertAfter(rowValue: TableRowValue, newData: T) {
+ dataSource.value = [...store.value.insertAfter(rowValue, newData, dataSource.value, rowDataKeys.value)];
}
/**
- * 设置展开行层级
+ * 当前节点之后，插入节点
*/
- // function setExpandedLevel(level: 1 | 2 | 3 | 4 | 5) {
- // dataSource.value = store.value.setExpandedLevel(level, dataSource.value, rowDataKeys.value);
- // }
+ function insertBefore(rowValue: TableRowValue, newData: T) {
+ dataSource.value = [...store.value.insertBefore(rowValue, newData, dataSource.value, rowDataKeys.value)];
+ }
+
+ /**
+ * 展开所有节点
+ */
+ function expandAll() {
+ dataSource.value = [...store.value.expandAll(dataSource.value, rowDataKeys.value)];
+ }
+
+ /**
+ * 收起所有节点
+ */
+ function foldAll() {
+ dataSource.value = [...store.value.foldAll(dataSource.value, rowDataKeys.value)];
+ }
+
+ /**
+ * 交换行数据
+ */
+ function swapData(params: SwapParams) {
+ const r = store.value.swapData(dataSource.value, params, rowDataKeys.value);
+ if (r.result) {
+ dataSource.value = [...r.dataSource];
+ } else {
+ const params = {
+ code: r.code,
+ reason: r.reason,
+ };
+ props.onAbnormalDragSort?.(params);
+ // Vue3 do not need next line
+ context.emit('abnormal-drag-sort', params);
+ }
+ }
return {
store,
rowDataKeys,
dataSource,
+ swapData,
setData,
getData,
remove,
appendTo,
+ insertAfter,
+ insertBefore,
formatTreeColumn,
toggleExpandData,
- // setExpandedLevel,
+ expandAll,
+ foldAll,
};
}
diff --git a/src/table/type.ts b/src/table/type.ts
index 29e6c554a2..6475bdaace 100644
--- a/src/table/type.ts
+++ b/src/table/type.ts
@@ -123,7 +123,7 @@ export interface TdBaseTableProps {
rowClassName?: ClassName | ((params: RowClassNameParams) => ClassName);
/**
* 使用 rowKey 唯一标识一行数据
- * @default ''
+ * @default 'id'
*/
rowKey: string;
/**
@@ -491,13 +491,21 @@ export interface PrimaryTableCol
export interface TdEnhancedTableProps extends TdPrimaryTableProps {
/**
- * 树形结构相关配置。`tree.indent` 表示树结点缩进距离，单位：px，默认为 24px。`tree.treeNodeColumnIndex` 表示树结点在第几列渲染，默认为 0 ，第一列。`tree.childrenKey` 表示树形结构子节点字段，默认为 children。`tree.checkStrictly` 表示树形结构的行选中（多选），父子行选中是否独立，默认独立，值为 true
+ * 树形结构中，拖拽排序前控制，返回值为 `true` 则继续排序；返回值为 `false` 则中止排序还原数据
+ */
+ beforeDragSort?: (context: DragSortContext) => boolean;
+ /**
+ * 树形结构相关配置。具体属性文档查看 `TableTreeConfig` 相关描述
*/
tree?: TableTreeConfig;
/**
* 自定义树形结构展开图标，支持全局配置 `GlobalConfigProvider`
*/
treeExpandAndFoldIcon?: TNode<{ type: 'expand' | 'fold' }>;
+ /**
+ * 异常拖拽排序时触发，如：树形结构中，非同层级之间的交换。`context.code` 指交换异常错误码，固定值；`context.reason` 指交换异常的原因
+ */
+ onAbnormalDragSort?: (context: TableAbnormalDragSortContext) => void;
/**
* 树形结构，用户操作引起节点展开或收起时触发，代码操作不会触发
*/
@@ -506,6 +514,14 @@ export interface TdEnhancedTableProps ext
/** 组件实例方法 */
export interface EnhancedTableInstanceFunctions {
+ /**
+ * 展开全部行
+ */
+ expandAll: () => void;
+ /**
+ * 折叠全部行
+ */
+ foldAll: () => void;
/**
* 树形结构中，用于获取行数据所有信息。泛型 `T` 表示行数据类型
*/
@@ -539,6 +555,10 @@ export interface TableRowState {
* @default false
*/
expanded: boolean;
+ /**
+ * 唯一标识
+ */
+ id: string | number;
/**
* 当前节点层级
*/
@@ -556,7 +576,7 @@ export interface TableRowState {
*/
row: T;
/**
- * 表格行下标
+ * 表格行下标，值为 `-1` 标识当前行未展开显示
*/
rowIndex: number;
}
@@ -650,6 +670,34 @@ export interface TableColumnController {
placement?: 'top-left' | 'top-right' | 'bottom-left' | 'bottom-right';
}
+export interface TableTreeConfig {
+ /**
+ * 表示树形结构的行选中（多选），父子行选中是否独立
+ * @default true
+ */
+ checkStrictly?: boolean;
+ /**
+ * 树形结构子节点字段，示例：`childrenKey='list'`。一般应用在数据 `data` 的子节点字段不是 `children` 的场景
+ * @default children
+ */
+ childrenKey?: string;
+ /**
+ * 是否默认展开全部，仅默认情况有效。如果希望自由控制树形结构的展开或收起，可使用实例方法 `expandAll` 和 `foldAll`
+ * @default false
+ */
+ defaultExpandAll?: boolean;
+ /**
+ * 树结点缩进距离，单位：px
+ * @default 24
+ */
+ indent?: number;
+ /**
+ * 树结点在第几列渲染，默认为第一列
+ * @default 0
+ */
+ treeNodeColumnIndex?: number;
+}
+
export type TableRowAttributes =
| HTMLElementAttributes
| ((params: { row: T; rowIndex: number; type: 'body' | 'foot' }) => HTMLElementAttributes)
@@ -809,17 +857,16 @@ export type SorterFun = (a: T, b: T) => number;
export type SortType = 'desc' | 'asc' | 'all';
-export interface TableTreeConfig {
- indent?: number;
- treeNodeColumnIndex?: number;
- childrenKey?: 'children';
- checkStrictly?: boolean;
+export interface TableAbnormalDragSortContext {
+ code: number;
+ reason: string;
}
export interface TableTreeExpandChangeContext {
row: T;
rowIndex: number;
rowState: TableRowState;
+ trigger?: 'expand-fold-icon';
}
export type TableRowValue = string | number;
diff --git a/src/transfer/components/transfer-list.tsx b/src/transfer/components/transfer-list.tsx
index 0c5fa7221b..6bd22fca4b 100644
--- a/src/transfer/components/transfer-list.tsx
+++ b/src/transfer/components/transfer-list.tsx
@@ -145,6 +145,14 @@ export default mixins(keepAnimationMixins).extend({
return getLeafCount(this.dataSource);
},
},
+ watch: {
+ totalCount(val) {
+ if (val <= (this.currentPage - 1) * this.pageSize) {
+ const lastPage = Math.ceil(val / this.pageSize);
+ this.defaultCurrent = lastPage;
+ }
+ },
+ },
methods: {
handlePaginationChange(pageInfo: PageInfo): void {
this.$emit('pageChange', pageInfo);
diff --git a/src/tree-select/tree-select.tsx b/src/tree-select/tree-select.tsx
index b366711123..ff04741680 100644
--- a/src/tree-select/tree-select.tsx
+++ b/src/tree-select/tree-select.tsx
@@ -214,6 +214,10 @@ export default mixins(getConfigReceiverMixins('treeSelect
}
return 'value';
},
+ realChildren(): string {
+ const { treeProps } = this;
+ return treeProps?.keys?.children || 'children';
+ },
tagList(): Array {
if (this.nodeInfo && isArray(this.nodeInfo)) {
return this.nodeInfo.map((node) => node.label);
@@ -381,7 +385,7 @@ export default mixins(getConfigReceiverMixins('treeSelect
if (data[i][this.realValue] === targetValue) {
return { label: data[i][this.realLabel], value: data[i][this.realValue] };
}
- const childrenData = data[i]?.children;
+ const childrenData = data[i][this.realChildren];
if (childrenData) {
const data = Array.isArray(childrenData) ? childrenData : this.getTreeData();
const result = this.getTreeNode(data, targetValue);
diff --git a/src/watermark/props.ts b/src/watermark/props.ts
new file mode 100644
index 0000000000..c73c18af93
--- /dev/null
+++ b/src/watermark/props.ts
@@ -0,0 +1,79 @@
+/* eslint-disable */
+
+/**
+ * 该文件为脚本自动生成文件，请勿随意修改。如需修改请联系 PMC
+ * */
+
+import { TdWatermarkProps } from './type';
+import { PropType } from 'vue';
+
+export default {
+ /** 水印整体透明度，取值范围 [0-1] */
+ alpha: {
+ type: Number,
+ default: 1,
+ },
+ /** 水印所覆盖的内容节点 */
+ content: {
+ type: [String, Function] as PropType,
+ },
+ /** 水印所覆盖的内容节点，同 `content` */
+ default: {
+ type: [String, Function] as PropType,
+ },
+ /** 水印高度 */
+ height: {
+ type: Number,
+ },
+ /** 水印是否重复出现 */
+ isRepeat: {
+ type: Boolean,
+ default: true,
+ },
+ /** 行间距，只作用在多行（`content` 配置为数组）情况下 */
+ lineSpace: {
+ type: Number,
+ default: 16,
+ },
+ /** 水印是否可移动 */
+ movable: Boolean,
+ /** 水印发生运动位移的间隙，单位：毫秒 */
+ moveInterval: {
+ type: Number,
+ default: 3000,
+ },
+ /** 水印在画布上绘制的水平和垂直偏移量，正常情况下水印绘制在中间位置，即 `offset = [gapX / 2, gapY / 2]` */
+ offset: {
+ type: Array as PropType,
+ },
+ /** 水印是否可被删除，默认会开启水印节点防删 */
+ removable: {
+ type: Boolean,
+ default: true,
+ },
+ /** 水印旋转的角度，单位 ° */
+ rotate: {
+ type: Number,
+ default: -22,
+ },
+ /** 水印内容，需要显示多行情况下可配置为数组 */
+ watermarkContent: {
+ type: [Object, Array] as PropType,
+ },
+ /** 水印宽度 */
+ width: {
+ type: Number,
+ },
+ /** 水印之间的水平间距 */
+ x: {
+ type: Number,
+ },
+ /** 水印之间的垂直间距 */
+ y: {
+ type: Number,
+ },
+ /** 水印元素的 `z-index`，默认值写在 CSS 中 */
+ zIndex: {
+ type: Number,
+ },
+};
diff --git a/src/watermark/type.ts b/src/watermark/type.ts
new file mode 100644
index 0000000000..abfefdf711
--- /dev/null
+++ b/src/watermark/type.ts
@@ -0,0 +1,117 @@
+/* eslint-disable */
+
+/**
+ * 该文件为脚本自动生成文件，请勿随意修改。如需修改请联系 PMC
+ * */
+
+import { TNode } from '../common';
+
+export interface TdWatermarkProps {
+ /**
+ * 水印整体透明度，取值范围 [0-1]
+ * @default 1
+ */
+ alpha?: number;
+ /**
+ * 水印所覆盖的内容节点
+ */
+ content?: string | TNode;
+ /**
+ * 水印所覆盖的内容节点，同 `content`
+ */
+ default?: string | TNode;
+ /**
+ * 水印高度
+ */
+ height?: number;
+ /**
+ * 水印是否重复出现
+ * @default true
+ */
+ isRepeat?: boolean;
+ /**
+ * 行间距，只作用在多行（`content` 配置为数组）情况下
+ * @default 16
+ */
+ lineSpace?: number;
+ /**
+ * 水印是否可移动
+ * @default false
+ */
+ movable?: boolean;
+ /**
+ * 水印发生运动位移的间隙，单位：毫秒
+ * @default 3000
+ */
+ moveInterval?: number;
+ /**
+ * 水印在画布上绘制的水平和垂直偏移量，正常情况下水印绘制在中间位置，即 `offset = [gapX / 2, gapY / 2]`
+ */
+ offset?: Array;
+ /**
+ * 水印是否可被删除，默认会开启水印节点防删
+ * @default true
+ */
+ removable?: boolean;
+ /**
+ * 水印旋转的角度，单位 °
+ * @default -22
+ */
+ rotate?: number;
+ /**
+ * 水印内容，需要显示多行情况下可配置为数组
+ */
+ watermarkContent?: WatermarkText | WatermarkImage | Array;
+ /**
+ * 水印宽度
+ */
+ width?: number;
+ /**
+ * 水印之间的水平间距
+ */
+ x?: number;
+ /**
+ * 水印之间的垂直间距
+ */
+ y?: number;
+ /**
+ * 水印元素的 `z-index`，默认值写在 CSS 中
+ */
+ zIndex?: number;
+}
+
+export interface WatermarkText {
+ /**
+ * 水印文本文字颜色
+ * @default rgba(0,0,0,0.1)
+ */
+ fontColor?: string;
+ /**
+ * 水印文本文字大小
+ * @default 16
+ */
+ fontSize?: number;
+ /**
+ * 水印文本文字粗细
+ * @default normal
+ */
+ fontWeight?: 'normal' | 'lighter' | 'bold' | 'bolder';
+ /**
+ * 水印文本内容
+ * @default ''
+ */
+ text?: string;
+}
+
+export interface WatermarkImage {
+ /**
+ * 水印图片是否需要灰阶显示
+ * @default false
+ */
+ isGrayscale?: boolean;
+ /**
+ * 水印图片源地址，为了显示清楚，建议导出 2 倍或 3 倍图
+ * @default ''
+ */
+ url?: string;
+}
diff --git a/test/ssr/__snapshots__/ssr.test.js.snap b/test/ssr/__snapshots__/ssr.test.js.snap
index 7a97d4bfad..3b75dace36 100644
--- a/test/ssr/__snapshots__/ssr.test.js.snap
+++ b/test/ssr/__snapshots__/ssr.test.js.snap
@@ -2223,7 +2223,7 @@ exports[`ssr snapshot test renders ./examples/calendar/demos/slot-props-api.vue
exports[`ssr snapshot test renders ./examples/calendar/demos/value.vue correctly 1`] = `
@@ -3420,7 +3418,7 @@ exports[`ssr snapshot test renders ./examples/config-provider/demos/global.vue c
exports[`ssr snapshot test renders ./examples/config-provider/demos/others.vue correctly 1`] = `
@@ -4395,7 +4391,7 @@ exports[`ssr snapshot test renders ./examples/form/demos/align.vue correctly 1`]
@@ -4424,7 +4418,7 @@ exports[`ssr snapshot test renders ./examples/form/demos/align.vue correctly 1`]
exports[`ssr snapshot test renders ./examples/form/demos/base.vue correctly 1`] = `