1

video-gen-app/src/components/Layout/AppLayout.tsx

@@ -172,7 +172,7 @@ const AppLayout: React.FC = () => {
   const [enabledMethods, setEnabledMethods] = useState<{ alipay: boolean; wechat: boolean }>({ alipay: false, wechat: false });
   const [contactModalOpen, setContactModalOpen] = useState(false);
   const [contactForm] = Form.useForm();
-  const [contactExpanded, setContactExpanded] = useState(true);
+  const [contactHovered, setContactHovered] = useState(false);
   const [submittingContact, setSubmittingContact] = useState(false);
 
   // LocalStorage keys
@@ -1009,61 +1009,32 @@ const AppLayout: React.FC = () => {
       <div style={{
         position: 'fixed',
         right: 24,
-        bottom: contactExpanded ? 100 : 24,
+        bottom: 24,
         zIndex: 1000,
-        transition: 'bottom 0.3s ease',
       }}>
         <div style={{
-          display: 'flex',
-          flexDirection: 'column',
-          alignItems: 'flex-end',
-          gap: 12,
+          position: 'relative',
         }}>
-          {contactExpanded && (
-            <div style={{
-              padding: '16px 20px',
-              background: '#ffffff',
-              borderRadius: 16,
-              boxShadow: '0 8px 32px rgba(0,0,0,0.12)',
-              minWidth: 280,
-              animation: 'slideUp 0.3s ease',
-            }}>
-              <div style={{
-                color: '#1e293b',
-                fontSize: 16,
-                fontWeight: 600,
-                marginBottom: 12,
-                display: 'flex',
-                alignItems: 'center',
-                gap: 8,
-              }}>
-                <MessageOutlined style={{ color: '#6366f1' }} />
-                联系我们
-              </div>
-              <div style={{
-                padding: '12px 16px',
-                background: 'rgba(99, 102, 241, 0.06)',
-                borderRadius: 12,
-                marginBottom: 12,
-              }}>
-                <div style={{ color: '#64748b', fontSize: 13, marginBottom: 4 }}>商务咨询</div>
-                <div style={{ color: '#1e293b', fontSize: 14, fontWeight: 600 }}>400-888-8888</div>
-              </div>
-              <Button
-                type="primary"
-                block
-                onClick={() => setContactModalOpen(true)}
-                style={{
-                  borderRadius: 10,
-                  background: 'linear-gradient(135deg, #6366f1 0%, #8b5cf6 100%)',
-                  border: 'none',
-                }}>
-                在线咨询
-              </Button>
-            </div>
-          )}
+          <div
+            style={{
+              position: 'absolute',
+              right: 64,
+              bottom: 8,
+              padding: '8px 16px',
+              background: '#1e293b',
+              color: '#ffffff',
+              borderRadius: 8,
+              fontSize: 13,
+              whiteSpace: 'nowrap',
+              opacity: contactHovered ? 1 : 0,
+              transition: 'opacity 0.2s ease',
+              pointerEvents: 'none',
+            }}
+          >
+            联系我们
+          </div>
           <button
-            onClick={() => setContactExpanded(!contactExpanded)}
+            onClick={() => setContactModalOpen(true)}
             style={{
               width: 56,
               height: 56,
@@ -1081,17 +1052,15 @@ const AppLayout: React.FC = () => {
             onMouseEnter={(e) => {
               e.currentTarget.style.transform = 'scale(1.05)';
               e.currentTarget.style.boxShadow = '0 6px 24px rgba(99, 102, 241, 0.5)';
+              setContactHovered(true);
             }}
             onMouseLeave={(e) => {
               e.currentTarget.style.transform = 'scale(1)';
               e.currentTarget.style.boxShadow = '0 4px 20px rgba(99, 102, 241, 0.4)';
+              setContactHovered(false);
             }}
           >
-            {contactExpanded ? (
-              <DownOutlined style={{ fontSize: 20 }} />
-            ) : (
-              <MessageOutlined style={{ fontSize: 20 }} />
-            )}
+            <MessageOutlined style={{ fontSize: 20 }} />
           </button>
         </div>
       </div>