🎨 feat(ui): enhance table headers with descriptive titles and semantic icons

- Add informative header section to TokensTable with Key icon and description
- Replace generic eye icon with semantic Ticket icon in RedemptionsTable header
- Import additional UI components (Divider, Typography) for better layout structure
- Improve user experience with contextual information about token and redemption functionality
- Maintain consistent styling and layout between both table components

The changes provide users with clear understanding of each table's purpose:
- Tokens: "令牌用于API访问认证，可以设置额度限制和模型权限" with Key icon
- Redemptions: "兑换码可以批量生成和分发，适合用于推广活动或批量充值" with Ticket icon

web/src/components/table/RedemptionsTable.js

@@ -13,7 +13,8 @@ import {
   XCircle,
   Minus,
   HelpCircle,
-  Coins
+  Coins,
+  Ticket
 } from 'lucide-react';
 
 import { ITEMS_PER_PAGE } from '../../constants';
@@ -450,7 +451,7 @@ const RedemptionsTable = () => {
     <div className="flex flex-col w-full">
       <div className="mb-2">
         <div className="flex items-center text-orange-500">
-          <IconEyeOpened className="mr-2" />
+          <Ticket size={16} className="mr-2" />
           <Text>{t('兑换码可以批量生成和分发，适合用于推广活动或批量充值。')}</Text>
         </div>
       </div>