代码提交

This commit is contained in:
柳清爽
2025-04-15 16:10:09 +08:00
parent d05cfc58ea
commit 005c68e6a8
5 changed files with 94 additions and 52 deletions

View File

@@ -94,7 +94,7 @@ class AdministratorController extends Controller
$permissionIds = []; $permissionIds = [];
if (!empty($admin['permissions'])) { if (!empty($admin['permissions'])) {
$permissions = json_decode($admin['permissions'], true); $permissions = json_decode($admin['permissions'], true);
$permissions = json_decode($permissions, true); $permissions = is_array($permissions) ? $permissions: json_decode($permissions, true);
if (isset($permissions['ids'])) { if (isset($permissions['ids'])) {
$permissionIds = is_string($permissions['ids']) ? explode(',', $permissions['ids']) : $permissions['ids']; $permissionIds = is_string($permissions['ids']) ? explode(',', $permissions['ids']) : $permissions['ids'];

View File

@@ -31,7 +31,7 @@ class TrafficPoolController extends Controller
->join('traffic_source ts', 'tp.identifier = ts.identifier', 'RIGHT') ->join('traffic_source ts', 'tp.identifier = ts.identifier', 'RIGHT')
->join('company c', 'ts.companyId = c.companyId', 'LEFT') ->join('company c', 'ts.companyId = c.companyId', 'LEFT')
->join('wechat_account wa', 'tp.wechatId = wa.wechatId', 'LEFT') ->join('wechat_account wa', 'tp.wechatId = wa.wechatId', 'LEFT')
->join('wechat_tag wt', 'wa.wechatId = wt.wechatId') ->join('wechat_tag wt', 'wa.wechatId = wt.wechatId', 'LEFT')
->field([ ->field([
'ts.id', 'ts.id',
'tp.wechatId', 'tp.wechatId',
@@ -43,8 +43,7 @@ class TrafficPoolController extends Controller
'wa.nickname', 'wa.nickname',
'wa.region', 'wa.region',
'wt.tags' 'wt.tags'
]) ]);
->order('tp.createTime DESC');
// 执行分页查询 // 执行分页查询
$list = $query->paginate([ $list = $query->paginate([
@@ -71,6 +70,8 @@ class TrafficPoolController extends Controller
// 处理标签显示 // 处理标签显示
if (is_string($item['tags'])) { if (is_string($item['tags'])) {
$item['tags'] = json_decode($item['tags'], true); $item['tags'] = json_decode($item['tags'], true);
} else {
$item['tags'] = [];
} }
return $item; return $item;
@@ -104,7 +105,7 @@ class TrafficPoolController extends Controller
try { try {
// 查询流量来源信息 // 查询流量来源信息
$sourceInfo = TrafficSource::alias('ts') $sourceInfo = TrafficSource::alias('ts')
->join('company c', 'ts.companyId = c.id', 'LEFT') ->join('company c', 'ts.companyId = c.companyId', 'LEFT')
->field([ ->field([
'ts.fromd as source', 'ts.fromd as source',
'ts.createTime as addTime', 'ts.createTime as addTime',

View File

@@ -1,5 +1,6 @@
"use client" "use client"
import { useEffect, useState } from "react"
import Link from "next/link" import Link from "next/link"
import { Button } from "@/components/ui/button" import { Button } from "@/components/ui/button"
import { Card, CardContent, CardHeader, CardTitle } from "@/components/ui/card" import { Card, CardContent, CardHeader, CardTitle } from "@/components/ui/card"
@@ -7,19 +8,10 @@ import { Tabs, TabsContent, TabsList, TabsTrigger } from "@/components/ui/tabs"
import { Badge } from "@/components/ui/badge" import { Badge } from "@/components/ui/badge"
import { Avatar, AvatarFallback, AvatarImage } from "@/components/ui/avatar" import { Avatar, AvatarFallback, AvatarImage } from "@/components/ui/avatar"
import { ArrowLeft, MessageSquare, Phone, UserPlus } from "lucide-react" import { ArrowLeft, MessageSquare, Phone, UserPlus } from "lucide-react"
import { getCustomerDetail, CustomerDetail } from "@/lib/traffic-pool-api"
// Sample customer data // 示例数据(用于详细信息部分)
const customerData = { const detailData = {
id: "1",
name: "张三",
avatar: "/placeholder.svg?height=100&width=100",
wechatId: "zhangsan123",
gender: "男",
region: "北京",
source: "微信搜索",
tags: ["潜在客户", "高消费"],
projectName: "电商平台项目",
addedDate: "2023-06-10",
devices: [ devices: [
{ id: "d1", name: "iPhone 13 Pro", addedDate: "2023-06-10" }, { id: "d1", name: "iPhone 13 Pro", addedDate: "2023-06-10" },
{ id: "d2", name: "MacBook Pro", addedDate: "2023-06-12" }, { id: "d2", name: "MacBook Pro", addedDate: "2023-06-12" },
@@ -63,6 +55,43 @@ const customerData = {
} }
export default function CustomerDetailPage({ params }: { params: { id: string } }) { export default function CustomerDetailPage({ params }: { params: { id: string } }) {
const [customer, setCustomer] = useState<CustomerDetail | null>(null)
const [isLoading, setIsLoading] = useState(true)
const [error, setError] = useState<string | null>(null)
useEffect(() => {
const fetchCustomerDetail = async () => {
try {
setIsLoading(true)
const response = await getCustomerDetail(params.id)
if (response.code === 200) {
setCustomer(response.data)
setError(null)
} else {
setError(response.msg || "获取客户详情失败")
}
} catch (err: any) {
setError(err.message || "获取客户详情失败")
} finally {
setIsLoading(false)
}
}
fetchCustomerDetail()
}, [params.id])
if (isLoading) {
return <div className="flex items-center justify-center min-h-screen">...</div>
}
if (error) {
return <div className="flex items-center justify-center min-h-screen text-red-500">{error}</div>
}
if (!customer) {
return <div className="flex items-center justify-center min-h-screen"></div>
}
return ( return (
<div className="space-y-6"> <div className="space-y-6">
<div className="flex items-center justify-between"> <div className="flex items-center justify-between">
@@ -86,15 +115,14 @@ export default function CustomerDetailPage({ params }: { params: { id: string }
</CardHeader> </CardHeader>
<CardContent className="flex flex-col items-center text-center"> <CardContent className="flex flex-col items-center text-center">
<Avatar className="h-24 w-24 mb-4"> <Avatar className="h-24 w-24 mb-4">
<AvatarImage src={customerData.avatar} alt={customerData.name} /> <AvatarImage src={customer.avatar} alt={customer.nickname} />
<AvatarFallback>{customerData.name.slice(0, 2)}</AvatarFallback> <AvatarFallback>{customer.nickname.slice(0, 2)}</AvatarFallback>
</Avatar> </Avatar>
<h3 className="text-xl font-bold">{customerData.name}</h3> <h3 className="text-xl font-bold">{customer.nickname}</h3>
<p className="text-sm text-muted-foreground mb-4">{customerData.wechatId}</p>
<div className="flex flex-wrap justify-center gap-1 mb-6"> <div className="flex flex-wrap justify-center gap-1 mb-6">
{customerData.tags.map((tag) => ( {customer.tags.map((tag, index) => (
<Badge key={tag} variant="outline"> <Badge key={index} variant="outline">
{tag} {tag}
</Badge> </Badge>
))} ))}
@@ -103,23 +131,23 @@ export default function CustomerDetailPage({ params }: { params: { id: string }
<div className="w-full space-y-2 text-left"> <div className="w-full space-y-2 text-left">
<div className="flex justify-between"> <div className="flex justify-between">
<span className="text-sm text-muted-foreground"></span> <span className="text-sm text-muted-foreground"></span>
<span className="text-sm">{customerData.gender}</span> <span className="text-sm">{customer.gender}</span>
</div> </div>
<div className="flex justify-between"> <div className="flex justify-between">
<span className="text-sm text-muted-foreground"></span> <span className="text-sm text-muted-foreground"></span>
<span className="text-sm">{customerData.region}</span> <span className="text-sm">{customer.region}</span>
</div> </div>
<div className="flex justify-between"> <div className="flex justify-between">
<span className="text-sm text-muted-foreground"></span> <span className="text-sm text-muted-foreground"></span>
<span className="text-sm">{customerData.source}</span> <span className="text-sm">{customer.source}</span>
</div> </div>
<div className="flex justify-between"> <div className="flex justify-between">
<span className="text-sm text-muted-foreground"></span> <span className="text-sm text-muted-foreground"></span>
<span className="text-sm">{customerData.projectName}</span> <span className="text-sm">{customer.projectName}</span>
</div> </div>
<div className="flex justify-between"> <div className="flex justify-between">
<span className="text-sm text-muted-foreground"></span> <span className="text-sm text-muted-foreground"></span>
<span className="text-sm">{customerData.addedDate}</span> <span className="text-sm">{customer.addTime || '暂无'}</span>
</div> </div>
</div> </div>
</CardContent> </CardContent>
@@ -138,7 +166,7 @@ export default function CustomerDetailPage({ params }: { params: { id: string }
</TabsList> </TabsList>
<TabsContent value="interactions" className="space-y-4"> <TabsContent value="interactions" className="space-y-4">
{customerData.interactions.map((interaction) => ( {detailData.interactions.map((interaction) => (
<div key={interaction.id} className="flex gap-4 pb-4 border-b last:border-0"> <div key={interaction.id} className="flex gap-4 pb-4 border-b last:border-0">
<div className="flex h-10 w-10 items-center justify-center rounded-full bg-muted"> <div className="flex h-10 w-10 items-center justify-center rounded-full bg-muted">
{interaction.type === "消息" ? ( {interaction.type === "消息" ? (
@@ -162,7 +190,7 @@ export default function CustomerDetailPage({ params }: { params: { id: string }
</TabsContent> </TabsContent>
<TabsContent value="devices"> <TabsContent value="devices">
{customerData.devices.map((device) => ( {detailData.devices.map((device) => (
<div key={device.id} className="flex items-center justify-between py-2 border-b last:border-0"> <div key={device.id} className="flex items-center justify-between py-2 border-b last:border-0">
<div> <div>
<p className="font-medium">{device.name}</p> <p className="font-medium">{device.name}</p>
@@ -173,8 +201,8 @@ export default function CustomerDetailPage({ params }: { params: { id: string }
</TabsContent> </TabsContent>
<TabsContent value="transactions"> <TabsContent value="transactions">
{customerData.transactions.length > 0 ? ( {detailData.transactions.length > 0 ? (
customerData.transactions.map((transaction) => ( detailData.transactions.map((transaction) => (
<div key={transaction.id} className="flex items-center justify-between py-2 border-b last:border-0"> <div key={transaction.id} className="flex items-center justify-between py-2 border-b last:border-0">
<div> <div>
<p className="font-medium">{transaction.product}</p> <p className="font-medium">{transaction.product}</p>

View File

@@ -294,9 +294,9 @@ export default function CustomersPage() {
<Table> <Table>
<TableHeader> <TableHeader>
<TableRow> <TableRow>
<TableHead></TableHead> <TableHead></TableHead>
<TableHead>ID</TableHead> <TableHead>ID</TableHead>
<TableHead></TableHead> <TableHead></TableHead>
<TableHead></TableHead> <TableHead></TableHead>
<TableHead></TableHead> <TableHead></TableHead>
<TableHead></TableHead> <TableHead></TableHead>
@@ -325,31 +325,23 @@ export default function CustomersPage() {
<Avatar> <Avatar>
<AvatarImage <AvatarImage
src={customer.avatar || "/placeholder.svg?height=40&width=40"} src={customer.avatar || "/placeholder.svg?height=40&width=40"}
alt={customer.nickname} alt={customer.nickname || "未知"}
onError={(e) => { onError={(e) => {
// 图片加载失败时使用默认图片 // 图片加载失败时使用默认图片
const target = e.target as HTMLImageElement; const target = e.target as HTMLImageElement;
target.src = "/placeholder.svg?height=40&width=40"; target.src = "/placeholder.svg?height=40&width=40";
}} }}
/> />
<AvatarFallback>{customer.nickname.slice(0, 2)}</AvatarFallback> <AvatarFallback>{(customer.nickname || "未知").slice(0, 2)}</AvatarFallback>
</Avatar> </Avatar>
<div> <div>
<div className="font-medium">{customer.nickname}</div> <div className="font-medium">{customer.nickname || "未知"}</div>
<div className="text-xs text-muted-foreground">{customer.gender}</div> <div className="text-xs text-muted-foreground">{customer.gender}</div>
</div> </div>
</div> </div>
</TableCell> </TableCell>
<TableCell>{customer.wechatId}</TableCell> <TableCell>{customer.wechatId}</TableCell>
<TableCell> <TableCell>{customer.gender}</TableCell>
<div className="flex flex-wrap gap-1">
{customer.tags.map((tag, index) => (
<Badge key={index} variant="outline">
{tag}
</Badge>
))}
</div>
</TableCell>
<TableCell>{customer.region}</TableCell> <TableCell>{customer.region}</TableCell>
<TableCell>{customer.source}</TableCell> <TableCell>{customer.source}</TableCell>
<TableCell>{customer.projectName}</TableCell> <TableCell>{customer.projectName}</TableCell>

View File

@@ -12,11 +12,25 @@ export interface Customer {
region: string; region: string;
tags: string[]; tags: string[];
source: string; source: string;
projectName: string; companyName: string;
addTime: string; createTime: string;
mobile: number; mobile: number;
} }
/**
* 客户详情接口
*/
export interface CustomerDetail {
source: string;
addTime: string | null;
projectName: string;
avatar: string;
nickname: string;
region: string;
gender: string;
tags: string[];
}
/** /**
* 分页响应数据类型 * 分页响应数据类型
*/ */
@@ -49,3 +63,10 @@ export async function getTrafficPoolList(
return apiRequest(`/trafficPool/list?${params.toString()}`); return apiRequest(`/trafficPool/list?${params.toString()}`);
} }
/**
* 获取客户详情
*/
export async function getCustomerDetail(id: string): Promise<ApiResponse<CustomerDetail>> {
return apiRequest(`/trafficPool/detail?id=${id}`);
}