diff --git a/nkebao/src/pages/mobile/scenarios/list/index.tsx b/nkebao/src/pages/mobile/scenarios/list/index.tsx index 9df19b24..ce66979f 100644 --- a/nkebao/src/pages/mobile/scenarios/list/index.tsx +++ b/nkebao/src/pages/mobile/scenarios/list/index.tsx @@ -17,17 +17,6 @@ interface Scenario { status: number; } -const scenarioDescriptions: Record = { - douyin: "通过抖音平台进行精准获客", - xiaohongshu: "利用小红书平台进行内容营销获客", - gongzhonghao: "通过微信公众号进行获客", - haibao: "通过海报分享进行获客", - phone: "通过电话营销进行获客", - weixinqun: "通过微信群进行获客", - payment: "通过付款码进行获客", - api: "通过API接口进行获客", -}; - const Scene: React.FC = () => { const navigate = useNavigate(); const [scenarios, setScenarios] = useState([]); diff --git a/nkebao/src/pages/mobile/scenarios/plan/list/index.module.scss b/nkebao/src/pages/mobile/scenarios/plan/list/index.module.scss index ee58c81c..6b4ca580 100644 --- a/nkebao/src/pages/mobile/scenarios/plan/list/index.module.scss +++ b/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; diff --git a/nkebao/src/pages/mobile/scenarios/plan/list/index.tsx b/nkebao/src/pages/mobile/scenarios/plan/list/index.tsx index f1bd371c..cac548d8 100644 --- a/nkebao/src/pages/mobile/scenarios/plan/list/index.tsx +++ b/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={ +
+ +
+ } >
{/* 计划列表 */} @@ -409,7 +440,11 @@ const ScenarioList: React.FC = () => { ) : ( <> {filteredTasks.map(task => ( - + handleCardClick(task.id, e)} + > {/* 头部:标题、状态和操作菜单 */}
{task.name}
@@ -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); + }} > @@ -465,39 +503,6 @@ const ScenarioList: React.FC = () => {
))} - - {/* 加载更多按钮 */} - {hasMore && ( -
- -
- )} - - {/* 没有更多数据提示 */} - {!hasMore && filteredTasks.length > 0 && ( -
- 没有更多数据了 -
- )} )}