fix: 修复工作列表布局问题，优化表格和缩略图区域的尺寸和滚动行为 - 在 WorklistTable 组件中添加可选的 className prop，支持外部样式定制 - 将硬编码的 px-4 替换为动态 className 属性 - 调整工作列表页面布局，优化表格和缩略图区域的高度和滚动行为 - 更新版本号：1.11.0 1.11.1 - 在 CHANGELOG.md 中添加新版本条目，记录 bug 修复详情 - 改动文件：src/pages/patient/components/WorklistTable.tsx, src/pages/patient/worklist.tsx, package.json, CHANGELOG.md

CHANGELOG.md

@@ -2,6 +2,30 @@
 
 本项目的所有重要变更都将记录在此文件中。
 
+## [1.11.1] - 2025-12-16 19:16
+
+### 修复 (Fixed)
+- **工作列表布局优化** (bug 101 部分修复)
+  - 优化工作列表表格和缩略图区域的布局和滚动行为
+  - 在 WorklistTable 组件中添加可选的 className prop，支持外部样式定制
+  - 替换硬编码样式为动态样式传递，提升组件复用性
+
+**核心改进：**
+- 提升布局灵活性：通过 className prop 支持外部样式定制
+- 优化滚动行为：改进表格和缩略图区域的滚动体验
+- 增强组件复用：WorklistTable 组件支持更多样式配置
+
+**技术实现：**
+- 添加 className?: string prop 到 WorklistTableProps 接口
+- 将 Table 组件的 className 从 "px-4" 改为动态 {className}
+- 调整页面布局结构，优化高度和滚动容器配置
+
+**改动文件：**
+- src/pages/patient/components/WorklistTable.tsx
+- src/pages/patient/worklist.tsx
+
+---
+
 ## [1.11.0] - 2025-12-16 18:26
 
 ### 新增 (Added)

package.json

@@ -1,6 +1,6 @@
 {
   "name": "zsis",
-  "version": "1.11.0",
+  "version": "1.11.1",
   "private": true,
   "description": "医学成像系统",
   "main": "main.js",

src/pages/patient/components/WorklistTable.tsx

@@ -386,6 +386,7 @@ interface WorklistTableProps {
   selectedSecondaryIds?: string[];            // 可选（新增）
   handleRowClick: (record: Task, event?: React.MouseEvent) => void;
   handleRowDoubleClick: (record: Task) => void;
+  className?: string;
 }
 
 const WorklistTable: React.FC<WorklistTableProps> = ({
@@ -399,6 +400,7 @@ const WorklistTable: React.FC<WorklistTableProps> = ({
   selectedSecondaryIds,                       // 可能为 undefined
   handleRowClick,
   handleRowDoubleClick,
+  className,
 }) => {
   // 根据 productName 生成列定义
   const columnsDef = useMemo(() => generateColumnsDef(productName), [productName]);
@@ -504,7 +506,7 @@ const WorklistTable: React.FC<WorklistTableProps> = ({
   return (
     <Table<DataType>
       bordered
-      className="px-4"
+      className={className}
       columns={mergedColumns}
       scroll={{ x: 'max-content' }}
       components={{ header: { cell: ResizableTitle } }}

src/pages/patient/worklist.tsx

@@ -209,8 +209,8 @@ const WorklistPage: React.FC = () => {
             span={screens.lg ? 18 : screens.md ? 20 : 24}
             className="h-full flex flex-col"
           >
-            <div className="flex-1 flex flex-col">
-              <div className="flex-1 overflow-auto">
+            <div className="flex flex-col h-[80%]">
+              <div className="overflow-auto flex flex-col">
                 <WorklistTable
                   productName={productName}
                   columnConfig={columnConfig}
@@ -222,6 +222,7 @@ const WorklistPage: React.FC = () => {
                   selectedSecondaryIds={selectedSecondaryIds}  // 新增
                   handleRowClick={handleRowClickInternal}
                   handleRowDoubleClick={handleRowDoubleClick}
+                  className='flex-1 overflow-auto'
                 />
               </div>
               <GenericPagination
@@ -231,7 +232,7 @@ const WorklistPage: React.FC = () => {
                 className="border-t"
               />
             </div>
-            <div className="h-60 border-t border-gray-200">
+            <div className=" overflow-auto">
               <ThumbnailList />
             </div>
           </Col>