Просмотр исходного кода

💄 style(table): 统一管理后台表格样式

- 为ClassroomDataPage、DateNotesPage、StockDataPage和SubmissionRecordsPage表格添加边框
- 设置表格横向滚动以适应宽表格内容
- 统一表头背景色为#f9fafb
- 实现表格行交替背景色,提升可读性
- 统一设置rowKey为id属性
yourname 5 месяцев назад
Родитель
Сommit
3f54cdd10a

+ 5 - 0
src/client/admin/pages/ClassroomDataPage.tsx

@@ -256,6 +256,11 @@ export const ClassroomDataPage: React.FC = () => {
           showTotal: (total) => `共 ${total} 条记录`,
           showTotal: (total) => `共 ${total} 条记录`,
         }}
         }}
         onChange={(p) => setPagination({ ...pagination, current: p.current || 1, pageSize: p.pageSize || 10 })}
         onChange={(p) => setPagination({ ...pagination, current: p.current || 1, pageSize: p.pageSize || 10 })}
+        bordered
+        scroll={{ x: 'max-content' }}
+        headerCellStyle={{ backgroundColor: '#f9fafb' }}
+        rowClassName={(record, index) => index % 2 === 0 ? 'bg-white' : 'bg-gray-50'}
+        rowKey="id"
       />
       />
       
       
       <Modal
       <Modal

+ 4 - 0
src/client/admin/pages/DateNotesPage.tsx

@@ -249,6 +249,10 @@ export const DateNotesPage: React.FC = () => {
         }}
         }}
         onChange={(p) => setPagination({ ...pagination, current: p.current || 1, pageSize: p.pageSize || 10 })}
         onChange={(p) => setPagination({ ...pagination, current: p.current || 1, pageSize: p.pageSize || 10 })}
         rowKey="id"
         rowKey="id"
+        bordered
+        scroll={{ x: 'max-content' }}
+        headerCellStyle={{ backgroundColor: '#f9fafb' }}
+        rowClassName={(record, index) => index % 2 === 0 ? 'bg-white' : 'bg-gray-50'}
       />
       />
       
       
       <Modal
       <Modal

+ 4 - 0
src/client/admin/pages/StockDataPage.tsx

@@ -262,6 +262,10 @@ export const StockDataPage: React.FC = () => {
         }}
         }}
         onChange={(p) => setPagination({ ...pagination, current: p.current || 1, pageSize: p.pageSize || 10 })}
         onChange={(p) => setPagination({ ...pagination, current: p.current || 1, pageSize: p.pageSize || 10 })}
         rowKey="id"
         rowKey="id"
+        bordered
+        scroll={{ x: 'max-content' }}
+        headerCellStyle={{ backgroundColor: '#f9fafb' }}
+        rowClassName={(record, index) => index % 2 === 0 ? 'bg-white' : 'bg-gray-50'}
       />
       />
       
       
       {/* 添加/编辑模态框 */}
       {/* 添加/编辑模态框 */}

+ 5 - 0
src/client/admin/pages/SubmissionRecordsPage.tsx

@@ -269,6 +269,11 @@ export const SubmissionRecordsPage: React.FC = () => {
           showTotal: (total) => `共 ${total} 条记录`,
           showTotal: (total) => `共 ${total} 条记录`,
         }}
         }}
         onChange={(p) => setPagination({ ...pagination, current: p.current || 1, pageSize: p.pageSize || 10 })}
         onChange={(p) => setPagination({ ...pagination, current: p.current || 1, pageSize: p.pageSize || 10 })}
+        bordered
+        scroll={{ x: 'max-content' }}
+        headerCellStyle={{ backgroundColor: '#f9fafb' }}
+        rowClassName={(record, index) => index % 2 === 0 ? 'bg-white' : 'bg-gray-50'}
+        rowKey="id"
       />
       />
       
       
       <Modal
       <Modal