✨ refactor: move table pagination to CardPro footer for consistent layout

Implement unified pagination system by moving pagination from CardTable
to CardPro footer area, ensuring consistent visual layout across all
table pages.

## Changes Made

### Core Components
- **CardPro**: Add `paginationArea` prop to display pagination in card footer
- **CardTable**: Add `hidePagination` prop to control internal pagination visibility
- **utils.js**: Add `createCardProPagination` helper with responsive design
  - Mobile: small size + showQuickJumper + showTotal
  - Desktop: default size + showTotal only

### Table Pages Updated
- Users table (type1): Add external pagination control
- Channels table (type3): Move pagination to CardPro footer
- Tokens table (type1): Implement unified pagination layout
- Redemptions table (type1): Apply consistent pagination pattern
- Usage-logs table (type2): Migrate to external pagination
- MJ-logs table (type2): Update pagination configuration
- Task-logs table (type2): Standardize pagination approach

### Bug Fixes
- Fix CardTable desktop pagination visibility when hidePagination=true
- Standardize data access pattern across all table components
- Remove redundant data destructuring in users table for consistency

## Benefits
- ✅ Consistent pagination position across all tables
- ✅ Better visual hierarchy with fixed footer pagination
- ✅ Responsive design optimized for mobile and desktop
- ✅ Unified codebase with reusable pagination utility
- ✅ Backward compatible with existing table functionality

## Files Modified
- `web/src/components/common/ui/CardPro.js`
- `web/src/components/common/ui/CardTable.js`
- `web/src/helpers/utils.js`
- `web/src/components/table/*/index.jsx` (7 tables)
- `web/src/components/table/*/*.jsx` (7 table components)

web/src/helpers/utils.js

@@ -17,13 +17,14 @@ along with this program. If not, see <https://www.gnu.org/licenses/>.
 For commercial licensing, please contact support@quantumnous.com
 */
 
-import { Toast } from '@douyinfe/semi-ui';
+import { Toast, Pagination } from '@douyinfe/semi-ui';
 import { toastConstants } from '../constants';
 import React from 'react';
 import { toast } from 'react-toastify';
 import { THINK_TAG_REGEX, MESSAGE_ROLES } from '../constants/playground.constants';
 import { TABLE_COMPACT_MODES_KEY } from '../constants';
 import { MOBILE_BREAKPOINT } from '../hooks/common/useIsMobile.js';
+import { useIsMobile } from '../hooks/common/useIsMobile.js';
 
 const HTMLToastContent = ({ htmlContent }) => {
   return <div dangerouslySetInnerHTML={{ __html: htmlContent }} />;
@@ -567,3 +568,35 @@ export const modelSelectFilter = (input, option) => {
   const val = (option?.value || '').toString().toLowerCase();
   return val.includes(input.trim().toLowerCase());
 };
+
+// -------------------------------
+// CardPro 分页配置组件
+// 用于创建 CardPro 的 paginationArea 配置
+export const createCardProPagination = ({
+  currentPage,
+  pageSize,
+  total,
+  onPageChange,
+  onPageSizeChange,
+  pageSizeOpts = [10, 20, 50, 100],
+  showSizeChanger = true,
+}) => {
+  const isMobile = useIsMobile();
+
+  if (!total || total <= 0) return null;
+
+  return (
+    <Pagination
+      currentPage={currentPage}
+      pageSize={pageSize}
+      total={total}
+      pageSizeOpts={pageSizeOpts}
+      showSizeChanger={showSizeChanger}
+      onPageSizeChange={onPageSizeChange}
+      onPageChange={onPageChange}
+      size={isMobile ? "small" : "default"}
+      showQuickJumper={isMobile}
+      showTotal
+    />
+  );
+};