FEAT => 更新场景列表页面，添加分页功能并优化卡片点击事件处理，移除不必要的加载更多按钮。

nkebao/src/pages/mobile/scenarios/list/index.tsx

@@ -17,17 +17,6 @@ interface Scenario {
   status: number;
 }
 
-const scenarioDescriptions: Record<string, string> = {
-  douyin: "通过抖音平台进行精准获客",
-  xiaohongshu: "利用小红书平台进行内容营销获客",
-  gongzhonghao: "通过微信公众号进行获客",
-  haibao: "通过海报分享进行获客",
-  phone: "通过电话营销进行获客",
-  weixinqun: "通过微信群进行获客",
-  payment: "通过付款码进行获客",
-  api: "通过API接口进行获客",
-};
-
 const Scene: React.FC = () => {
   const navigate = useNavigate();
   const [scenarios, setScenarios] = useState<Scenario[]>([]);

nkebao/src/pages/mobile/scenarios/plan/list/index.module.scss

@@ -39,6 +39,47 @@
   gap: 12px;
 }
 
+.pagination-container {
+  display: flex;
+  justify-content: center;
+  padding: 14px 0;
+  background: white;
+  border-radius: 12px;
+  margin-top: 16px;
+  box-shadow: 0 2px 8px rgba(0, 0, 0, 0.1);
+
+  :global(.ant-pagination) {
+    .ant-pagination-item {
+      border-radius: 6px;
+      border: 1px solid #d9d9d9;
+
+      &:hover {
+        border-color: var(--primary-color);
+      }
+
+      &.ant-pagination-item-active {
+        background: var(--primary-color);
+        border-color: var(--primary-color);
+
+        a {
+          color: white;
+        }
+      }
+    }
+
+    .ant-pagination-prev,
+    .ant-pagination-next {
+      border-radius: 6px;
+      border: 1px solid #d9d9d9;
+
+      &:hover {
+        border-color: var(--primary-color);
+        color: var(--primary-color);
+      }
+    }
+  }
+}
+
 .plan-item {
   background: white;
   border-radius: 12px;

nkebao/src/pages/mobile/scenarios/plan/list/index.tsx

@@ -1,7 +1,6 @@
 import React, { useEffect, useState } from "react";
 import { useParams, useNavigate } from "react-router-dom";
 import {
-  NavBar,
   Button,
   Toast,
   SpinLoading,
@@ -10,7 +9,7 @@ import {
   Card,
   Tag,
 } from "antd-mobile";
-import { Input } from "antd";
+import { Input, Pagination } from "antd";
 import {
   PlusOutlined,
   CopyOutlined,
@@ -22,7 +21,6 @@ import {
   EditOutlined,
   MoreOutlined,
   ClockCircleOutlined,
-  DownOutlined,
 } from "@ant-design/icons";
 import NavCommon from "@/components/NavCommon";
 import Layout from "@/components/Layout/Layout";
@@ -157,6 +155,12 @@ const ScenarioList: React.FC = () => {
     await fetchPlanList(currentPage + 1, true);
   };
 
+  // 分页改变处理
+  const handlePageChange = async (page: number) => {
+    setCurrentPage(page);
+    await fetchPlanList(page, false);
+  };
+
   const handleCopyPlan = async (taskId: string) => {
     const taskToCopy = tasks.find(task => task.id === taskId);
     if (!taskToCopy) return;
@@ -252,6 +256,21 @@ const ScenarioList: React.FC = () => {
     }
   };
 
+  // 卡片点击处理 - 执行二维码动作
+  const handleCardClick = (taskId: string, event: React.MouseEvent) => {
+    // 检查点击是否在更多按钮区域内
+    const target = event.target as HTMLElement;
+    const moreButton = target.closest(`.${style["more-btn"]}`);
+
+    // 如果点击的是更多按钮或其子元素，不执行卡片点击动作
+    if (moreButton) {
+      return;
+    }
+
+    // 执行二维码动作
+    handleShowQrCode(taskId);
+  };
+
   const getStatusColor = (status: number) => {
     switch (status) {
       case 1:
@@ -389,6 +408,18 @@ const ScenarioList: React.FC = () => {
         </>
       }
       loading={loading}
+      footer={
+        <div className={style["pagination-container"]}>
+          <Pagination
+            total={total}
+            pageSize={pageSize}
+            current={currentPage}
+            onChange={handlePageChange}
+            showSizeChanger={false}
+            showQuickJumper={false}
+          />
+        </div>
+      }
     >
       <div className={style["scenario-list-page"]}>
         {/* 计划列表 */}
@@ -409,7 +440,11 @@ const ScenarioList: React.FC = () => {
           ) : (
             <>
               {filteredTasks.map(task => (
-                <Card key={task.id} className={style["plan-item"]}>
+                <Card
+                  key={task.id}
+                  className={style["plan-item"]}
+                  onClick={e => handleCardClick(task.id, e)}
+                >
                   {/* 头部：标题、状态和操作菜单 */}
                   <div className={style["plan-header"]}>
                     <div className={style["plan-name"]}>{task.name}</div>
@@ -421,7 +456,10 @@ const ScenarioList: React.FC = () => {
                         size="mini"
                         fill="none"
                         className={style["more-btn"]}
-                        onClick={() => setShowActionMenu(task.id)}
+                        onClick={e => {
+                          e.stopPropagation(); // 阻止事件冒泡
+                          setShowActionMenu(task.id);
+                        }}
                       >
                         <MoreOutlined />
                       </Button>
@@ -465,39 +503,6 @@ const ScenarioList: React.FC = () => {
                   </div>
                 </Card>
               ))}
-
-              {/* 加载更多按钮 */}
-              {hasMore && (
-                <div className={style["load-more-container"]}>
-                  <Button
-                    color="primary"
-                    fill="outline"
-                    size="large"
-                    onClick={handleLoadMore}
-                    loading={loadingMore}
-                    className={style["load-more-btn"]}
-                  >
-                    {loadingMore ? (
-                      <>
-                        <SpinLoading color="primary" />
-                        加载中...
-                      </>
-                    ) : (
-                      <>
-                        <DownOutlined />
-                        加载更多
-                      </>
-                    )}
-                  </Button>
-                </div>
-              )}
-
-              {/* 没有更多数据提示 */}
-              {!hasMore && filteredTasks.length > 0 && (
-                <div className={style["no-more-data"]}>
-                  <span>没有更多数据了</span>
-                </div>
-              )}
             </>
           )}
         </div>