优化
This commit is contained in:
menxipeng
@@ -78,6 +78,14 @@ export default function WorkersPage() {
|
|||||||
// 工单选择相关状态
|
// 工单选择相关状态
|
||||||
const [workOrders, setWorkOrders] = useState<any[]>([])
|
const [workOrders, setWorkOrders] = useState<any[]>([])
|
||||||
const [selectedWorkOrder, setSelectedWorkOrder] = useState("all")
|
const [selectedWorkOrder, setSelectedWorkOrder] = useState("all")
|
||||||
|
// 每个工人的工单分页状态
|
||||||
|
const [workerOrdersPagination, setWorkerOrdersPagination] = useState<{
|
||||||
|
[workerId: string]: {
|
||||||
|
currentPage: number
|
||||||
|
pageSize: number
|
||||||
|
total: number
|
||||||
|
}
|
||||||
|
}>({})
|
||||||
|
|
||||||
// 获取工人工单列表
|
// 获取工人工单列表
|
||||||
const fetchWorkOrdersList = async (workersId?: string) => {
|
const fetchWorkOrdersList = async (workersId?: string) => {
|
||||||
@@ -108,6 +116,23 @@ export default function WorkersPage() {
|
|||||||
}
|
}
|
||||||
}
|
}
|
||||||
|
|
||||||
|
// 获取工人完成工单数量
|
||||||
|
const fetchCompletedOrdersCount = async (workersId: string) => {
|
||||||
|
try {
|
||||||
|
const result = await apiGet<any>(`/back/orders/list?pageNum=1&pageSize=999&workersId=${workersId}&status=7`)
|
||||||
|
|
||||||
|
if (result && result.code === 200) {
|
||||||
|
const count = parseInt(result.total) || 0
|
||||||
|
console.log(`工人 ${workersId} 完成工单数量:`, count)
|
||||||
|
return count
|
||||||
|
}
|
||||||
|
return 0
|
||||||
|
} catch (error) {
|
||||||
|
console.error(`获取工人 ${workersId} 完成工单数量失败:`, error)
|
||||||
|
return 0
|
||||||
|
}
|
||||||
|
}
|
||||||
|
|
||||||
// 获取工人列表
|
// 获取工人列表
|
||||||
const fetchWorkersList = async (pageNum = currentPage, pageSizeParam = pageSize) => {
|
const fetchWorkersList = async (pageNum = currentPage, pageSizeParam = pageSize) => {
|
||||||
try {
|
try {
|
||||||
@@ -117,24 +142,33 @@ export default function WorkersPage() {
|
|||||||
console.log('工人列表API返回结果:', result)
|
console.log('工人列表API返回结果:', result)
|
||||||
|
|
||||||
if (result && result.code === 200 && result.rows) {
|
if (result && result.code === 200 && result.rows) {
|
||||||
const processedWorkers = result.rows.map((worker: any) => ({
|
console.log('开始获取工人完成工单数量...')
|
||||||
id: worker.id,
|
const processedWorkers = await Promise.all(result.rows.map(async (worker: any) => {
|
||||||
name: worker.name,
|
// 获取该工人的完成工单数量
|
||||||
workerId: worker.jobNum || worker.workersId || `W${worker.id}`,
|
const workersIdForQuery = worker.workersId || worker.jobNum || worker.id
|
||||||
phone: worker.phone,
|
console.log(`正在获取工人 ${worker.name}(${workersIdForQuery}) 的完成工单数量`)
|
||||||
dealerId: worker.distributorUserId,
|
const completedCount = await fetchCompletedOrdersCount(workersIdForQuery)
|
||||||
dealerName: worker.distributorUser || '未知经销商',
|
|
||||||
province: worker.province,
|
return {
|
||||||
skillLevel: mapAPISkillLevelToDisplay(worker.skillLevel),
|
id: worker.id,
|
||||||
joinDate: worker.createdAt,
|
name: worker.name,
|
||||||
status: mapJobStatusToDisplay(worker.job),
|
workerId: worker.jobNum || worker.workersId || `W${worker.id}`,
|
||||||
completedOrders: 0,
|
phone: worker.phone,
|
||||||
rating: 0,
|
dealerId: worker.distributorUserId,
|
||||||
specialties: worker.professionalSkills ? worker.professionalSkills.split(',').map((s: string) => s.trim()) : [],
|
dealerName: worker.distributorUser || '未知经销商',
|
||||||
workOrders: [],
|
province: worker.province,
|
||||||
apiData: worker
|
skillLevel: mapAPISkillLevelToDisplay(worker.skillLevel),
|
||||||
|
joinDate: worker.createdAt,
|
||||||
|
status: mapJobStatusToDisplay(worker.job),
|
||||||
|
completedOrders: completedCount,
|
||||||
|
rating: 0,
|
||||||
|
specialties: worker.professionalSkills ? worker.professionalSkills.split(',').map((s: string) => s.trim()) : [],
|
||||||
|
workOrders: [],
|
||||||
|
apiData: worker
|
||||||
|
}
|
||||||
}))
|
}))
|
||||||
|
|
||||||
|
console.log('工人列表及完成工单数量处理完成:', processedWorkers)
|
||||||
setWorkers(processedWorkers)
|
setWorkers(processedWorkers)
|
||||||
setTotal(parseInt(result.total) || 0)
|
setTotal(parseInt(result.total) || 0)
|
||||||
} else {
|
} else {
|
||||||
@@ -442,6 +476,60 @@ export default function WorkersPage() {
|
|||||||
}
|
}
|
||||||
}
|
}
|
||||||
|
|
||||||
|
// 获取指定工人的工单列表（支持分页）
|
||||||
|
const fetchWorkerOrders = async (workerId: string, pageNum: number = 1, pageSizeParam: number = 10) => {
|
||||||
|
const currentWorker = workers.find(w => w.id === workerId)
|
||||||
|
if (!currentWorker || !currentWorker.apiData) return
|
||||||
|
|
||||||
|
try {
|
||||||
|
console.log(`获取工人 ${workerId} 的工单数据，页码: ${pageNum}, 每页: ${pageSizeParam}`)
|
||||||
|
|
||||||
|
const workersIdParam = currentWorker.apiData.workersId || currentWorker.apiData.jobNum || workerId
|
||||||
|
const result = await apiGet<any>(`/back/orders/list?pageNum=${pageNum}&pageSize=${pageSizeParam}&workersId=${workersIdParam}`)
|
||||||
|
|
||||||
|
if (result && result.code === 200 && result.rows) {
|
||||||
|
const processedWorkOrders = result.rows.map((order: any) => ({
|
||||||
|
id: order.workOrderNumber,
|
||||||
|
type: order.workOrderType,
|
||||||
|
merchant: order.merchantName,
|
||||||
|
mall: order.merchantLocation || order.merchantAddress || '地址未知',
|
||||||
|
equipment: order.equipmentName,
|
||||||
|
status: mapWorkOrderStatus(order.status),
|
||||||
|
completedDate: order.completedDate,
|
||||||
|
updatedAt: order.updatedAt,
|
||||||
|
startDate: order.scheduledDate || order.createdDate,
|
||||||
|
assignedDate: order.createdDate,
|
||||||
|
rating: null,
|
||||||
|
priority: order.priority,
|
||||||
|
responsiblePerson: order.responsiblePerson,
|
||||||
|
responsiblePhone: order.responsibleVirtualPhone,
|
||||||
|
workerPhone: order.workerVirtualPhone,
|
||||||
|
originalData: order
|
||||||
|
}))
|
||||||
|
|
||||||
|
setWorkers(prev => prev.map(worker =>
|
||||||
|
worker.id === workerId
|
||||||
|
? { ...worker, workOrders: processedWorkOrders }
|
||||||
|
: worker
|
||||||
|
))
|
||||||
|
|
||||||
|
// 更新该工人的工单分页状态
|
||||||
|
setWorkerOrdersPagination(prev => ({
|
||||||
|
...prev,
|
||||||
|
[workerId]: {
|
||||||
|
currentPage: pageNum,
|
||||||
|
pageSize: pageSizeParam,
|
||||||
|
total: parseInt(result.total) || 0
|
||||||
|
}
|
||||||
|
}))
|
||||||
|
} else {
|
||||||
|
console.error('获取工单数据失败:', result?.msg || '未知错误')
|
||||||
|
}
|
||||||
|
} catch (error) {
|
||||||
|
console.error('请求工单数据失败:', error)
|
||||||
|
}
|
||||||
|
}
|
||||||
|
|
||||||
const toggleWorkerExpansion = async (workerId: string) => {
|
const toggleWorkerExpansion = async (workerId: string) => {
|
||||||
const isCurrentlyExpanded = expandedWorkers.includes(workerId)
|
const isCurrentlyExpanded = expandedWorkers.includes(workerId)
|
||||||
|
|
||||||
@@ -449,47 +537,8 @@ export default function WorkersPage() {
|
|||||||
setExpandedWorkers((prev) => prev.filter((id) => id !== workerId))
|
setExpandedWorkers((prev) => prev.filter((id) => id !== workerId))
|
||||||
} else {
|
} else {
|
||||||
setExpandedWorkers((prev) => [...prev, workerId])
|
setExpandedWorkers((prev) => [...prev, workerId])
|
||||||
|
// 初始化分页并获取第一页数据
|
||||||
const currentWorker = workers.find(w => w.id === workerId)
|
await fetchWorkerOrders(workerId, 1, 10)
|
||||||
if (currentWorker && currentWorker.apiData) {
|
|
||||||
try {
|
|
||||||
console.log(`获取工人 ${workerId} 的工单数据`)
|
|
||||||
|
|
||||||
const workersIdParam = currentWorker.apiData.workersId || currentWorker.apiData.jobNum || workerId
|
|
||||||
const result = await apiGet<any>(`/back/orders/list?pageNum=1&pageSize=10&workersId=${workersIdParam}`)
|
|
||||||
|
|
||||||
if (result && result.code === 200 && result.rows) {
|
|
||||||
const processedWorkOrders = result.rows.map((order: any) => ({
|
|
||||||
id: order.workOrderNumber,
|
|
||||||
type: order.workOrderType,
|
|
||||||
merchant: order.merchantName,
|
|
||||||
mall: order.merchantLocation || order.merchantAddress || '地址未知',
|
|
||||||
equipment: order.equipmentName,
|
|
||||||
status: mapWorkOrderStatus(order.status),
|
|
||||||
completedDate: order.completedDate,
|
|
||||||
updatedAt: order.updatedAt,
|
|
||||||
startDate: order.scheduledDate || order.createdDate,
|
|
||||||
assignedDate: order.createdDate,
|
|
||||||
rating: null,
|
|
||||||
priority: order.priority,
|
|
||||||
responsiblePerson: order.responsiblePerson,
|
|
||||||
responsiblePhone: order.responsibleVirtualPhone,
|
|
||||||
workerPhone: order.workerVirtualPhone,
|
|
||||||
originalData: order
|
|
||||||
}))
|
|
||||||
|
|
||||||
setWorkers(prev => prev.map(worker =>
|
|
||||||
worker.id === workerId
|
|
||||||
? { ...worker, workOrders: processedWorkOrders }
|
|
||||||
: worker
|
|
||||||
))
|
|
||||||
} else {
|
|
||||||
console.error('获取工单数据失败:', result?.msg || '未知错误')
|
|
||||||
}
|
|
||||||
} catch (error) {
|
|
||||||
console.error('请求工单数据失败:', error)
|
|
||||||
}
|
|
||||||
}
|
|
||||||
}
|
}
|
||||||
}
|
}
|
||||||
|
|
||||||
@@ -929,48 +978,135 @@ export default function WorkersPage() {
|
|||||||
|
|
||||||
<h4 className="font-medium mb-3">工作记录</h4>
|
<h4 className="font-medium mb-3">工作记录</h4>
|
||||||
{worker.workOrders.length > 0 ? (
|
{worker.workOrders.length > 0 ? (
|
||||||
<Table>
|
<>
|
||||||
<TableHeader>
|
<Table>
|
||||||
<TableRow>
|
<TableHeader>
|
||||||
<TableHead>工单编号</TableHead>
|
<TableRow>
|
||||||
<TableHead>工单类型</TableHead>
|
<TableHead>工单编号</TableHead>
|
||||||
<TableHead>商户信息</TableHead>
|
<TableHead>工单类型</TableHead>
|
||||||
<TableHead>设备</TableHead>
|
<TableHead>商户信息</TableHead>
|
||||||
<TableHead>状态</TableHead>
|
<TableHead>设备</TableHead>
|
||||||
<TableHead>完成时间</TableHead>
|
<TableHead>状态</TableHead>
|
||||||
</TableRow>
|
<TableHead>完成时间</TableHead>
|
||||||
</TableHeader>
|
|
||||||
<TableBody>
|
|
||||||
{worker.workOrders.map((order: any) => (
|
|
||||||
<TableRow key={order.id}>
|
|
||||||
<TableCell className="font-medium text-blue-600">{order.id}</TableCell>
|
|
||||||
<TableCell>
|
|
||||||
<Badge variant="outline">{order.type}</Badge>
|
|
||||||
</TableCell>
|
|
||||||
<TableCell>
|
|
||||||
<div>
|
|
||||||
<p className="font-medium">{order.merchant}</p>
|
|
||||||
<p className="text-sm text-gray-500">{order.mall}</p>
|
|
||||||
</div>
|
|
||||||
</TableCell>
|
|
||||||
<TableCell>
|
|
||||||
<div className="flex items-center">
|
|
||||||
<Wrench className="h-4 w-4 mr-2 text-gray-400" />
|
|
||||||
{order.equipment}
|
|
||||||
</div>
|
|
||||||
</TableCell>
|
|
||||||
<TableCell>{getWorkOrderStatusBadge(order.status)}</TableCell>
|
|
||||||
<TableCell>
|
|
||||||
{order.status === "completed" && order.updatedAt ? (
|
|
||||||
<span className="text-sm">{order.updatedAt}</span>
|
|
||||||
) : (
|
|
||||||
<span className="text-sm text-gray-400">-</span>
|
|
||||||
)}
|
|
||||||
</TableCell>
|
|
||||||
</TableRow>
|
</TableRow>
|
||||||
))}
|
</TableHeader>
|
||||||
</TableBody>
|
<TableBody>
|
||||||
</Table>
|
{worker.workOrders.map((order: any) => (
|
||||||
|
<TableRow key={order.id}>
|
||||||
|
<TableCell className="font-medium text-blue-600">{order.id}</TableCell>
|
||||||
|
<TableCell>
|
||||||
|
<Badge variant="outline">{order.type}</Badge>
|
||||||
|
</TableCell>
|
||||||
|
<TableCell>
|
||||||
|
<div>
|
||||||
|
<p className="font-medium">{order.merchant}</p>
|
||||||
|
<p className="text-sm text-gray-500">{order.mall}</p>
|
||||||
|
</div>
|
||||||
|
</TableCell>
|
||||||
|
<TableCell>
|
||||||
|
<div className="flex items-center">
|
||||||
|
<Wrench className="h-4 w-4 mr-2 text-gray-400" />
|
||||||
|
{order.equipment}
|
||||||
|
</div>
|
||||||
|
</TableCell>
|
||||||
|
<TableCell>{getWorkOrderStatusBadge(order.status)}</TableCell>
|
||||||
|
<TableCell>
|
||||||
|
{order.status === "completed" && order.updatedAt ? (
|
||||||
|
<span className="text-sm">{order.updatedAt}</span>
|
||||||
|
) : (
|
||||||
|
<span className="text-sm text-gray-400">-</span>
|
||||||
|
)}
|
||||||
|
</TableCell>
|
||||||
|
</TableRow>
|
||||||
|
))}
|
||||||
|
</TableBody>
|
||||||
|
</Table>
|
||||||
|
{/* 工单分页组件 */}
|
||||||
|
{workerOrdersPagination[worker.id] && workerOrdersPagination[worker.id].total > 0 && (
|
||||||
|
<div className="flex items-center justify-between px-2 py-4 border-t mt-4">
|
||||||
|
<div className="flex items-center space-x-2">
|
||||||
|
<p className="text-sm text-gray-700">
|
||||||
|
显示 {Math.min((workerOrdersPagination[worker.id].currentPage - 1) * workerOrdersPagination[worker.id].pageSize + 1, workerOrdersPagination[worker.id].total)} 到{" "}
|
||||||
|
{Math.min(workerOrdersPagination[worker.id].currentPage * workerOrdersPagination[worker.id].pageSize, workerOrdersPagination[worker.id].total)} 条，共 {workerOrdersPagination[worker.id].total} 条记录
|
||||||
|
</p>
|
||||||
|
</div>
|
||||||
|
<div className="flex items-center space-x-2">
|
||||||
|
<div className="flex items-center space-x-2">
|
||||||
|
<p className="text-sm text-gray-700">每页显示</p>
|
||||||
|
<Select
|
||||||
|
value={workerOrdersPagination[worker.id].pageSize.toString()}
|
||||||
|
onValueChange={(value) => {
|
||||||
|
const newPageSize = parseInt(value)
|
||||||
|
fetchWorkerOrders(worker.id, 1, newPageSize)
|
||||||
|
}}
|
||||||
|
>
|
||||||
|
<SelectTrigger className="w-20">
|
||||||
|
<SelectValue />
|
||||||
|
</SelectTrigger>
|
||||||
|
<SelectContent>
|
||||||
|
<SelectItem value="10">10</SelectItem>
|
||||||
|
<SelectItem value="20">20</SelectItem>
|
||||||
|
<SelectItem value="50">50</SelectItem>
|
||||||
|
<SelectItem value="100">100</SelectItem>
|
||||||
|
</SelectContent>
|
||||||
|
</Select>
|
||||||
|
<p className="text-sm text-gray-700">条</p>
|
||||||
|
</div>
|
||||||
|
<div className="flex items-center space-x-1">
|
||||||
|
<Button
|
||||||
|
variant="outline"
|
||||||
|
size="sm"
|
||||||
|
onClick={() => fetchWorkerOrders(worker.id, 1, workerOrdersPagination[worker.id].pageSize)}
|
||||||
|
disabled={workerOrdersPagination[worker.id].currentPage === 1}
|
||||||
|
>
|
||||||
|
首页
|
||||||
|
</Button>
|
||||||
|
<Button
|
||||||
|
variant="outline"
|
||||||
|
size="sm"
|
||||||
|
onClick={() => fetchWorkerOrders(worker.id, workerOrdersPagination[worker.id].currentPage - 1, workerOrdersPagination[worker.id].pageSize)}
|
||||||
|
disabled={workerOrdersPagination[worker.id].currentPage === 1}
|
||||||
|
>
|
||||||
|
上一页
|
||||||
|
</Button>
|
||||||
|
<div className="flex items-center space-x-1">
|
||||||
|
{Array.from({ length: Math.min(5, Math.ceil(workerOrdersPagination[worker.id].total / workerOrdersPagination[worker.id].pageSize)) }, (_, i) => {
|
||||||
|
const pageNum = Math.max(1, workerOrdersPagination[worker.id].currentPage - 2) + i
|
||||||
|
if (pageNum > Math.ceil(workerOrdersPagination[worker.id].total / workerOrdersPagination[worker.id].pageSize)) return null
|
||||||
|
return (
|
||||||
|
<Button
|
||||||
|
key={pageNum}
|
||||||
|
variant={workerOrdersPagination[worker.id].currentPage === pageNum ? "default" : "outline"}
|
||||||
|
size="sm"
|
||||||
|
onClick={() => fetchWorkerOrders(worker.id, pageNum, workerOrdersPagination[worker.id].pageSize)}
|
||||||
|
className="w-8 h-8 p-0"
|
||||||
|
>
|
||||||
|
{pageNum}
|
||||||
|
</Button>
|
||||||
|
)
|
||||||
|
})}
|
||||||
|
</div>
|
||||||
|
<Button
|
||||||
|
variant="outline"
|
||||||
|
size="sm"
|
||||||
|
onClick={() => fetchWorkerOrders(worker.id, workerOrdersPagination[worker.id].currentPage + 1, workerOrdersPagination[worker.id].pageSize)}
|
||||||
|
disabled={workerOrdersPagination[worker.id].currentPage >= Math.ceil(workerOrdersPagination[worker.id].total / workerOrdersPagination[worker.id].pageSize)}
|
||||||
|
>
|
||||||
|
下一页
|
||||||
|
</Button>
|
||||||
|
<Button
|
||||||
|
variant="outline"
|
||||||
|
size="sm"
|
||||||
|
onClick={() => fetchWorkerOrders(worker.id, Math.ceil(workerOrdersPagination[worker.id].total / workerOrdersPagination[worker.id].pageSize), workerOrdersPagination[worker.id].pageSize)}
|
||||||
|
disabled={workerOrdersPagination[worker.id].currentPage >= Math.ceil(workerOrdersPagination[worker.id].total / workerOrdersPagination[worker.id].pageSize)}
|
||||||
|
>
|
||||||
|
末页
|
||||||
|
</Button>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
)}
|
||||||
|
</>
|
||||||
) : (
|
) : (
|
||||||
<div className="text-center py-8 text-gray-500">
|
<div className="text-center py-8 text-gray-500">
|
||||||
<Wrench className="h-8 w-8 mx-auto mb-2 opacity-50" />
|
<Wrench className="h-8 w-8 mx-auto mb-2 opacity-50" />
|
||||||
|
|||||||
Reference in New Issue
Block a user