dachui/order_site
2
0
Fork 0
Code Issues Pull Requests Actions Packages Projects Releases Wiki Activity

feat(order-service): 支持自定义订单状态节点文案

Browse Source
This commit is contained in:
yml2213
2026-11-04 13:04:52 +08:00
parent 4a7cc2c6fe
commit 3969703ac8
12 changed files with 226 additions and 12 deletions
Download Patch File Download Diff File Expand all files Collapse all files
apps/frontend/src/pages/admin/panels/OrderServicePanel.tsx
+54
View File
@@ -44,6 +44,7 @@ import {
type AdminOrderServiceProfile,
type OrderServiceField,
type OrderServiceMaterialConfirmation,
type OrderServiceStatusSteps,
} from '@/services/admin/worker-platform'
import { uploadFile } from '@/services/files'
import type { UploadedFile } from '@/types/worker-platform'
@@ -76,6 +77,7 @@ type OrderServiceFormValues = {
screenshots: ScreenshotForm
autoPublish: AutoPublishForm
materialConfirmation: OrderServiceMaterialConfirmation
statusSteps: OrderServiceStatusSteps
}
const DEFAULT_SCREENSHOTS: ScreenshotForm = {
@@ -104,6 +106,23 @@ const DEFAULT_MATERIAL_CONFIRMATION: OrderServiceMaterialConfirmation = {
const DEFAULT_POST_SUBMIT_TEXT = '资料提交后如需修改，请联系客服。'
const DEFAULT_STATUS_STEPS: OrderServiceStatusSteps = {
submitted: { title: '提交资料', description: '' },
scheduled: { title: '客服安排', description: '' },
processing: { title: '订单处理', description: '' },
completed: { title: '交付完成', description: '' },
}
const STATUS_STEP_OPTIONS: Array<{
key: keyof OrderServiceStatusSteps
label: string
}> = [
{ key: 'submitted', label: '第 1 步 · 提交资料' },
{ key: 'scheduled', label: '第 2 步 · 客服安排' },
{ key: 'processing', label: '第 3 步 · 订单处理' },
{ key: 'completed', label: '第 4 步 · 交付完成' },
]
type FieldPreset = Omit<OrderServiceField, 'sortOrder'>
const FIELD_PRESETS: Record<string, FieldPreset> = {
@@ -287,6 +306,7 @@ export default function OrderServicePanel() {
screenshots: nextProfile?.screenshots || DEFAULT_SCREENSHOTS,
autoPublish: nextProfile?.autoPublish || DEFAULT_AUTO_PUBLISH,
materialConfirmation: nextProfile?.materialConfirmation || DEFAULT_MATERIAL_CONFIRMATION,
statusSteps: nextProfile?.statusSteps || DEFAULT_STATUS_STEPS,
})
setFields(
normalizeFieldOrder(
@@ -395,6 +415,7 @@ export default function OrderServicePanel() {
screenshots: values.screenshots,
autoPublish: values.autoPublish,
materialConfirmation: values.materialConfirmation,
statusSteps: values.statusSteps,
submitText: values.submitText,
successText: values.successText,
postSubmitText: values.postSubmitText,
@@ -687,6 +708,39 @@ export default function OrderServicePanel() {
</div>
</section>
<section className="order-service-section">
<div className="order-service-section-head">
<div>
<Text strong>客户状态进度文案</Text>
<Text type="secondary">
四个节点独立展示；标题保持简短，补充说明可填写引导文案。
</Text>
</div>
</div>
<div className="order-service-status-step-grid">
{STATUS_STEP_OPTIONS.map((step) => (
<div className="order-service-status-step-card" key={step.key}>
<Text strong>{step.label}</Text>
<Form.Item
label="节点标题"
name={['statusSteps', step.key, 'title']}
rules={[
{ required: true, whitespace: true, message: '请填写节点标题' },
]}
>
<Input maxLength={20} />
</Form.Item>
<Form.Item
label="补充说明"
name={['statusSteps', step.key, 'description']}
>
<Input maxLength={80} placeholder="选填，显示在节点标题下方" />
</Form.Item>
</div>
))}
</div>
</section>
<section className="order-service-section">
<div className="order-service-section-head">
<div>
apps/frontend/src/pages/public/OrderServicePage.tsx
+25 -7
View File
@@ -51,12 +51,12 @@ const STATUS_STEP_INDEX: Record<string, number> = {
accepted: 3,
problem: 2,
}
const STATUS_STEP_ITEMS = [
{ title: '提交资料' },
{ title: '客服安排' },
{ title: '订单处理' },
{ title: '交付完成' },
]
const DEFAULT_STATUS_STEPS: OrderServiceItem['statusSteps'] = {
submitted: { title: '提交资料', description: '' },
scheduled: { title: '客服安排', description: '' },
processing: { title: '订单处理', description: '' },
completed: { title: '交付完成', description: '' },
}
const STATUS_TAG_COLORS: Record<string, string> = {
pending_material: 'orange',
unassigned: 'blue',
@@ -399,6 +399,7 @@ function OrderServiceStatusCard({ item }: { item: OrderServiceItem }) {
].filter((row): row is { label: string; value: string } => Boolean(row?.value))
const acceptanceImageUrls = item.acceptanceImageUrls || []
const showSteps = item.state !== 'cancelled'
const statusSteps = item.statusSteps || DEFAULT_STATUS_STEPS
return (
<Card size="small" className="collect-link-status-card">
@@ -412,7 +413,24 @@ function OrderServiceStatusCard({ item }: { item: OrderServiceItem }) {
<Steps
className="collect-link-status-steps"
current={currentStep}
items={STATUS_STEP_ITEMS}
items={[
{
title: statusSteps.submitted.title,
description: statusSteps.submitted.description || undefined,
},
{
title: statusSteps.scheduled.title,
description: statusSteps.scheduled.description || undefined,
},
{
title: statusSteps.processing.title,
description: statusSteps.processing.description || undefined,
},
{
title: statusSteps.completed.title,
description: statusSteps.completed.description || undefined,
},
]}
responsive
size="small"
status={
apps/frontend/src/services/admin/worker-platform.ts
+9
View File
@@ -1129,6 +1129,13 @@ export type OrderServiceMaterialConfirmation = {
cancelText: string
}
export type OrderServiceStatusSteps = {
submitted: { title: string; description: string }
scheduled: { title: string; description: string }
processing: { title: string; description: string }
completed: { title: string; description: string }
}
export type AdminOrderServiceProfile = {
id: number
categoryId: number
@@ -1151,6 +1158,7 @@ export type AdminOrderServiceProfile = {
retryMax: number
}
materialConfirmation: OrderServiceMaterialConfirmation
statusSteps: OrderServiceStatusSteps
submitText: string
successText: string
postSubmitText: string
@@ -1199,6 +1207,7 @@ export function saveAdminOrderServiceProfile(payload: {
retryMax: number
}
materialConfirmation: OrderServiceMaterialConfirmation
statusSteps: OrderServiceStatusSteps
submitText?: string
successText?: string
postSubmitText?: string
apps/frontend/src/services/worker.ts
+8
View File
@@ -585,6 +585,13 @@ export type OrderServiceMaterialConfirmation = {
cancelText: string
}
export type OrderServiceStatusSteps = {
submitted: { title: string; description: string }
scheduled: { title: string; description: string }
processing: { title: string; description: string }
completed: { title: string; description: string }
}
export type OrderServiceItem = {
workOrderId: number
productName: string
@@ -600,6 +607,7 @@ export type OrderServiceItem = {
canSubmit: boolean
blockedReason: '' | 'already_submitted' | 'status' | 'assigned' | 'shares'
materialConfirmation?: OrderServiceMaterialConfirmation
statusSteps: OrderServiceStatusSteps
fields?: OrderServiceField[]
values?: Record<string, string>
screenshots?: UploadedFile[]
apps/frontend/src/styles/admin.css
+25 -1
View File
@@ -1843,6 +1843,25 @@
margin-top: 6px;
}
.order-service-status-step-grid {
display: grid;
grid-template-columns: repeat(2, minmax(0, 1fr));
gap: 12px;
}
.order-service-status-step-card {
display: grid;
gap: 4px;
padding: 12px;
background: #f8fafc;
border: 1px solid #e5eaf1;
border-radius: 10px;
}
.order-service-status-step-card .ant-form-item {
margin-bottom: 6px;
}
.order-service-confirmation-preview {
display: grid;
gap: 10px;
@@ -2083,7 +2102,8 @@
.order-service-field-extra,
.order-service-switch-grid,
.order-service-switch-grid.is-auto-publish {
.order-service-switch-grid.is-auto-publish,
.order-service-status-step-grid {
grid-template-columns: 1fr 1fr;
}
@@ -2096,4 +2116,8 @@
grid-column: 1;
grid-row: auto;
}
.order-service-status-step-grid {
grid-template-columns: 1fr;
}
}
apps/frontend/src/styles/client.css
+7
View File
@@ -534,6 +534,13 @@
font-size: 12px !important;
}
.collect-link-status-steps .ant-steps-item-description {
max-width: 140px;
font-size: 11px !important;
line-height: 1.45;
white-space: normal;
}
.collect-link-status-message {
padding: 10px 12px;
color: #475569;