fix: table 高度
This commit is contained in:
		@@ -143,7 +143,7 @@ export const Table: React.FC<TableProps> = ({
 | 
				
			|||||||
  const isIndeterminate = selectedKeys.length > 0 && !isAllSelected;
 | 
					  const isIndeterminate = selectedKeys.length > 0 && !isAllSelected;
 | 
				
			||||||
 | 
					
 | 
				
			||||||
  return (
 | 
					  return (
 | 
				
			||||||
    <div className="table-container ">
 | 
					    <div className="table-container">
 | 
				
			||||||
      {/* 表格工具栏 */}
 | 
					      {/* 表格工具栏 */}
 | 
				
			||||||
      {rowSelection && selectedKeys.length > 0 && (
 | 
					      {rowSelection && selectedKeys.length > 0 && (
 | 
				
			||||||
        <div className="table-toolbar">
 | 
					        <div className="table-toolbar">
 | 
				
			||||||
@@ -191,11 +191,9 @@ export const Table: React.FC<TableProps> = ({
 | 
				
			|||||||
                      className="sort-indicators"
 | 
					                      className="sort-indicators"
 | 
				
			||||||
                      onClick={() => handleSort(column.dataIndex)}
 | 
					                      onClick={() => handleSort(column.dataIndex)}
 | 
				
			||||||
                    >
 | 
					                    >
 | 
				
			||||||
                      <span className={`sort-arrow sort-up ${
 | 
					                      <span className={`sort-arrow sort-up ${sortState.field === column.dataIndex && sortState.order === 'asc' ? 'active' : ''
 | 
				
			||||||
                        sortState.field === column.dataIndex && sortState.order === 'asc' ? 'active' : ''
 | 
					 | 
				
			||||||
                        }`}>▲</span>
 | 
					                        }`}>▲</span>
 | 
				
			||||||
                      <span className={`sort-arrow sort-down ${
 | 
					                      <span className={`sort-arrow sort-down ${sortState.field === column.dataIndex && sortState.order === 'desc' ? 'active' : ''
 | 
				
			||||||
                        sortState.field === column.dataIndex && sortState.order === 'desc' ? 'active' : ''
 | 
					 | 
				
			||||||
                        }`}>▼</span>
 | 
					                        }`}>▼</span>
 | 
				
			||||||
                    </div>
 | 
					                    </div>
 | 
				
			||||||
                  )}
 | 
					                  )}
 | 
				
			||||||
 
 | 
				
			|||||||
@@ -8,6 +8,7 @@
 | 
				
			|||||||
  margin-bottom: 24px; /* 底部间距 */
 | 
					  margin-bottom: 24px; /* 底部间距 */
 | 
				
			||||||
  display: flex;
 | 
					  display: flex;
 | 
				
			||||||
  flex-direction: column;
 | 
					  flex-direction: column;
 | 
				
			||||||
 | 
					  max-height: calc(100% - 24px); /* 添加最大高度限制 */
 | 
				
			||||||
}
 | 
					}
 | 
				
			||||||
 | 
					
 | 
				
			||||||
/* 工具栏 */
 | 
					/* 工具栏 */
 | 
				
			||||||
@@ -19,6 +20,8 @@
 | 
				
			|||||||
  background: #f5f5f5;
 | 
					  background: #f5f5f5;
 | 
				
			||||||
  border-bottom: 1px solid #e8e8e8;
 | 
					  border-bottom: 1px solid #e8e8e8;
 | 
				
			||||||
  flex-shrink: 0; /* 工具栏不压缩,保持固定高度 */
 | 
					  flex-shrink: 0; /* 工具栏不压缩,保持固定高度 */
 | 
				
			||||||
 | 
					  min-height: 56px; /* 确保工具栏有固定的最小高度 */
 | 
				
			||||||
 | 
					  box-sizing: border-box; /* 包含padding和border在内的尺寸计算 */
 | 
				
			||||||
}
 | 
					}
 | 
				
			||||||
 | 
					
 | 
				
			||||||
.selected-info {
 | 
					.selected-info {
 | 
				
			||||||
@@ -36,9 +39,9 @@
 | 
				
			|||||||
  display: flex;
 | 
					  display: flex;
 | 
				
			||||||
  flex-direction: column;
 | 
					  flex-direction: column;
 | 
				
			||||||
  flex: 1; /* 占满剩余空间 */
 | 
					  flex: 1; /* 占满剩余空间 */
 | 
				
			||||||
  height: 100%; /* 占满父容器高度 */
 | 
					 | 
				
			||||||
  min-height: 200px; /* 最小高度,避免过小 */
 | 
					  min-height: 200px; /* 最小高度,避免过小 */
 | 
				
			||||||
  overflow: hidden; /* 防止溢出 */
 | 
					  overflow: hidden; /* 防止溢出 */
 | 
				
			||||||
 | 
					  height: 0; /* 重要:配合flex: 1使用,确保正确计算可用空间 */
 | 
				
			||||||
}
 | 
					}
 | 
				
			||||||
 | 
					
 | 
				
			||||||
/* 固定表头容器 */
 | 
					/* 固定表头容器 */
 | 
				
			||||||
@@ -79,6 +82,7 @@
 | 
				
			|||||||
  overflow: hidden;
 | 
					  overflow: hidden;
 | 
				
			||||||
  background: #fff;
 | 
					  background: #fff;
 | 
				
			||||||
  min-height: 0; /* 重要:允许flex子项收缩 */
 | 
					  min-height: 0; /* 重要:允许flex子项收缩 */
 | 
				
			||||||
 | 
					  position: relative; /* 为AutoSizer提供相对定位上下文 */
 | 
				
			||||||
}
 | 
					}
 | 
				
			||||||
 | 
					
 | 
				
			||||||
/* 虚拟行样式 */
 | 
					/* 虚拟行样式 */
 | 
				
			||||||
 
 | 
				
			|||||||
		Reference in New Issue
	
	Block a user