🎨 feat(ui): enhance pricing components with improved icons and responsive design

- Replace copy button icon from semi-ui IconCopy to lucide-react Copy in PricingCardView
- Add conditional tooltip functionality to SelectableButtonGroup that only shows when text overflows
- Implement responsive table column behavior in PricingTableColumns with mobile-aware fixed positioning
- Use DOM-based overflow detection (scrollWidth vs clientWidth) for better performance
- Apply useIsMobile hook to conditionally set fixed: 'right' only on desktop devices

These changes improve user experience across different screen sizes and provide more consistent iconography throughout the pricing interface.

web/src/components/table/model-pricing/layout/header/SearchActions.jsx

@@ -18,8 +18,8 @@ For commercial licensing, please contact support@quantumnous.com
 */
 
 import React, { memo, useCallback } from 'react';
-import { Input, Button } from '@douyinfe/semi-ui';
-import { IconSearch, IconCopy, IconFilter } from '@douyinfe/semi-icons';
+import { Input, Button, Switch, Select, Divider, Tooltip } from '@douyinfe/semi-ui';
+import { IconSearch, IconCopy, IconFilter, IconHelpCircle } from '@douyinfe/semi-icons';
 
 const SearchActions = memo(({
   selectedRowKeys = [],
@@ -30,6 +30,16 @@ const SearchActions = memo(({
   isMobile = false,
   searchValue = '',
   setShowFilterModal,
+  showWithRecharge,
+  setShowWithRecharge,
+  currency,
+  setCurrency,
+  showRatio,
+  setShowRatio,
+  viewMode,
+  setViewMode,
+  tokenUnit,
+  setTokenUnit,
   t
 }) => {
   const handleCopyClick = useCallback(() => {
@@ -42,6 +52,14 @@ const SearchActions = memo(({
     setShowFilterModal?.(true);
   }, [setShowFilterModal]);
 
+  const handleViewModeToggle = useCallback(() => {
+    setViewMode?.(viewMode === 'table' ? 'card' : 'table');
+  }, [viewMode, setViewMode]);
+
+  const handleTokenUnitToggle = useCallback(() => {
+    setTokenUnit?.(tokenUnit === 'K' ? 'M' : 'K');
+  }, [tokenUnit, setTokenUnit]);
+
   return (
     <div className="flex items-center gap-2 w-full">
       <div className="flex-1">
@@ -67,6 +85,63 @@ const SearchActions = memo(({
         {t('复制')}
       </Button>
 
+      {!isMobile && (
+        <>
+          <Divider layout="vertical" margin="8px" />
+
+          {/* 充值价格显示开关 */}
+          <div className="flex items-center gap-2">
+            <span className="text-sm text-gray-600">{t('充值价格显示')}</span>
+            <Switch
+              checked={showWithRecharge}
+              onChange={setShowWithRecharge}
+            />
+          </div>
+
+          {/* 货币单位选择 */}
+          {showWithRecharge && (
+            <Select
+              value={currency}
+              onChange={setCurrency}
+              optionList={[
+                { value: 'USD', label: 'USD' },
+                { value: 'CNY', label: 'CNY' }
+              ]}
+            />
+          )}
+
+          {/* 显示倍率开关 */}
+          <div className="flex items-center gap-2">
+            <span className="text-sm text-gray-600">{t('倍率')}</span>
+            <Tooltip content={t('倍率是用于系统计算不同模型的最终价格用的，如果您不理解倍率，请忽略')}>
+              <IconHelpCircle size="small" style={{ color: 'var(--semi-color-text-2)', cursor: 'help' }} />
+            </Tooltip>
+            <Switch
+              checked={showRatio}
+              onChange={setShowRatio}
+            />
+          </div>
+
+          {/* 视图模式切换按钮 */}
+          <Button
+            theme={viewMode === 'table' ? 'solid' : 'outline'}
+            type={viewMode === 'table' ? 'primary' : 'tertiary'}
+            onClick={handleViewModeToggle}
+          >
+            {t('表格视图')}
+          </Button>
+
+          {/* Token单位切换按钮 */}
+          <Button
+            theme={tokenUnit === 'K' ? 'solid' : 'outline'}
+            type={tokenUnit === 'K' ? 'primary' : 'tertiary'}
+            onClick={handleTokenUnitToggle}
+          >
+            {tokenUnit}
+          </Button>
+        </>
+      )}
+
       {isMobile && (
         <Button
           theme="outline"