feat(platform): add vehicle list customer questions
This commit is contained in:
@@ -807,6 +807,44 @@ export function Vehicles({
|
||||
onClick: exportVehicles
|
||||
}
|
||||
];
|
||||
const vehicleCustomerQuestions = [
|
||||
{
|
||||
question: '客户要找某辆车怎么办?',
|
||||
answer: filters.keyword?.trim() ? filters.keyword.trim() : '先输入 VIN/车牌/手机号',
|
||||
evidence: filters.keyword?.trim() ? '已进入单车范围' : `当前筛选 ${pagination.total.toLocaleString()} 辆`,
|
||||
action: '聚焦找车',
|
||||
color: filters.keyword?.trim() ? 'green' as const : 'blue' as const,
|
||||
disabled: false,
|
||||
onClick: () => document.querySelector<HTMLInputElement>('input[name="keyword"]')?.focus()
|
||||
},
|
||||
{
|
||||
question: '现在有哪些车在线?',
|
||||
answer: `${(summary?.onlineVehicles ?? 0).toLocaleString()} 辆在线`,
|
||||
evidence: filters.online === 'online' ? '已筛在线车辆' : '可切换到在线车辆池',
|
||||
action: '只看在线',
|
||||
color: (summary?.onlineVehicles ?? 0) > 0 ? 'green' as const : 'orange' as const,
|
||||
disabled: false,
|
||||
onClick: () => applyFilters({ ...filters, online: 'online' })
|
||||
},
|
||||
{
|
||||
question: '哪些车暂时不能服务?',
|
||||
answer: `${((summary?.noDataVehicles ?? 0) + (summary?.unboundVehicles ?? 0)).toLocaleString()} 辆待处理`,
|
||||
evidence: `无来源 ${(summary?.noDataVehicles ?? 0).toLocaleString()} / 待绑定 ${(summary?.unboundVehicles ?? 0).toLocaleString()}`,
|
||||
action: '异常车辆',
|
||||
color: (summary?.noDataVehicles ?? 0) > 0 || (summary?.unboundVehicles ?? 0) > 0 ? 'orange' as const : 'green' as const,
|
||||
disabled: false,
|
||||
onClick: () => primaryAction ? applyFilters({ ...filters, ...primaryAction.filters }) : applyFilters({ ...filters, serviceStatus: 'no_data' })
|
||||
},
|
||||
{
|
||||
question: '车辆清单能交付吗?',
|
||||
answer: rows.length > 0 ? `${rows.length.toLocaleString()} 辆当前页` : '暂无可交付车辆',
|
||||
evidence: `筛选总计 ${pagination.total.toLocaleString()} 辆`,
|
||||
action: '复制交付包',
|
||||
color: rows.length > 0 ? 'blue' as const : 'grey' as const,
|
||||
disabled: false,
|
||||
onClick: () => copyCustomerServicePackage()
|
||||
}
|
||||
];
|
||||
|
||||
useEffect(() => {
|
||||
setFilters(initialFilters);
|
||||
@@ -978,6 +1016,38 @@ export function Vehicles({
|
||||
</div>
|
||||
</div>
|
||||
</Card>
|
||||
<Card bordered title="车辆客户常问" style={{ marginTop: 16 }}>
|
||||
<div className="vp-vehicle-question-board">
|
||||
<div className="vp-vehicle-question-summary">
|
||||
<Space wrap>
|
||||
<Tag color="blue">客户问题</Tag>
|
||||
<Tag color={filters.keyword?.trim() ? 'green' : 'grey'}>{filters.keyword?.trim() ? '单车范围' : '车辆池'}</Tag>
|
||||
<Tag color={(summary?.noDataVehicles ?? 0) > 0 || (summary?.unboundVehicles ?? 0) > 0 ? 'orange' : 'green'}>
|
||||
{((summary?.noDataVehicles ?? 0) + (summary?.unboundVehicles ?? 0)).toLocaleString()} 辆待处理
|
||||
</Tag>
|
||||
</Space>
|
||||
<strong>把车辆池问题翻译成找车、在线、异常和交付动作</strong>
|
||||
<span>客户从车辆池开始时,不需要先理解数据源;先定位车辆、确认在线、处理不可服务车辆,再交付车辆清单。</span>
|
||||
</div>
|
||||
<div className="vp-vehicle-question-grid">
|
||||
{vehicleCustomerQuestions.map((item) => (
|
||||
<button
|
||||
key={item.question}
|
||||
type="button"
|
||||
className="vp-vehicle-question-item"
|
||||
disabled={item.disabled}
|
||||
onClick={item.onClick}
|
||||
aria-label={`车辆客户常问 ${item.question} ${item.action}`}
|
||||
>
|
||||
<Tag color={item.color}>{item.question}</Tag>
|
||||
<strong>{item.answer}</strong>
|
||||
<span>{item.evidence}</span>
|
||||
<em>{item.action}</em>
|
||||
</button>
|
||||
))}
|
||||
</div>
|
||||
</div>
|
||||
</Card>
|
||||
<Card bordered title="车辆服务决策板" style={{ marginTop: 16 }}>
|
||||
<div className="vp-vehicle-decision-grid">
|
||||
{vehicleDecisionItems.map((item) => (
|
||||
|
||||
Reference in New Issue
Block a user