131 lines
3.7 KiB
TypeScript
131 lines
3.7 KiB
TypeScript
'use client'
|
||
import { useState } from 'react'
|
||
import { Button, useDocumentInfo } from '@payloadcms/ui'
|
||
import { useRouter } from 'next/navigation'
|
||
|
||
/**
|
||
* 编辑页面内的订单计数刷新组件
|
||
* 只针对当前编辑的预购商品刷新订单数据
|
||
*/
|
||
export function RefreshOrderCountField() {
|
||
const { id } = useDocumentInfo()
|
||
const [loading, setLoading] = useState(false)
|
||
const [message, setMessage] = useState('')
|
||
const router = useRouter()
|
||
|
||
const handleRefresh = async () => {
|
||
if (!id) {
|
||
setMessage('⚠️ 无法获取商品 ID')
|
||
return
|
||
}
|
||
|
||
setLoading(true)
|
||
setMessage('')
|
||
|
||
try {
|
||
const response = await fetch('/api/preorders/refresh-order-counts', {
|
||
method: 'POST',
|
||
headers: {
|
||
'Content-Type': 'application/json',
|
||
},
|
||
body: JSON.stringify({
|
||
productIds: [id],
|
||
}),
|
||
})
|
||
|
||
const data = await response.json()
|
||
|
||
if (data.success) {
|
||
setMessage(`✅ ${data.message || '订单计数刷新成功！'}`)
|
||
// 刷新页面数据
|
||
setTimeout(() => {
|
||
router.refresh()
|
||
// 重新加载页面以更新显示
|
||
window.location.reload()
|
||
}, 1000)
|
||
} else {
|
||
setMessage(`❌ 刷新失败: ${data.error || '未知错误'}`)
|
||
}
|
||
} catch (error) {
|
||
setMessage('❌ 刷新出错: ' + (error instanceof Error ? error.message : '未知错误'))
|
||
} finally {
|
||
setLoading(false)
|
||
}
|
||
}
|
||
|
||
return (
|
||
<div
|
||
style={{
|
||
padding: '1rem',
|
||
border: '1px solid var(--theme-elevation-150)',
|
||
borderRadius: '4px',
|
||
backgroundColor: 'var(--theme-elevation-50)',
|
||
marginBottom: '1rem',
|
||
}}
|
||
>
|
||
<div style={{ marginBottom: '0.75rem' }}>
|
||
<h4 style={{ margin: '0 0 0.5rem 0', fontSize: '0.875rem', fontWeight: 600 }}>
|
||
📊 订单计数同步
|
||
</h4>
|
||
<p style={{ margin: 0, fontSize: '0.8125rem', color: 'var(--theme-elevation-600)' }}>
|
||
从 Medusa 订单系统同步真实订单计数数据
|
||
</p>
|
||
</div>
|
||
|
||
<Button
|
||
onClick={handleRefresh}
|
||
disabled={loading}
|
||
buttonStyle="primary"
|
||
size="small"
|
||
>
|
||
{loading ? '同步中...' : '🔄 刷新订单计数'}
|
||
</Button>
|
||
|
||
{message && (
|
||
<div
|
||
style={{
|
||
padding: '0.75rem',
|
||
marginTop: '0.75rem',
|
||
borderRadius: '4px',
|
||
backgroundColor: message.startsWith('✅')
|
||
? 'var(--theme-success-50)'
|
||
: message.startsWith('⚠️')
|
||
? 'var(--theme-warning-50)'
|
||
: 'var(--theme-error-50)',
|
||
color: message.startsWith('✅')
|
||
? 'var(--theme-success-900)'
|
||
: message.startsWith('⚠️')
|
||
? 'var(--theme-warning-900)'
|
||
: 'var(--theme-error-900)',
|
||
fontSize: '0.8125rem',
|
||
}}
|
||
>
|
||
{message}
|
||
</div>
|
||
)}
|
||
|
||
<div
|
||
style={{
|
||
marginTop: '0.75rem',
|
||
padding: '0.75rem',
|
||
backgroundColor: 'var(--theme-elevation-100)',
|
||
borderRadius: '4px',
|
||
fontSize: '0.8125rem',
|
||
color: 'var(--theme-elevation-600)',
|
||
}}
|
||
>
|
||
<p style={{ margin: '0.25rem 0', fontWeight: 600 }}>💡 说明：</p>
|
||
<p style={{ margin: '0.25rem 0' }}>
|
||
• <strong>真实订单计数</strong>：从 Medusa 自动同步，只读
|
||
</p>
|
||
<p style={{ margin: '0.25rem 0' }}>
|
||
• <strong>Fake计数</strong>：上方可手动编辑
|
||
</p>
|
||
<p style={{ margin: '0.25rem 0' }}>
|
||
• <strong>显示进度</strong> = 真实订单 + Fake计数
|
||
</p>
|
||
</div>
|
||
</div>
|
||
)
|
||
}
|