feat: link user info modal with payment flow for VIP renewal

frontend/src/components/UserInfoModal.tsx

@@ -8,9 +8,10 @@ interface UserInfoModalProps {
     username: string;
     isVip: boolean;
     vipExpireAt: string | null;
+    onRenewVip?: () => void;
 }
 
-export default function UserInfoModal({ isOpen, onClose, username, isVip, vipExpireAt }: UserInfoModalProps) {
+export default function UserInfoModal({ isOpen, onClose, username, isVip, vipExpireAt, onRenewVip }: UserInfoModalProps) {
     if (!isOpen) return null;
 
     // 格式化到期日期
@@ -87,10 +88,11 @@ export default function UserInfoModal({ isOpen, onClose, username, isVip, vipExp
 
                     {/* 按钮 */}
                     <button
-                        onClick={onClose}
-                        className="w-full mt-8 bg-gray-700 hover:bg-gray-600 text-white font-bold py-3 rounded-xl transition-colors"
+                        onClick={onRenewVip || onClose}
+                        className="w-full mt-8 bg-gradient-to-r from-yellow-500 to-orange-600 hover:from-yellow-400 hover:to-orange-500 text-white font-bold py-3.5 rounded-xl transition-all shadow-lg shadow-orange-900/20 active:scale-[0.98] flex items-center justify-center gap-2"
                     >
-                        我知道了
+                        <Crown size={16} />
+                        <span>会员续费</span>
                     </button>
                 </div>
             </div>

frontend/src/components/UserMenu.tsx

@@ -165,6 +165,10 @@ export default function UserMenu({ compact = false }: UserMenuProps) {
                 username={username || ''}
                 isVip={isVip}
                 vipExpireAt={vipExpireAt}
+                onRenewVip={() => {
+                    setShowUserInfo(false);
+                    setShowPayment(true);
+                }}
             />
             <AdminPanel
                 isOpen={showAdminPanel}