diff --git a/nkebao/src/pages/mobile/mine/traffic-pool/detail/data.ts b/nkebao/src/pages/mobile/mine/traffic-pool/detail/data.ts index f1c30d00..3e9cfa57 100644 --- a/nkebao/src/pages/mobile/mine/traffic-pool/detail/data.ts +++ b/nkebao/src/pages/mobile/mine/traffic-pool/detail/data.ts @@ -1,32 +1,46 @@ // 用户详情类型 export interface TrafficPoolUserDetail { - id: number; - nickname: string; - avatar: string; - wechatId: string; - status: number | string; - addTime: string; - lastInteraction: string; - deviceName?: string; - wechatAccountName?: string; - customerServiceName?: string; - poolNames?: string[]; - rfmScore?: { - recency: number; - frequency: number; - monetary: number; - segment?: string; + userInfo: { + wechatId: string; + weight: number | null; + activity: { + totalMsgCount: number; + sevenDayMsgCount: number; + thirtyDayMsgCount: number; + yesterdayMsgCount: number; + }; + friendShip: { + maleFriend: number; + groupNumber: number; + totalFriend: number; + femaleFriend: number; + unknowFriend: number; + }; + nickname: string; + alias: string; + avatar: string; + gender: number; // 0-未知, 1-男, 2-女 }; - totalSpent?: number; - interactionCount?: number; - conversionRate?: number; - tags?: string[]; - packages?: string[]; - interactions?: Array<{ - id: string; - type: string; - content: string; - timestamp: string; - value?: number; + accountAge: string; + activityLevel: { + allTimes: number; + dayTimes: number; + }; + accountWeight: { + ageWeight: number; + activityWeigth: number; + restrictWeight: number; + realNameWeight: number; + scope: number; + }; + statistics: { + todayAdded: number; + addLimit: number; + }; + restrictions: Array<{ + id: number; + date: number | null; + level: number; // 1-轻微, 2-中等, 3-严重 + reason: string; }>; } diff --git a/nkebao/src/pages/mobile/mine/traffic-pool/detail/index.module.scss b/nkebao/src/pages/mobile/mine/traffic-pool/detail/index.module.scss index aff534bb..a3833543 100644 --- a/nkebao/src/pages/mobile/mine/traffic-pool/detail/index.module.scss +++ b/nkebao/src/pages/mobile/mine/traffic-pool/detail/index.module.scss @@ -41,6 +41,13 @@ .wechatId { font-size: 14px; color: #1677ff; + margin-bottom: 4px; + line-height: 1.2; +} + +.alias { + font-size: 12px; + color: #666; margin-bottom: 8px; line-height: 1.2; } @@ -51,7 +58,13 @@ gap: 6px; } -.packageTag { +.genderTag { + font-size: 12px; + padding: 2px 8px; + border-radius: 12px; +} + +.weightTag { font-size: 12px; padding: 2px 8px; border-radius: 12px; @@ -113,30 +126,6 @@ } } -.rfmGrid { - display: grid; - grid-template-columns: repeat(3, 1fr); - gap: 16px; - padding: 16px; -} - -.rfmItem { - text-align: center; -} - -.rfmValue { - font-size: 20px; - font-weight: 700; - line-height: 1.2; - margin-bottom: 4px; -} - -.rfmLabel { - font-size: 12px; - color: #666; - line-height: 1.2; -} - .statsGrid { display: grid; grid-template-columns: repeat(2, 1fr); @@ -161,43 +150,32 @@ line-height: 1.2; } -.interactionContent { +.restrictionTitle { display: flex; align-items: center; + justify-content: space-between; gap: 8px; - font-size: 13px; - color: #666; + font-size: 14px; + font-weight: 500; + color: #333; line-height: 1.4; } -.purchaseValue { - color: #22c55e; - font-weight: 600; -} - -.tagsContainer { - display: flex; - flex-wrap: wrap; - gap: 8px; - margin-bottom: 16px; - padding: 16px; -} - -.userTag { - font-size: 12px; - padding: 4px 12px; - border-radius: 16px; -} - -.addTagButton { - margin: 0 16px 16px; - height: 40px; +.restrictionLevel { + font-size: 10px; + padding: 2px 6px; border-radius: 8px; - font-size: 14px; - - :global(.antd-mobile-icon) { - margin-right: 4px; - } + flex-shrink: 0; +} + +.restrictionContent { + display: flex; + flex-direction: column; + gap: 4px; + font-size: 12px; + color: #666; + line-height: 1.4; + margin-top: 4px; } .emptyState { @@ -239,19 +217,14 @@ font-size: 13px; } + .alias { + font-size: 11px; + } + .tabContent { padding: 12px; } - .rfmGrid { - gap: 12px; - padding: 12px; - } - - .rfmValue { - font-size: 18px; - } - .statsGrid { gap: 12px; padding: 12px; @@ -261,14 +234,12 @@ font-size: 16px; } - .tagsContainer { - padding: 12px; + .restrictionTitle { + font-size: 13px; } - .addTagButton { - margin: 0 12px 12px; - height: 36px; - font-size: 13px; + .restrictionContent { + font-size: 11px; } } @@ -293,16 +264,27 @@ color: #4a9eff; } + .alias { + color: #999; + } + .infoCard :global(.adm-card-header) { color: #fff; border-bottom-color: #3a3a3a; } - .rfmLabel, .statLabel { color: #999; } + .restrictionTitle { + color: #fff; + } + + .restrictionContent { + color: #999; + } + .emptyText { color: #666; } diff --git a/nkebao/src/pages/mobile/mine/traffic-pool/detail/index.tsx b/nkebao/src/pages/mobile/mine/traffic-pool/detail/index.tsx index 25bd986d..48cbe7a1 100644 --- a/nkebao/src/pages/mobile/mine/traffic-pool/detail/index.tsx +++ b/nkebao/src/pages/mobile/mine/traffic-pool/detail/index.tsx @@ -4,8 +4,9 @@ import { Card, Button, Avatar, Tag, Tabs, List, Badge } from "antd-mobile"; import { UserOutlined, MessageOutlined, - ShoppingOutlined, - EyeOutlined, + TeamOutlined, + ClockCircleOutlined, + ExclamationCircleOutlined, PlusOutlined, } from "@ant-design/icons"; import Layout from "@/components/Layout/Layout"; @@ -28,46 +29,72 @@ const TrafficPoolDetail: React.FC = () => { .finally(() => setLoading(false)); }, [id]); - const getInteractionIcon = (type: string) => { - switch (type) { - case "click": - return ; - case "message": - return ; - case "purchase": - return ; - case "view": - return ; + const getGenderText = (gender: number) => { + switch (gender) { + case 1: + return "男"; + case 2: + return "女"; default: - return ; + return "未知"; } }; - const getInteractionTitle = (type: string) => { - switch (type) { - case "click": - return "点击行为"; - case "message": - return "消息互动"; - case "purchase": - return "购买行为"; - case "view": - return "页面浏览"; + const getGenderColor = (gender: number) => { + switch (gender) { + case 1: + return "#1677ff"; + case 2: + return "#eb2f96"; default: - return "未知行为"; + return "#999"; } }; - const getStatusText = (status: string | number) => { - if (status === "failed" || status === 0) return "添加失败"; - if (status === "added" || status === 1) return "添加成功"; - return "未添加"; + const getRestrictionLevelText = (level: number) => { + switch (level) { + case 1: + return "轻微"; + case 2: + return "中等"; + case 3: + return "严重"; + default: + return "未知"; + } }; - const getStatusColor = (status: string | number) => { - if (status === "failed" || status === 0) return "danger"; - if (status === "added" || status === 1) return "success"; - return "default"; + const getRestrictionLevelColor = (level: number) => { + switch (level) { + case 1: + return "warning"; + case 2: + return "danger"; + case 3: + return "danger"; + default: + return "default"; + } + }; + + const formatDate = (timestamp: number | null) => { + if (!timestamp) return "--"; + try { + const date = new Date(timestamp * 1000); + return date.toLocaleDateString("zh-CN"); + } catch (error) { + return "--"; + } + }; + + const formatAccountAge = (dateString: string) => { + if (!dateString) return "--"; + try { + const date = new Date(dateString); + return date.toLocaleDateString("zh-CN"); + } catch (error) { + return dateString; + } }; if (!user) { @@ -87,24 +114,32 @@ const TrafficPoolDetail: React.FC = () => {
} />
-
{user.nickname}
-
{user.wechatId}
+
{user.userInfo.nickname}
+
{user.userInfo.wechatId}
+
别名:{user.userInfo.alias}
- {user.packages?.map((pkg) => ( + + {getGenderText(user.userInfo.gender)} + + {user.userInfo.weight && ( - {pkg} + 权重: {user.userInfo.weight} - ))} + )}
@@ -114,166 +149,224 @@ const TrafficPoolDetail: React.FC = () => {
- {/* 关键信息 */} - + {/* 账户信息 */} + - 设备 - - 微信号 + + 注册时间 - - 客服 + + 今日添加 - 添加时间 - - 最近互动 + + 总消息数 + + + 今日消息 - {/* RFM评分 */} - -
-
+ {/* 好友统计 */} + +
+
- {user.rfmScore?.recency ?? "-"} + {user.userInfo.friendShip.totalFriend}
-
最近性(R)
+
总好友
-
+
- {user.rfmScore?.frequency ?? "-"} + {user.userInfo.friendShip.maleFriend}
-
频率(F)
+
男性好友
-
+
- {user.rfmScore?.monetary ?? "-"} + {user.userInfo.friendShip.femaleFriend}
-
金额(M)
+
女性好友
+
+
+
+ {user.userInfo.friendShip.unknowFriend} +
+
未知性别
+
+
+
+ {user.userInfo.friendShip.groupNumber} +
+
群聊数量
- {/* 统计数据 */} - + {/* 活跃度统计 */} +
- ¥{user.totalSpent ?? "-"} + {user.userInfo.activity.totalMsgCount}
-
总消费
-
-
-
- {user.interactionCount ?? "-"} -
-
互动次数
+
总消息数
- {user.conversionRate ?? "-"} + {user.userInfo.activity.sevenDayMsgCount}
-
转化率
+
7天消息
- {getStatusText(user.status)} + {user.userInfo.activity.thirtyDayMsgCount}
-
添加状态
+
30天消息
+
+
+
+ {user.userInfo.activity.yesterdayMsgCount} +
+
昨日消息
+
+
+
+ + {/* 账户权重 */} + +
+
+
+ {user.accountWeight.ageWeight} +
+
年龄权重
+
+
+
+ {user.accountWeight.activityWeigth} +
+
活跃权重
+
+
+
+ {user.accountWeight.restrictWeight} +
+
限制权重
+
+
+
+ {user.accountWeight.realNameWeight} +
+
实名权重
+
+
+
+ {user.accountWeight.scope} +
+
综合评分
- +
- - {user.interactions && user.interactions.length > 0 ? ( + + {user.restrictions && user.restrictions.length > 0 ? ( - {user.interactions.slice(0, 4).map((interaction) => ( + {user.restrictions.map((restriction) => ( - {interaction.content} - {interaction.type === "purchase" && - interaction.value && ( - - ¥{interaction.value} - + key={restriction.id} + prefix={ + + } + title={ +
+ {restriction.reason || "未知原因"} + + {getRestrictionLevelText(restriction.level)} + +
+ } + description={ +
+ 限制ID: {restriction.id} + {restriction.date && ( + + 限制时间: {formatDate(restriction.date)} + + )}
} - extra={interaction.timestamp} /> ))}
) : (
-
暂无互动记录
+
暂无限制记录
)}
- +
- -
- {user.tags && user.tags.length > 0 ? ( - user.tags.map((tag) => ( - - {tag} - - )) - ) : ( -
暂无标签
- )} + +
+
暂无操作记录
-