♻️ refactor(FinancialDashboard): 重构浮动按钮组件结构

- 将浮动按钮的文字内容整合到Icon组件内部，优化组件封装
- 移除冗余的绝对定位样式，统一通过size属性控制图标大小
- 优化返回按钮箭头实现方式，使用SVG替代图片引用

💄 style(Icon): 调整图标样式和布局

- 为浮动按钮添加文字区域，实现图标与文字的统一管理
- 优化返回按钮SVG样式，增强视觉效果和可维护性
- 调整元素定位和间距，确保UI显示一致性

src/client/home/pages/FinancialDashboard/FinancialDashboard.tsx

@@ -167,15 +167,11 @@ export default function FinancialDashboard() {
       <div className="absolute contents left-[1765px] top-[923px]" data-name="浮动icon">
         <div className="absolute contents left-[1765px] top-[923px]">
           <div
-            className="absolute flex items-center justify-center left-[1765px] size-[108px] top-[923px] cursor-pointer hover:opacity-80 transition-opacity"
+            className="absolute flex items-center justify-center left-[1765px] top-[923px] cursor-pointer hover:opacity-80 transition-opacity"
             onClick={handleFloatButtonClick}
           >
-            {/* 使用浮动按钮状态的Icon组件 */}
-            <Icon variant="float" />
-          </div>
-          <div className="absolute font-['PingFang_SC:Medium',sans-serif] h-[51px] leading-[normal] left-[1818.5px] not-italic text-[20px] text-center text-white top-[952px] tracking-[0.6349px] translate-x-[-50%] w-[55px] whitespace-pre-wrap">
-            <p className="mb-0">变动</p>
-            <p>幅度</p>
+            {/* 使用浮动按钮状态的Icon组件 - 包含图标和文字 */}
+            <Icon variant="float" className="size-[108px]" />
           </div>
         </div>
       </div>

src/client/home/pages/FinancialDashboard/components/Icon.tsx

@@ -8,19 +8,29 @@ export default function Icon({ className, variant = 'back' }: IconProps) {
   return (
     <div className={className} data-name={variant === 'float' ? '浮动icon' : '返回icon'}>
       {variant === 'float' ? (
-        // 浮动按钮样式
-        <div className="absolute aspect-[84/84] bottom-[2.38%] flex items-center justify-center left-1/2 top-[2.38%] translate-x-[-50%]">
-          <div className="flex-none rotate-[180deg] scale-y-[-100%] size-[108px]">
-            <div className="relative size-full">
-              <div className="absolute inset-[-1.25%]">
-                <img
-                  alt=""
-                  className="block max-w-none size-full"
-                  src="/financial-dashboard/ellipse4119.svg"
-                />
+        // 浮动按钮样式 - 包含图标和文字
+        <div className="relative size-full">
+          {/* 浮动按钮图标 */}
+          <div className="absolute aspect-[84/84] bottom-[2.38%] flex items-center justify-center left-1/2 top-[2.38%] translate-x-[-50%]">
+            <div className="flex-none rotate-[180deg] scale-y-[-100%] size-[108px]">
+              <div className="relative size-full">
+                <div className="absolute inset-[-1.25%]">
+                  <img
+                    alt=""
+                    className="block max-w-none size-full"
+                    src="/financial-dashboard/ellipse4119.svg"
+                  />
+                </div>
               </div>
             </div>
           </div>
+          {/* 浮动按钮文字 */}
+          <div className="absolute flex flex-col items-center left-1/2 top-[calc(100%+-82px)] translate-x-[-50%]">
+            <div className="font-['PingFang_SC:Medium',sans-serif] h-[51px] leading-[normal] not-italic text-[20px] text-center text-white tracking-[0.6349px] w-[55px] whitespace-pre-wrap">
+              <p className="mb-0">变动</p>
+              <p>幅度</p>
+            </div>
+          </div>
         </div>
       ) : (
         // 返回按钮样式 - 包含外圈和向左箭头
@@ -39,19 +49,24 @@ export default function Icon({ className, variant = 'back' }: IconProps) {
               </div>
             </div>
           </div>
-          {/* 向左箭头 */}
+          {/* 向左箭头 SVG */}
           <div className="absolute flex inset-[31.17%_39.47%] items-center justify-center">
-            <div className="flex-none h-[17.684px] rotate-[270deg] w-[31.641px]">
-              <div className="relative size-full" data-name="路径">
-                <div className="absolute inset-[-47.5%_-26.55%]">
-                  <img
-                    alt=""
-                    className="block max-w-none size-full"
-                    src="/financial-dashboard/return-icon-path.svg"
-                  />
-                </div>
-              </div>
-            </div>
+            <svg width="37" height="52" viewBox="0 0 37 52" fill="none" xmlns="http://www.w3.org/2000/svg">
+              <g filter="url(#filter0_d_1977_82237)">
+                <path fill-rule="evenodd" clip-rule="evenodd" d="M24.9389 42.8996C25.2582 42.9109 25.5689 42.7951 25.8025 42.5778L27.5649 40.9398C27.7984 40.7223 27.9357 40.4212 27.9466 40.1027C27.9574 39.7842 27.8409 39.4745 27.6227 39.2418L15.199 25.9506L27.6227 12.6571C28.0755 12.1727 28.0496 11.4141 27.5649 10.9615L25.8025 9.32348C25.5692 9.10584 25.2587 8.9896 24.9394 9.00041C24.6201 9.01123 24.3183 9.14819 24.1003 9.38111L10.1959 24.255L9.38209 25.0116C9.12173 25.2537 8.98239 25.5985 9.00166 25.953C8.98385 26.3059 9.12306 26.6487 9.38209 26.8897L10.2007 27.6462L24.1003 42.5177C24.3179 42.751 24.6196 42.8884 24.9389 42.8996Z" fill="#C9DDFF"/>
+              </g>
+              <defs>
+                <filter id="filter0_d_1977_82237" x="0" y="0" width="36.9473" height="51.9004" filterUnits="userSpaceOnUse" colorInterpolationFilters="sRGB">
+                  <feFlood floodOpacity="0" result="BackgroundImageFix"/>
+                  <feColorMatrix in="SourceAlpha" type="matrix" values="0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 127 0" result="hardAlpha"/>
+                  <feOffset/>
+                  <feGaussianBlur stdDeviation="4.5"/>
+                  <feColorMatrix type="matrix" values="0 0 0 0 0.788235 0 0 0 0 0.866667 0 0 0 0 1 0 0 0 0.501961 0"/>
+                  <feBlend mode="normal" in2="BackgroundImageFix" result="effect1_dropShadow_1977_82237"/>
+                  <feBlend mode="normal" in="SourceGraphic" in2="effect1_dropShadow_1977_82237" result="shape"/>
+                </filter>
+              </defs>
+            </svg>
           </div>
         </div>
       )}