diff --git a/Touchkebao/src/pages/pc/ckbox/powerCenter/customer-management/index.tsx b/Touchkebao/src/pages/pc/ckbox/powerCenter/customer-management/index.tsx index 475d9cdb..733332b3 100644 --- a/Touchkebao/src/pages/pc/ckbox/powerCenter/customer-management/index.tsx +++ b/Touchkebao/src/pages/pc/ckbox/powerCenter/customer-management/index.tsx @@ -1,7 +1,6 @@ -import React, { useState } from "react"; +import React, { useState, useMemo } from "react"; import PowerNavigation from "@/components/PowerNavtion"; import { - StarOutlined, SearchOutlined, FilterOutlined, MessageOutlined, @@ -9,24 +8,9 @@ import { } from "@ant-design/icons"; import styles from "./index.module.scss"; import { Button, Input, Row, Col } from "antd"; - -// 联系人数据类型 -interface Contact { - id: string; - name: string; - avatar?: string; - role: string; - company: string; - phone: string; - email?: string; - location: string; - tags: string[]; - source: string; - lastContact: string; - notes?: string; - isStarred?: boolean; - category: "customer" | "potential" | "partner" | "friend"; -} +import { useCkChatStore } from "@/store/module/ckchat/ckchat"; +import { ContractData } from "@/pages/pc/ckbox/data"; +// 直接使用 ContractData 类型 // 头像组件 const Avatar: React.FC<{ name: string; avatar?: string; size?: number }> = ({ @@ -83,68 +67,46 @@ const CustomerManagement: React.FC = () => { const [activeTab, setActiveTab] = useState("customer"); const [searchValue, setSearchValue] = useState(""); - // 模拟数据 - const contacts: Contact[] = [ - { - id: "1", - name: "李先生", - avatar: "https://api.dicebear.com/7.x/avataaars/svg?seed=li", - role: "技术总监", - company: "某科技公司", - phone: "138****8888", - email: "li@company.com", - location: "北京", - tags: ["客户", "重要客户", "AI产品", "意向客户"], - source: "朋友推荐", - lastContact: "2024/3/5", - notes: "对AI产品很感兴趣,预算充足", - isStarred: true, - category: "customer", - }, - { - id: "2", - name: "张总", - role: "CEO", - company: "大型企业集团", - phone: "139****9999", - email: "zhang@enterprise.com", - location: "上海", - tags: ["潜在客户", "决策者", "大客户"], - source: "展会获客", - lastContact: "2024/3/4", - notes: "需要详细的ROI分析报告", - category: "potential", - }, - { - id: "3", - name: "王女士", - avatar: "https://api.dicebear.com/7.x/avataaars/svg?seed=wang", - role: "市场经理", - company: "中型贸易公司", - phone: "137****7777", - location: "深圳", - tags: ["客户", "中小企业", "价格敏感"], - source: "网络广告", - lastContact: "2024/3/3", - category: "customer", - }, - ]; + // 获取联系人数据 + const getContractList = useCkChatStore(state => state.getContractList); + const contacts: ContractData[] = getContractList(); + console.log(contacts, "contacts"); + + // 动态计算各分类的联系人数量 + const tabCounts = useMemo(() => { + return { + customer: contacts.filter(c => c.isPassed).length, + potential: contacts.filter(c => !c.isPassed).length, + partner: 0, // 可以根据业务逻辑调整 + friend: 0, // 可以根据业务逻辑调整 + }; + }, [contacts]); const tabs = [ - { key: "customer", label: "客户", count: 2 }, - { key: "potential", label: "潜在客户", count: 1 }, - { key: "partner", label: "合作伙伴", count: 0 }, - { key: "friend", label: "朋友", count: 0 }, + { key: "customer", label: "客户", count: tabCounts.customer }, + { key: "potential", label: "潜在客户", count: tabCounts.potential }, + { key: "partner", label: "合作伙伴", count: tabCounts.partner }, + { key: "friend", label: "朋友", count: tabCounts.friend }, ]; - const filteredContacts = contacts.filter( - contact => - contact.category === activeTab && - (searchValue === "" || - contact.name.includes(searchValue) || - contact.company.includes(searchValue) || - contact.tags.some(tag => tag.includes(searchValue))), - ); + // const filteredContacts = contacts.filter(contact => { + // const isCategoryMatch = + // (activeTab === "customer" && contact.isPassed) || + // (activeTab === "potential" && !contact.isPassed) || + // activeTab === "partner" || + // activeTab === "friend"; + + // const isSearchMatch = + // searchValue === "" || + // contact.nickname?.includes(searchValue) || + // contact.conRemark?.includes(searchValue) || + // contact.alias?.includes(searchValue) || + // contact.desc?.includes(searchValue) || + // contact.labels?.some(tag => tag.includes(searchValue)); + + // return isCategoryMatch && isSearchMatch; + // }); + const filteredContacts = contacts; return (
- {contact.role} {"·"} {contact.company} + {filteredContacts.length === 0 ? ( +
暂无联系人数据
++ 客户 {"·"} {contact.desc || "未设置公司"} +
++ 电话:{" "} + {contact.phone || "未设置电话"} +
++ 地区:{" "} + {contact.region || contact.city || "未设置地区"} +
++ 微信ID:{" "} + {contact.wechatId}
- 电话:{" "} - {contact.phone} -
- {contact.email && ( -- 邮箱:{" "} - {contact.email} -
- )} -- 地区:{" "} - {contact.location} -
+