feat:线下活动

src/pages/index/index.jsx

@@ -71,14 +71,14 @@ const Index = () => {
     }
   };
 
-  const getWxidFromUrl=()=>{
+  const getWxidFromUrl = () => {
     const urlParams = new URLSearchParams(window.location.search);
-    const wxid = urlParams.get('wxid');
-    setwxid(wxid)
+    const wxid = urlParams.get("wxid");
+    setwxid(wxid);
     // window.alert(wxid)
     return wxid;
-}
-  
+  };
+
   // 网页查看通知
   // 入群申请
 
@@ -89,7 +89,7 @@ const Index = () => {
     // o7LFAwR32hWGq9XOpd7ZxK1wZxq8
     // window.alert(window.localStorage.getItem('openid'))
     // 获取wxid参数
-    getWxidFromUrl()
+    getWxidFromUrl();
   }, []);
 
   const goBack = () => {
@@ -142,11 +142,61 @@ const Index = () => {
         </View>
       </View>
 
-      <View className="index-card">
-        <View>独立博客</View>
-        <View>独立博客</View>
+      {/* 付费合集 */}
+      <View className="index-list">
+        <AtList>
+          <AtListItem
+            title="云手机"
+            arrow="right"
+            // hasBorder={false}
+            thumb="https://img12.360buyimg.com/jdphoto/s72x72_jfs/t6160/14/2008729947/2754/7d512a86/595c3aeeNa89ddf71.png"
+            onClick={() => {}}
+          />
+          <AtListItem
+            title="微信机器人"
+            arrow="right"
+            // hasBorder={false}
+            thumb="http://img10.360buyimg.com/jdphoto/s72x72_jfs/t5872/209/5240187906/2872/8fa98cd/595c3b2aN4155b931.png"
+            onClick={() => {}}
+          />
+          <AtListItem
+            title="数字游民"
+            arrow="right"
+            // hasBorder={false}
+            thumb="http://img12.360buyimg.com/jdphoto/s72x72_jfs/t10660/330/203667368/1672/801735d7/59c85643N31e68303.png"
+            onClick={() => {}}
+          />
+        </AtList>
+      </View>
 
+      <View className="index-meetup">
+        <AtCard
+          // note="提示文字"
+          extra="2024/07/26"
+          title="线下活动"
+          thumb="http://img12.360buyimg.com/jdphoto/s72x72_jfs/t10660/330/203667368/1672/801735d7/59c85643N31e68303.png"
+        >
+          <View className="meetup-card">
+            {/* 左边 */}
+            <View className="meetup-left">
+              <Image
+                style="width: 100%;height: 100px;background: #fff;"
+                src="https://cdn.huodongxing.com/logo/202407/2764598892100/355309716945349_v2small.jpg"
+              />
+            </View>
 
+            {/* 右边 */}
+            <View className="meetup-right">
+              <View className="title">
+                xMEMS Live - Asia 2024 | 音频技术研讨会（深圳）
+              </View>
+              <View className="address">深圳市南山区</View>
+              <View className="meetBtn">
+                <View className="join">了解详情</View>
+              </View>
+            </View>
+          </View>
+        </AtCard>
       </View>
 
       {/* <View className="payBtn">

src/pages/index/index.scss

@@ -25,16 +25,61 @@
   .index-article {
     margin-top: 40px;
     // background-color: yellow;
-    font-size: 25px;
+    font-size: 30px;
     .spanText {
       font-weight: 700;
     }
   }
 
+  .index-list {
+    margin-top: 40px;
+  }
 
-  .index-card{
-    margin-top: 30px;
-    font-size: 24px;
+  .index-meetup {
+    margin-top: 40px;
+
+    .meetup-card {
+      display: flex;
+      flex-direction: row;
+      // background-color: yellow;
+
+      .meetup-left {
+        width: 50%;
+        height: 100%;
+        display: flex;
+        flex-direction: column;
+        // background-color: red;
+      }
+      .meetup-right {
+        font-size: 20px;
+        margin-left: 10px;
+        display: flex;
+        flex-direction: column;
+        // align-items: center;
+        justify-content: space-between;
+        // background-color: green;
+        flex: 1;
+        .title{
+          
+        }
+        .address{
+          // margin-top: 30px;
+        }
+        .meetBtn{
+          display: flex;
+          flex-direction: row-reverse;
+          .join{
+            width: 100px;
+            display: flex;
+            flex-direction: row;
+            align-items: center;
+            justify-content: center;
+            background-color: #1bb14e;
+          }
+         
+        }
+      }
+    }
   }
 
   .payBtn {