From a1dc2ab65fd0bbb7e86a7e05e1543e9f5d9f65e9 Mon Sep 17 00:00:00 2001
From: =?UTF-8?q?=E9=BB=84=E5=BF=83=E5=AE=87laptop?= <xyhuang29@outlook.com>
Date: Mon, 16 Mar 2026 15:30:52 +0800
Subject: [PATCH] =?UTF-8?q?=E5=BC=80=E6=BA=90=E6=BF=80=E5=8A=B1=E6=96=B0?=
 =?UTF-8?q?=E5=A2=9Eqrcode?=
MIME-Version: 1.0
Content-Type: text/plain; charset=UTF-8
Content-Transfer-Encoding: 8bit

---
 src/activity/image/wechat-qrcode.png          | Bin 0 -> 652 bytes
 .../incentiveprogram/contactFloat.jsx         |  34 +++++++
 .../incentiveprogram/contactFloat.scss        |  96 ++++++++++++++++++
 src/activity/incentiveprogram/index.jsx       |   2 +
 4 files changed, 132 insertions(+)
 create mode 100644 src/activity/image/wechat-qrcode.png
 create mode 100644 src/activity/incentiveprogram/contactFloat.jsx
 create mode 100644 src/activity/incentiveprogram/contactFloat.scss

diff --git a/src/activity/image/wechat-qrcode.png b/src/activity/image/wechat-qrcode.png
new file mode 100644
index 0000000000000000000000000000000000000000..aaa8baac3b6c2df6716c79b8d1ea37fe9a62a755
GIT binary patch
literal 652
zcmV;70(1R|P)<h;3K|Lk000e1NJLTq00Arj00Ark0{{R3L$e$<00006P)t-s|Ns90
z0033O(|!N|010qNS#tmY4#WTe4#WYKD-Ig~00JyYL_t(&f$f=5a>O7EL%A78gQIbj
z+{BG783@_!bowo_L(<{pM{8N0ZYh6T&0_WYsW<DsjXJ8?C?)Q`E@3aMhkAbA{T<(K
zE|^jL;eHhM0rNA$DX#&k6k6DKZ0)J+EKFg)V64xm!s%yWzhJbp`NyB2Zt)H{-mVu$
zjPcRdHR`&~lo3X3u7>FFJq~H;a|xTLF0L^{qB^4ivI`Crsjw4cWUQx#*u}7t4N=&M
z8COI|?5hn%Z6ZE|J+T?L$d4Aq8L3fI=J-q46T^{lXo(#o3LD}47K9yGm>C5bcM6;G
zq9F=9u^tUD0t91T12Q&4U&20MOW{<RnTsAcI7JKFv65B>fVT$HV=OxhJ278K+|(He
zOOtjMc49oYIj*$T0xJc+g#8nnUT^D;bSW5a{4VT;1y>exUpRCI8qaS**oOHEQFAp^
zC0at1<|x8WETUz_a~zRC%6PlHguO5%Gdf{mMo(R#auxQ%$kEfj+Q^CK>3U&1)}U_E
z{+MwaC7E^>c3_Fn&@(=!pUpPc3)`^50D+kU!?<EG@vR?&gl$+hLa_dtD+)*Bjw4|^
zma8#(JOAsBCJ1i}dt(g}Mho=Z?HKdoRrEu9{P-x0ST9f&(#FWL#YenRg?+%n&Yc6E
zb2ThXFI&nh>@(J<XGejPXYh_9>?>vzH_9^Q<)n8Bdt<OOYcf7iv{LGa>xCtTQk=zk
mbJ72*F?4BXVgJJZwtfJ*1pe(U;66hD0000<MNUMnLSTX}+#YuT

literal 0
HcmV?d00001

diff --git a/src/activity/incentiveprogram/contactFloat.jsx b/src/activity/incentiveprogram/contactFloat.jsx
new file mode 100644
index 000000000..c9700c296
--- /dev/null
+++ b/src/activity/incentiveprogram/contactFloat.jsx
@@ -0,0 +1,34 @@
+import React, { useState } from "react";
+import "./contactFloat.scss";
+import { Icon } from "antd";
+
+export default function ContactFloat() {
+  const [isExpanded, setIsExpanded] = useState(false);
+
+  return (
+    <div className={`contact-float ${isExpanded ? "expanded" : ""}`}>
+      <div className="contact-float-toggle" onClick={() => setIsExpanded(!isExpanded)}>
+        <Icon type={isExpanded ? "close" : "customer-service"} />
+        <span className="contact-float-text">{isExpanded ? "收起" : "联系我们"}</span>
+      </div>
+      
+      <div className="contact-float-content">
+        <div className="contact-float-tip">活动专属咨询：扫码添加，快速解答您的疑问</div>
+        
+        <div className="contact-float-qrcode">
+          <img src={require("../image/wechat-qrcode.png")} alt="微信二维码" width={120} height={120} />
+        </div>
+        
+        <div className="contact-float-wechat">
+          <div className="contact-float-wechat-label">微信</div>
+          <div className="contact-float-wechat-id">GR</div>
+        </div>
+        
+        <div className="contact-float-email">
+          <div className="contact-float-wechat-label">邮箱</div>
+          <div className="contact-float-wechat-id">gr@chancefoundation.org.cn</div>
+        </div>
+      </div>
+    </div>
+  );
+}
diff --git a/src/activity/incentiveprogram/contactFloat.scss b/src/activity/incentiveprogram/contactFloat.scss
new file mode 100644
index 000000000..4cc9dc92a
--- /dev/null
+++ b/src/activity/incentiveprogram/contactFloat.scss
@@ -0,0 +1,96 @@
+.contact-float {
+  position: fixed;
+  right: 0;
+  top: 20%;
+//   transform: translateY(-50%);
+  transform: translateX(100%);
+  z-index: 1000;
+  transition: all 0.3s ease;
+
+  .contact-float-toggle {
+    position: absolute;
+    // right: 0;
+    transform: translateX(-100%);
+    background: linear-gradient(132.09deg, #4689ff 0%, #5182ff 28.18%, #b546ff 100%);
+    color: white;
+    padding: 12px 8px;
+    border-radius: 8px 0 0 8px;
+    cursor: pointer;
+    display: flex;
+    align-items: center;
+    gap: 8px;
+    writing-mode: vertical-lr;
+    font-size: 14px;
+    box-shadow: -2px 0 8px rgba(70, 106, 255, 0.3);
+    transition: all 0.3s ease;
+
+    &:hover {
+      padding-right: 12px;
+    }
+
+    .anticon {
+      font-size: 18px;
+    }
+  }
+
+  .contact-float-content {
+    width: 200px;
+    padding: 20px;
+    overflow: hidden;
+    background: white;
+    border-radius: 0 0 0 12px;
+    box-shadow: -4px 0 20px rgba(0, 0, 0, 0.1);
+    transition: all 0.3s ease;
+    display: flex;
+    flex-direction: column;
+    align-items: center;
+  }
+
+  &.expanded {
+    transform: translatex(0);
+  }
+
+  .contact-float-tip {
+    font-size: 12px;
+    color: #666;
+    text-align: center;
+    margin-bottom: 16px;
+    line-height: 1.5;
+  }
+
+  .contact-float-qrcode {
+    text-align: center;
+    margin-bottom: 16px;
+
+    img {
+      border-radius: 8px;
+      border: 1px solid #f0f0f0;
+    }
+  }
+
+  .contact-float-wechat,
+  .contact-float-email {
+    text-align: center;
+    padding-top: 12px;
+    width: 100%;
+
+    &:not(:last-child) {
+      border-bottom: 1px solid #f0f0f0;
+      padding-bottom: 12px;
+      margin-bottom: 4px;
+    }
+
+    .contact-float-wechat-label {
+      font-size: 12px;
+      color: #999;
+      margin-bottom: 4px;
+    }
+
+    .contact-float-wechat-id {
+      font-size: 14px;
+      color: #333;
+      font-weight: 500;
+      word-break: break-all;
+    }
+  }
+}
diff --git a/src/activity/incentiveprogram/index.jsx b/src/activity/incentiveprogram/index.jsx
index b194d07c4..757af1ce0 100644
--- a/src/activity/incentiveprogram/index.jsx
+++ b/src/activity/incentiveprogram/index.jsx
@@ -5,6 +5,7 @@ import { Divider, Icon } from "antd";
 import Light from "./light";
 import Project from "./project";
 import Time from "./time";
+import ContactFloat from "./contactFloat";
 
 function Incentiveprogram(props) {
 
@@ -35,6 +36,7 @@ function Incentiveprogram(props) {
   ]
 
   return <div className="incentiveprogram_box">
+    <ContactFloat/>
     <div className="banner_Incentiveprogram">
       <div className="banner_item_box">
         <span className="banner_item_1 color-white">