feat(table): 1. 修复动态数据合并单元格问题；2. 表格可筛选功能补充日期面板使用 (#1135)

* feat(table): 1. 修复动态数据合并单元格问题；2. 表格可筛选功能补充日期面板使用 * fix(table): tree table indent=0
Tencent · Jul 2, 2022 · 97d46f3 · 97d46f3
1 parent 991ae2c
commit 97d46f3
Show file tree

Hide file tree

Showing 4 changed files with 18 additions and 14 deletions.
diff --git a/examples/table/demos/filter-controlled.vue b/examples/table/demos/filter-controlled.vue
@@ -42,7 +42,7 @@
 
 <script setup lang="jsx">
 import { ref, computed } from 'vue';
-import { DatePicker } from 'tdesign-vue-next';
+import { DateRangePickerPanel, Textarea } from 'tdesign-vue-next';
 
 const initData = new Array(5).fill(null).map((_, i) => ({
   key: String(i + 1),
@@ -97,6 +97,10 @@ const columns = computed(() => [
     // 输入框过滤配置
     filter: {
       type: 'input',
+
+      // 文本域搜索
+      // component: Textarea,
+
       resetValue: '',
       // 按下 Enter 键时也触发确认搜索
       confirmEvents: ['onEnter'],
@@ -113,12 +117,14 @@ const columns = computed(() => [
     // 自定义过滤组件：日期过滤配置，请确保自定义组件包含 value 和 onChange 属性
     filter: {
       type: 'custom',
-      // this config is not recommended
-      // component: () => <t-date-picker clearable />,
-      component: DatePicker,
+      component: DateRangePickerPanel,
       props: {
-        clearable: true,
+        firstDayOfWeek: 7,
       },
+      // 是否显示重置取消按钮，一般情况不需要显示
+      showConfirmAndReset: true,
+      // 日期范围是一个组件，重置时需赋值为 []
+      resetValue: [],
     },
   },
 ]);

diff --git a/src/_common b/src/_common
diff --git a/src/table/hooks/useRowspanAndColspan.ts b/src/table/hooks/useRowspanAndColspan.ts
@@ -63,9 +63,9 @@ export default function useRowspanAndColspan(
         const cellKey = getCellKey(row, rowKey.value, col.colKey, j);
         const state = skipSpansMap.value.get(cellKey) || {};
         const o = rowspanAndColspan(params) || {};
-        if (o.rowspan > 1 || o.colspan > 1 || state.rowspan || state.colspan) {
-          o.rowspan > 1 && (state.rowspan = o.rowspan);
-          o.colspan > 1 && (state.colspan = o.colspan);
+        if (o.rowspan || o.colspan || state.rowspan || state.colspan) {
+          o.rowspan && (state.rowspan = o.rowspan);
+          o.colspan && (state.colspan = o.colspan);
           skipSpansMap.value.set(cellKey, state);
         }
         onTrRowspanOrColspan?.(params, state);
@@ -82,5 +82,5 @@ export default function useRowspanAndColspan(
     { immediate: true },
   );
 
-  return { skipSpansMap, updateSkipSpansMap };
+  return { skipSpansMap };
 }
diff --git a/src/table/hooks/useTreeData.tsx b/src/table/hooks/useTreeData.tsx
@@ -95,11 +95,9 @@ export default function useTreeData(props: TdEnhancedTableProps, context: SetupC
 
   function getTreeNodeStyle(level: number) {
     if (level === undefined) return;
-    const indent = props.tree?.indent || 24;
+    const indent = props.tree?.indent === undefined ? 24 : props.tree?.indent;
     // 默认 1px 是为了临界省略
-    return {
-      paddingLeft: `${level * indent || 1}px`,
-    };
+    return indent ? { paddingLeft: `${level * indent || 1}px` } : {};
   }
 
   /**