feat(tables): add "No Results" empty state for all table components

Add consistent empty state handling across all table components to improve
user experience when search/filter results are empty.

Changes:
- Import Empty component and IllustrationNoResult/IllustrationNoResultDark from @douyinfe/semi-ui
- Add empty prop to Table components with "搜索无结果" message
- Support both light and dark theme illustrations
- Apply internationalization support for empty state text

Affected files:
- web/src/components/table/MjLogsTable.js
- web/src/components/table/LogsTable.js
- web/src/components/table/ChannelsTable.js
- web/src/components/table/RedemptionsTable.js
- web/src/components/table/TaskLogsTable.js
- web/src/components/table/TokensTable.js
- web/src/components/table/UsersTable.js
- web/src/components/table/ModelPricing.js

This ensures consistent UX across all table components when no data
matches the current search or filter criteria.
This commit is contained in:
Apple\Apple
2025-06-08 23:42:39 +08:00
parent 74be7b20f6
commit 9dbfd1b0af
9 changed files with 107 additions and 2 deletions

View File

@@ -40,6 +40,7 @@ import {
Avatar,
Button,
Descriptions,
Empty,
Modal,
Popover,
Space,
@@ -53,6 +54,10 @@ import {
Divider,
Form
} from '@douyinfe/semi-ui';
import {
IllustrationNoResult,
IllustrationNoResultDark
} from '@douyinfe/semi-illustrations';
import { ITEMS_PER_PAGE } from '../../constants';
import Paragraph from '@douyinfe/semi-ui/lib/es/typography/paragraph';
import { IconSetting, IconSearch, IconForward } from '@douyinfe/semi-icons';
@@ -1367,6 +1372,14 @@ const LogsTable = () => {
scroll={{ x: 'max-content' }}
className='rounded-xl overflow-hidden'
size='middle'
empty={
<Empty
image={<IllustrationNoResult style={{ width: 150, height: 150 }} />}
darkModeImage={<IllustrationNoResultDark style={{ width: 150, height: 150 }} />}
description={t('搜索无结果')}
style={{ padding: 30 }}
/>
}
pagination={{
formatPageText: (page) =>
t('第 {{start}} - {{end}} 条,共 {{total}} 条', {