1249 lines
47 KiB
TypeScript
1249 lines
47 KiB
TypeScript
import { useEffect, useState, useMemo } from 'react'
|
||
import {
|
||
Card,
|
||
Table,
|
||
Typography,
|
||
Space,
|
||
Select,
|
||
Tag,
|
||
message,
|
||
Button,
|
||
Input,
|
||
Modal,
|
||
InputNumber,
|
||
Empty,
|
||
Alert,
|
||
Tooltip,
|
||
Divider,
|
||
Radio,
|
||
Row,
|
||
Col,
|
||
} from 'antd'
|
||
import {
|
||
SyncOutlined,
|
||
SearchOutlined,
|
||
CheckCircleOutlined,
|
||
StopOutlined,
|
||
EditOutlined,
|
||
DollarCircleOutlined,
|
||
ReloadOutlined,
|
||
FilterOutlined,
|
||
ShopOutlined,
|
||
ThunderboltOutlined,
|
||
} from '@ant-design/icons'
|
||
import {
|
||
listAccountDisplays,
|
||
listSites,
|
||
updateAccountDisplay,
|
||
syncSiteAccounts,
|
||
updateAccountMarkup,
|
||
batchUpdateAccountMarkup,
|
||
formatMoney,
|
||
getMe,
|
||
type AccountDisplay,
|
||
type Site,
|
||
} from '../api'
|
||
import { useMember } from '../MemberContext'
|
||
|
||
const SOURCE_OPTIONS = [
|
||
{ label: '全部货源', value: 'all' },
|
||
{ label: '主站自营 (平台共享池)', value: 'main' },
|
||
{ label: '本站收号 (独家货源)', value: 'self' },
|
||
{ label: '合作分站 (跨站共享)', value: 'collab' },
|
||
]
|
||
|
||
const MARKUP_OPTIONS = [
|
||
{ label: '全部提价状态', value: 'all' },
|
||
{ label: '已自主提价 (赚差价)', value: 'marked' },
|
||
{ label: '未加价 (基准销售价)', value: 'unmarked' },
|
||
]
|
||
|
||
const DISPLAY_OPTIONS = [
|
||
{ label: '全部展示状态', value: 'all' },
|
||
{ label: '展示中 (在售货架)', value: 'enabled' },
|
||
{ label: '已下架 (隐藏货架)', value: 'disabled' },
|
||
]
|
||
|
||
const TX_OPTIONS = [
|
||
{ label: '全部租借状态', value: 'all' },
|
||
{ label: '待租中 (空闲可租)', value: 'idle' },
|
||
{ label: '出租中 (租赁履约)', value: 'rented' },
|
||
]
|
||
|
||
const MAIN_LISTING_STATUS_MAP: Record<string, { label: string; color: string }> = {
|
||
published: { label: '主站在售', color: 'green' },
|
||
rented: { label: '在租中', color: 'cyan' },
|
||
completed: { label: '已售出/结单', color: 'blue' },
|
||
offline: { label: '主站下架', color: 'default' },
|
||
closed: { label: '已关闭', color: 'error' },
|
||
abnormal: { label: '异常冻结', color: 'error' },
|
||
sealed: { label: '已封存', color: 'magenta' },
|
||
draft: { label: '草稿', color: 'warning' },
|
||
}
|
||
|
||
function formatGameName(name?: string) {
|
||
if (!name) return '默认游戏'
|
||
const lower = name.toLowerCase().trim()
|
||
if (
|
||
lower === 'delta_force' ||
|
||
lower === 'deltaforce' ||
|
||
lower === 'delta' ||
|
||
lower.includes('delta_force') ||
|
||
lower.includes('delta') ||
|
||
name.includes('三角洲')
|
||
) {
|
||
return '三角洲'
|
||
}
|
||
if (lower.includes('honor') || name.includes('王者')) {
|
||
return '王者荣耀'
|
||
}
|
||
if (lower.includes('genshin') || name.includes('原神')) {
|
||
return '原神'
|
||
}
|
||
if (lower.includes('cs') || lower.includes('csgo')) {
|
||
return 'CS2'
|
||
}
|
||
return name
|
||
}
|
||
|
||
function formatLoginPlatform(platform?: string): string {
|
||
if (!platform) return ''
|
||
const lower = platform.toLowerCase().trim()
|
||
if (lower === 'qq') return 'QQ'
|
||
if (lower === 'wechat' || lower === 'wx') return '微信'
|
||
if (lower === 'steam') return 'Steam'
|
||
if (lower === 'epic') return 'Epic'
|
||
if (lower === 'wegame') return 'WeGame'
|
||
if (lower === 'mobile') return '手游端'
|
||
if (lower === 'pc') return 'PC端'
|
||
return platform
|
||
}
|
||
|
||
export default function Accounts() {
|
||
const member = useMember()
|
||
const [sites, setSites] = useState<Site[]>([])
|
||
const [siteID, setSiteID] = useState<number | undefined>(member?.site_id)
|
||
const [items, setItems] = useState<AccountDisplay[]>([])
|
||
const [loading, setLoading] = useState(false)
|
||
const [syncing, setSyncing] = useState(false)
|
||
const [selectedRowKeys, setSelectedRowKeys] = useState<React.Key[]>([])
|
||
|
||
// Shelf product filter states
|
||
const [sourceFilter, setSourceFilter] = useState<string>('all')
|
||
const [markupFilter, setMarkupFilter] = useState<string>('all')
|
||
const [displayFilter, setDisplayFilter] = useState<string>('all')
|
||
const [txFilter, setTxFilter] = useState<string>('all')
|
||
const [keyword, setKeyword] = useState<string>('')
|
||
|
||
// Multi-mode Pricing modal state
|
||
const [markupModalVisible, setMarkupModalVisible] = useState(false)
|
||
const [targetAccount, setTargetAccount] = useState<AccountDisplay | null>(null)
|
||
const [pricingMode, setPricingMode] = useState<'target_price' | 'add_amount' | 'percent' | 'ratio_delta'>('target_price')
|
||
const [targetPriceYuan, setTargetPriceYuan] = useState<number>(0)
|
||
const [addAmountYuan, setAddAmountYuan] = useState<number>(0)
|
||
const [percentMarkup, setPercentMarkup] = useState<number>(0)
|
||
const [markupRatio, setMarkupRatio] = useState<number>(0)
|
||
const [markupSaving, setMarkupSaving] = useState(false)
|
||
|
||
// Batch pricing state
|
||
const [batchMode, setBatchMode] = useState<'percent' | 'add_amount' | 'ratio_delta'>('percent')
|
||
const [batchValue, setBatchValue] = useState<number>(10)
|
||
|
||
async function load(site?: number) {
|
||
if (!site) return
|
||
setLoading(true)
|
||
try {
|
||
// Fetch full shelf goods to allow fast client-side multidimensional filtering
|
||
const rows = await listAccountDisplays(site, '')
|
||
setItems(rows)
|
||
} catch {
|
||
message.error('账号展示货架加载失败')
|
||
} finally {
|
||
setLoading(false)
|
||
}
|
||
}
|
||
|
||
// Initialize site context:
|
||
// Normal distribution merchant is strictly bound to member.site_id
|
||
// Only superadmin can fetch sites and switch between tenants
|
||
useEffect(() => {
|
||
async function init() {
|
||
let currentMember = member
|
||
if (!currentMember) {
|
||
try {
|
||
currentMember = await getMe()
|
||
} catch {
|
||
// ignore
|
||
}
|
||
}
|
||
|
||
const activeSiteID = currentMember?.site_id
|
||
if (activeSiteID) {
|
||
setSiteID(activeSiteID)
|
||
void load(activeSiteID)
|
||
}
|
||
|
||
if (currentMember?.is_superadmin) {
|
||
try {
|
||
const rows = await listSites()
|
||
setSites(rows)
|
||
if (!activeSiteID && rows.length > 0) {
|
||
setSiteID(rows[0].id)
|
||
void load(rows[0].id)
|
||
}
|
||
} catch {
|
||
// ignore
|
||
}
|
||
}
|
||
}
|
||
void init()
|
||
}, [member])
|
||
|
||
async function handleSync() {
|
||
if (!siteID) {
|
||
message.warning('无法获取当前分销站点信息')
|
||
return
|
||
}
|
||
setSyncing(true)
|
||
try {
|
||
const res = await syncSiteAccounts(siteID)
|
||
message.success(
|
||
`同步完成！成功同步新增商品 ${res.synced_count} 个，已在货架 ${res.skipped_count} 个（主站共享池在售共 ${res.total_active} 个）`,
|
||
5,
|
||
)
|
||
await load(siteID)
|
||
} catch (error: unknown) {
|
||
const respMessage = (error as { response?: { data?: { message?: string } } })?.response?.data?.message
|
||
message.error(respMessage ?? '同步主站商品失败')
|
||
} finally {
|
||
setSyncing(false)
|
||
}
|
||
}
|
||
|
||
async function toggle(item: AccountDisplay) {
|
||
const next = item.display_status === 'enabled' ? 'disabled' : 'enabled'
|
||
try {
|
||
await updateAccountDisplay(item.id, next)
|
||
message.success(next === 'enabled' ? '已恢复货架展示' : '已从货架下架')
|
||
if (siteID) void load(siteID)
|
||
} catch (error: unknown) {
|
||
const respMessage = (error as { response?: { data?: { message?: string } } })?.response?.data?.message
|
||
message.error(respMessage ?? '状态更新失败')
|
||
}
|
||
}
|
||
|
||
async function handleBatchUpdate(targetStatus: 'enabled' | 'disabled') {
|
||
if (selectedRowKeys.length === 0) {
|
||
message.warning('请先勾选需要批量操作的账号')
|
||
return
|
||
}
|
||
const actionLabel = targetStatus === 'enabled' ? '批量恢复展示' : '批量下架'
|
||
Modal.confirm({
|
||
title: `确认${actionLabel}？`,
|
||
content: `即将对选中的 ${selectedRowKeys.length} 个账号执行${actionLabel}操作。`,
|
||
onOk: async () => {
|
||
let successCount = 0
|
||
for (const id of selectedRowKeys) {
|
||
try {
|
||
await updateAccountDisplay(Number(id), targetStatus)
|
||
successCount++
|
||
} catch {
|
||
// continue next
|
||
}
|
||
}
|
||
message.success(`已完成 ${successCount}/${selectedRowKeys.length} 个账号的${actionLabel}`)
|
||
setSelectedRowKeys([])
|
||
if (siteID) void load(siteID)
|
||
},
|
||
})
|
||
}
|
||
|
||
function roundRatio(value: number): number {
|
||
if (value <= 0 || isNaN(value) || !isFinite(value)) return 0
|
||
return Math.round(value * 10) / 10
|
||
}
|
||
|
||
function calcDeltaFromTargetPrice(hafCoinAmount: number, basePriceCent: number, targetPriceYuan: number): number {
|
||
if (basePriceCent <= 0 || targetPriceYuan <= 0) return 0
|
||
const coinWan = hafCoinAmount / 10000
|
||
const basePriceYuan = basePriceCent / 100
|
||
if (targetPriceYuan <= basePriceYuan) return 0
|
||
const baseRatio = roundRatio(coinWan / basePriceYuan)
|
||
if (baseRatio <= 0) return 0
|
||
const siteRatio = roundRatio(coinWan / targetPriceYuan)
|
||
const delta = roundRatio(baseRatio - siteRatio)
|
||
return Math.max(0, delta)
|
||
}
|
||
|
||
function calcPreviewPrice(hafCoinAmount: number, basePriceCent: number, delta: number): { priceCent: number; siteRatio: number; markupCent: number } {
|
||
const coinWan = hafCoinAmount / 10000
|
||
const basePriceYuan = basePriceCent / 100
|
||
const baseRatio = roundRatio(coinWan / basePriceYuan)
|
||
if (delta <= 0 || baseRatio <= 0) {
|
||
return { priceCent: basePriceCent, siteRatio: baseRatio, markupCent: 0 }
|
||
}
|
||
let siteRatio = roundRatio(baseRatio - delta)
|
||
if (siteRatio <= 0.01) siteRatio = 0.01
|
||
const priceYuan = coinWan / siteRatio
|
||
const priceCent = Math.max(basePriceCent, Math.round(priceYuan * 100))
|
||
return {
|
||
priceCent,
|
||
siteRatio,
|
||
markupCent: priceCent - basePriceCent,
|
||
}
|
||
}
|
||
|
||
function handleOpenMarkup(item?: AccountDisplay) {
|
||
if (item) {
|
||
setTargetAccount(item)
|
||
const currentDelta = item.shelf_ratio_delta ?? 0
|
||
setMarkupRatio(currentDelta)
|
||
const basePriceYuan = (item.price_cent || 0) / 100
|
||
const currentPriceYuan = (item.site_price_cent || item.price_cent || 0) / 100
|
||
setTargetPriceYuan(currentPriceYuan)
|
||
setAddAmountYuan(Math.max(0, Number((currentPriceYuan - basePriceYuan).toFixed(2))))
|
||
setPercentMarkup(
|
||
basePriceYuan > 0
|
||
? Number((((currentPriceYuan - basePriceYuan) / basePriceYuan) * 100).toFixed(1))
|
||
: 0
|
||
)
|
||
setPricingMode('target_price')
|
||
} else {
|
||
if (selectedRowKeys.length === 0) {
|
||
message.warning('请先勾选需要批量加价的账号商品')
|
||
return
|
||
}
|
||
setTargetAccount(null)
|
||
setBatchMode('percent')
|
||
setBatchValue(10)
|
||
}
|
||
setMarkupModalVisible(true)
|
||
}
|
||
|
||
function onTargetPriceChange(val: number | null) {
|
||
const nextTarget = Math.max(0, val ?? 0)
|
||
setTargetPriceYuan(nextTarget)
|
||
if (!targetAccount) return
|
||
const basePriceYuan = (targetAccount.price_cent || 0) / 100
|
||
const addYuan = Math.max(0, Number((nextTarget - basePriceYuan).toFixed(2)))
|
||
setAddAmountYuan(addYuan)
|
||
setPercentMarkup(basePriceYuan > 0 ? Number(((addYuan / basePriceYuan) * 100).toFixed(1)) : 0)
|
||
const delta = calcDeltaFromTargetPrice(targetAccount.haf_coin_amount || 0, targetAccount.price_cent || 0, nextTarget)
|
||
setMarkupRatio(delta)
|
||
}
|
||
|
||
function onAddAmountChange(val: number | null) {
|
||
const nextAdd = Math.max(0, val ?? 0)
|
||
setAddAmountYuan(nextAdd)
|
||
if (!targetAccount) return
|
||
const basePriceYuan = (targetAccount.price_cent || 0) / 100
|
||
const nextTarget = Number((basePriceYuan + nextAdd).toFixed(2))
|
||
setTargetPriceYuan(nextTarget)
|
||
setPercentMarkup(basePriceYuan > 0 ? Number(((nextAdd / basePriceYuan) * 100).toFixed(1)) : 0)
|
||
const delta = calcDeltaFromTargetPrice(targetAccount.haf_coin_amount || 0, targetAccount.price_cent || 0, nextTarget)
|
||
setMarkupRatio(delta)
|
||
}
|
||
|
||
function onPercentMarkupChange(val: number | null) {
|
||
const nextPct = Math.max(0, val ?? 0)
|
||
setPercentMarkup(nextPct)
|
||
if (!targetAccount) return
|
||
const basePriceYuan = (targetAccount.price_cent || 0) / 100
|
||
const nextTarget = Number((basePriceYuan * (1 + nextPct / 100)).toFixed(2))
|
||
setTargetPriceYuan(nextTarget)
|
||
setAddAmountYuan(Number((nextTarget - basePriceYuan).toFixed(2)))
|
||
const delta = calcDeltaFromTargetPrice(targetAccount.haf_coin_amount || 0, targetAccount.price_cent || 0, nextTarget)
|
||
setMarkupRatio(delta)
|
||
}
|
||
|
||
function onMarkupRatioChange(val: number | null) {
|
||
const nextDelta = Math.max(0, val ?? 0)
|
||
setMarkupRatio(nextDelta)
|
||
if (!targetAccount) return
|
||
const preview = calcPreviewPrice(targetAccount.haf_coin_amount || 0, targetAccount.price_cent || 0, nextDelta)
|
||
const previewYuan = Number((preview.priceCent / 100).toFixed(2))
|
||
const basePriceYuan = (targetAccount.price_cent || 0) / 100
|
||
setTargetPriceYuan(previewYuan)
|
||
const addYuan = Number((preview.markupCent / 100).toFixed(2))
|
||
setAddAmountYuan(addYuan)
|
||
setPercentMarkup(basePriceYuan > 0 ? Number(((addYuan / basePriceYuan) * 100).toFixed(1)) : 0)
|
||
}
|
||
|
||
async function handleSaveMarkup() {
|
||
if (!siteID) return
|
||
setMarkupSaving(true)
|
||
try {
|
||
if (targetAccount) {
|
||
await updateAccountMarkup(targetAccount.id, markupRatio)
|
||
message.success(`商品《${targetAccount.title || targetAccount.listing_no}》加价成功！`)
|
||
} else {
|
||
const selectedItems = items.filter((it) => selectedRowKeys.includes(it.id))
|
||
if (selectedItems.length === 0) {
|
||
message.warning('请先勾选要加价的商品')
|
||
return
|
||
}
|
||
|
||
if (batchMode === 'ratio_delta') {
|
||
const listingIDs = selectedItems.map((it) => it.listing_id)
|
||
await batchUpdateAccountMarkup(siteID, listingIDs, batchValue)
|
||
} else if (batchMode === 'percent') {
|
||
await Promise.all(
|
||
selectedItems.map((it) => {
|
||
const basePriceYuan = (it.price_cent || 0) / 100
|
||
const targetYuan = basePriceYuan * (1 + batchValue / 100)
|
||
const delta = calcDeltaFromTargetPrice(it.haf_coin_amount || 0, it.price_cent || 0, targetYuan)
|
||
return updateAccountMarkup(it.id, delta)
|
||
})
|
||
)
|
||
} else if (batchMode === 'add_amount') {
|
||
await Promise.all(
|
||
selectedItems.map((it) => {
|
||
const basePriceYuan = (it.price_cent || 0) / 100
|
||
const targetYuan = basePriceYuan + batchValue
|
||
const delta = calcDeltaFromTargetPrice(it.haf_coin_amount || 0, it.price_cent || 0, targetYuan)
|
||
return updateAccountMarkup(it.id, delta)
|
||
})
|
||
)
|
||
}
|
||
message.success(`已成功为选中的 ${selectedItems.length} 个商品批量设置提价！`)
|
||
setSelectedRowKeys([])
|
||
}
|
||
setMarkupModalVisible(false)
|
||
void load(siteID)
|
||
} catch (error: unknown) {
|
||
const respMessage = (error as { response?: { data?: { message?: string } } })?.response?.data?.message
|
||
message.error(respMessage || '提价设置保存失败')
|
||
} finally {
|
||
setMarkupSaving(false)
|
||
}
|
||
}
|
||
|
||
function handleResetFilters() {
|
||
setSourceFilter('all')
|
||
setMarkupFilter('all')
|
||
setDisplayFilter('all')
|
||
setTxFilter('all')
|
||
setKeyword('')
|
||
}
|
||
|
||
// Multidimensional client-side filter
|
||
const filteredItems = useMemo(() => {
|
||
return items.filter((item) => {
|
||
// 1. Source filter
|
||
if (sourceFilter === 'main') {
|
||
if (item.listing_site_id !== null && item.listing_site_id !== undefined) return false
|
||
} else if (sourceFilter === 'self') {
|
||
if (item.listing_site_id !== siteID) return false
|
||
} else if (sourceFilter === 'collab') {
|
||
if (item.listing_site_id === null || item.listing_site_id === undefined || item.listing_site_id === siteID) {
|
||
return false
|
||
}
|
||
}
|
||
|
||
// 2. Markup filter
|
||
if (markupFilter === 'marked') {
|
||
if (!item.shelf_ratio_delta || item.shelf_ratio_delta <= 0) return false
|
||
} else if (markupFilter === 'unmarked') {
|
||
if (item.shelf_ratio_delta && item.shelf_ratio_delta > 0) return false
|
||
}
|
||
|
||
// 3. Display status filter
|
||
if (displayFilter !== 'all') {
|
||
if (item.display_status !== displayFilter) return false
|
||
}
|
||
|
||
// 4. Transaction filter
|
||
if (txFilter === 'idle') {
|
||
if (item.in_transaction) return false
|
||
} else if (txFilter === 'rented') {
|
||
if (!item.in_transaction) return false
|
||
}
|
||
|
||
// 5. Keyword search
|
||
if (keyword.trim()) {
|
||
const kw = keyword.trim().toLowerCase()
|
||
const matchTitle = item.title && item.title.toLowerCase().includes(kw)
|
||
const matchNo = item.listing_no && item.listing_no.toLowerCase().includes(kw)
|
||
const matchGame = (item.game_name && item.game_name.toLowerCase().includes(kw)) || formatGameName(item.game_name).includes(kw)
|
||
const matchRegion = item.server_region && item.server_region.toLowerCase().includes(kw)
|
||
const matchPlatform = item.login_platform && item.login_platform.toLowerCase().includes(kw)
|
||
const matchId = String(item.account_id).includes(kw) || String(item.listing_id).includes(kw)
|
||
if (!matchTitle && !matchNo && !matchGame && !matchRegion && !matchPlatform && !matchId) {
|
||
return false
|
||
}
|
||
}
|
||
|
||
return true
|
||
})
|
||
}, [items, sourceFilter, markupFilter, displayFilter, txFilter, keyword, siteID])
|
||
|
||
// Statistics counters
|
||
const counts = useMemo(() => {
|
||
let mainCount = 0
|
||
let selfCount = 0
|
||
let collabCount = 0
|
||
let markedCount = 0
|
||
let enabledCount = 0
|
||
|
||
for (const item of items) {
|
||
if (item.listing_site_id === null || item.listing_site_id === undefined) {
|
||
mainCount++
|
||
} else if (item.listing_site_id === siteID) {
|
||
selfCount++
|
||
} else {
|
||
collabCount++
|
||
}
|
||
|
||
if (item.shelf_ratio_delta && item.shelf_ratio_delta > 0) {
|
||
markedCount++
|
||
}
|
||
if (item.display_status === 'enabled') {
|
||
enabledCount++
|
||
}
|
||
}
|
||
|
||
const hasActiveFilters =
|
||
sourceFilter !== 'all' ||
|
||
markupFilter !== 'all' ||
|
||
displayFilter !== 'all' ||
|
||
txFilter !== 'all' ||
|
||
keyword.trim() !== ''
|
||
|
||
return {
|
||
total: items.length,
|
||
main: mainCount,
|
||
self: selfCount,
|
||
collab: collabCount,
|
||
marked: markedCount,
|
||
enabled: enabledCount,
|
||
filtered: filteredItems.length,
|
||
hasActiveFilters,
|
||
}
|
||
}, [items, siteID, sourceFilter, markupFilter, displayFilter, txFilter, keyword, filteredItems.length])
|
||
|
||
const currentSiteName =
|
||
member?.site_name || sites.find((s) => s.id === siteID)?.site_name || '当前分销商'
|
||
|
||
return (
|
||
<Space direction="vertical" className="page" style={{ width: '100%' }}>
|
||
{/* Superadmin Cross-tenant Inspection Banner */}
|
||
{member?.is_superadmin && sites.length > 0 && (
|
||
<Alert
|
||
type="info"
|
||
showIcon
|
||
style={{ marginBottom: 4 }}
|
||
message={
|
||
<Space align="center" wrap>
|
||
<Tag color="purple">平台超管巡检模式</Tag>
|
||
<span>切换巡查分销站点：</span>
|
||
<Select
|
||
style={{ width: 260 }}
|
||
value={siteID}
|
||
options={sites.map((s) => ({
|
||
label: `${s.site_name} (${s.site_code})`,
|
||
value: s.id,
|
||
}))}
|
||
onChange={(val) => {
|
||
setSiteID(val)
|
||
setSelectedRowKeys([])
|
||
void load(val)
|
||
}}
|
||
/>
|
||
<Typography.Text type="secondary" style={{ fontSize: 12 }}>
|
||
（普通分销商登录时已完全自动锁定所属本站，无需选择分销网站）
|
||
</Typography.Text>
|
||
</Space>
|
||
}
|
||
/>
|
||
)}
|
||
|
||
{/* Page Header */}
|
||
<div style={{ display: 'flex', justifyContent: 'space-between', alignItems: 'center', flexWrap: 'wrap', gap: 12 }}>
|
||
<div>
|
||
<Space align="baseline">
|
||
<Typography.Title level={3} style={{ marginBottom: 4 }}>
|
||
商品与账号展示
|
||
</Typography.Title>
|
||
<Tag color="blue" style={{ fontSize: 13, padding: '2px 8px' }}>
|
||
<ShopOutlined /> {currentSiteName}
|
||
</Tag>
|
||
</Space>
|
||
<div>
|
||
<Typography.Text type="secondary">
|
||
管理本站对外展示与销售的货架商品。所有账号源均来自主站及平台共享池，支持一键铺货并自主提价（调小兑换比例）销售，<strong>加价溢价全额归本站所有</strong>。
|
||
</Typography.Text>
|
||
</div>
|
||
</div>
|
||
<Button
|
||
type="primary"
|
||
icon={<SyncOutlined spin={syncing} />}
|
||
loading={syncing}
|
||
onClick={handleSync}
|
||
style={{ background: '#1677ff' }}
|
||
>
|
||
一键同步主站商品
|
||
</Button>
|
||
</div>
|
||
|
||
{/* Shelf Filter Bar */}
|
||
<Card size="small">
|
||
<Space direction="vertical" style={{ width: '100%' }} size="middle">
|
||
{/* Controls row */}
|
||
<div style={{ display: 'flex', justifyContent: 'space-between', alignItems: 'center', flexWrap: 'wrap', gap: 8 }}>
|
||
<Space wrap size="small">
|
||
{/* 货源归属 */}
|
||
<Select
|
||
style={{ width: 170 }}
|
||
value={sourceFilter}
|
||
options={SOURCE_OPTIONS}
|
||
onChange={setSourceFilter}
|
||
/>
|
||
|
||
{/* 提价状态 */}
|
||
<Select
|
||
style={{ width: 170 }}
|
||
value={markupFilter}
|
||
options={MARKUP_OPTIONS}
|
||
onChange={setMarkupFilter}
|
||
/>
|
||
|
||
{/* 展示状态 */}
|
||
<Select
|
||
style={{ width: 160 }}
|
||
value={displayFilter}
|
||
options={DISPLAY_OPTIONS}
|
||
onChange={setDisplayFilter}
|
||
/>
|
||
|
||
{/* 交易租借状态 */}
|
||
<Select
|
||
style={{ width: 150 }}
|
||
value={txFilter}
|
||
options={TX_OPTIONS}
|
||
onChange={setTxFilter}
|
||
/>
|
||
|
||
{/* 搜索框 */}
|
||
<Input
|
||
placeholder="搜索商品编号/账号标题/游戏/区服"
|
||
prefix={<SearchOutlined />}
|
||
style={{ width: 250 }}
|
||
allowClear
|
||
value={keyword}
|
||
onChange={(e) => setKeyword(e.target.value)}
|
||
/>
|
||
|
||
{counts.hasActiveFilters && (
|
||
<Button icon={<ReloadOutlined />} onClick={handleResetFilters}>
|
||
重置筛选
|
||
</Button>
|
||
)}
|
||
</Space>
|
||
|
||
{/* Batch actions */}
|
||
{selectedRowKeys.length > 0 && (
|
||
<Space>
|
||
<Typography.Text strong style={{ color: '#1677ff' }}>
|
||
已选 {selectedRowKeys.length} 项
|
||
</Typography.Text>
|
||
<Button
|
||
size="small"
|
||
type="primary"
|
||
ghost
|
||
icon={<DollarCircleOutlined />}
|
||
onClick={() => handleOpenMarkup()}
|
||
>
|
||
批量加价
|
||
</Button>
|
||
<Button
|
||
size="small"
|
||
icon={<CheckCircleOutlined />}
|
||
onClick={() => handleBatchUpdate('enabled')}
|
||
>
|
||
批量展示
|
||
</Button>
|
||
<Button
|
||
size="small"
|
||
danger
|
||
icon={<StopOutlined />}
|
||
onClick={() => handleBatchUpdate('disabled')}
|
||
>
|
||
批量下架
|
||
</Button>
|
||
<Button size="small" type="link" onClick={() => setSelectedRowKeys([])}>
|
||
取消勾选
|
||
</Button>
|
||
</Space>
|
||
)}
|
||
</div>
|
||
|
||
<Divider style={{ margin: '4px 0' }} />
|
||
|
||
{/* Quick Statistics and Data Scope Badges */}
|
||
<div style={{ display: 'flex', justifyContent: 'space-between', alignItems: 'center', flexWrap: 'wrap', gap: 8 }}>
|
||
<Space wrap size={4}>
|
||
<Typography.Text type="secondary" style={{ fontSize: 12, marginRight: 4 }}>
|
||
<FilterOutlined /> 货架概览:
|
||
</Typography.Text>
|
||
<Tag color="default">货架总计 {counts.total} 件</Tag>
|
||
<Tag color="green">主站自营 {counts.main} 件</Tag>
|
||
<Tag color="purple">本站收号 {counts.self} 件</Tag>
|
||
{counts.collab > 0 && <Tag color="blue">合作分站 {counts.collab} 件</Tag>}
|
||
<Tag color="gold">已自主加价 {counts.marked} 件</Tag>
|
||
<Tag color="cyan">正常展示中 {counts.enabled} 件</Tag>
|
||
</Space>
|
||
|
||
{counts.hasActiveFilters && (
|
||
<Tag color="processing" style={{ fontWeight: 'bold' }}>
|
||
已按条件筛选：展示 {counts.filtered} / {counts.total} 件
|
||
</Tag>
|
||
)}
|
||
</div>
|
||
</Space>
|
||
</Card>
|
||
|
||
{/* Products Table */}
|
||
<Card>
|
||
<Table
|
||
rowKey="id"
|
||
loading={loading}
|
||
dataSource={filteredItems}
|
||
scroll={{ x: 1200 }}
|
||
locale={{
|
||
emptyText: (
|
||
<Empty
|
||
image={Empty.PRESENTED_IMAGE_SIMPLE}
|
||
description={
|
||
counts.hasActiveFilters
|
||
? '没有符合当前筛选条件的货架商品，请尝试重置筛选条件'
|
||
: '当前分站货架暂无商品。点击下方按钮一键同步主站共享池，即可在此设置提价并对外展示。'
|
||
}
|
||
>
|
||
{counts.hasActiveFilters ? (
|
||
<Button icon={<ReloadOutlined />} onClick={handleResetFilters}>
|
||
重置筛选条件
|
||
</Button>
|
||
) : (
|
||
<Button
|
||
type="primary"
|
||
icon={<SyncOutlined spin={syncing} />}
|
||
loading={syncing}
|
||
onClick={handleSync}
|
||
>
|
||
一键同步主站商品
|
||
</Button>
|
||
)}
|
||
</Empty>
|
||
),
|
||
}}
|
||
rowSelection={{
|
||
selectedRowKeys,
|
||
onChange: setSelectedRowKeys,
|
||
}}
|
||
pagination={{
|
||
pageSize: 20,
|
||
showTotal: (total) => `共 ${total} 个账号商品`,
|
||
showQuickJumper: true,
|
||
}}
|
||
columns={[
|
||
{
|
||
title: '商品编号',
|
||
dataIndex: 'listing_no',
|
||
width: 170,
|
||
render: (v: string | undefined, row: AccountDisplay) => (
|
||
<div style={{ whiteSpace: 'nowrap' }}>
|
||
<div style={{ display: 'inline-flex', alignItems: 'center', whiteSpace: 'nowrap', marginBottom: 4 }}>
|
||
<Typography.Text
|
||
copyable={{ text: v || String(row.listing_id), tooltips: ['复制商品编号', '已复制'] }}
|
||
strong
|
||
className="mono-code"
|
||
style={{
|
||
fontSize: 13,
|
||
color: '#1677ff',
|
||
whiteSpace: 'nowrap',
|
||
wordBreak: 'keep-all',
|
||
display: 'inline-flex',
|
||
alignItems: 'center',
|
||
}}
|
||
>
|
||
{v || `#${row.listing_id}`}
|
||
</Typography.Text>
|
||
</div>
|
||
<div>
|
||
{row.in_transaction ? (
|
||
<Tag color="warning" style={{ margin: 0, fontSize: 11 }}>
|
||
出租中
|
||
</Tag>
|
||
) : (
|
||
<Tag color="green" style={{ margin: 0, fontSize: 11 }}>
|
||
在售空闲
|
||
</Tag>
|
||
)}
|
||
</div>
|
||
</div>
|
||
),
|
||
},
|
||
{
|
||
title: '货源归属',
|
||
width: 110,
|
||
render: (_: unknown, row: AccountDisplay) => {
|
||
if (row.listing_site_id === null || row.listing_site_id === undefined) {
|
||
return (
|
||
<Tooltip title="来自主站官方统一共享池，分销商可提价转售">
|
||
<Tag color="green">主站自营</Tag>
|
||
</Tooltip>
|
||
)
|
||
}
|
||
if (row.listing_site_id === siteID) {
|
||
return (
|
||
<Tooltip title="本分销站专属收录上架的号源">
|
||
<Tag color="purple">本站收号</Tag>
|
||
</Tooltip>
|
||
)
|
||
}
|
||
return (
|
||
<Tooltip title="其他合作分销站铺过来的共享号源">
|
||
<Tag color="blue">合作分站</Tag>
|
||
</Tooltip>
|
||
)
|
||
},
|
||
},
|
||
{
|
||
title: '账号信息',
|
||
dataIndex: 'title',
|
||
width: 260,
|
||
render: (_: unknown, row: AccountDisplay) => (
|
||
<div>
|
||
<Typography.Text
|
||
strong
|
||
style={{ fontSize: 14, lineHeight: '20px', display: 'block' }}
|
||
ellipsis={{ tooltip: row.title }}
|
||
>
|
||
{row.title || `账号 #${row.account_id}`}
|
||
</Typography.Text>
|
||
<Space size={4} style={{ marginTop: 4 }} wrap>
|
||
<Tag color="blue">{formatGameName(row.game_name)}</Tag>
|
||
{row.server_region && <Tag>{row.server_region}</Tag>}
|
||
{row.login_platform && <Tag color="cyan">{formatLoginPlatform(row.login_platform)}</Tag>}
|
||
</Space>
|
||
</div>
|
||
),
|
||
},
|
||
{
|
||
title: '段位 / 资产',
|
||
width: 130,
|
||
render: (_: unknown, row: AccountDisplay) => (
|
||
<div>
|
||
<div>{row.rank_level ? <Tag color="purple">{row.rank_level}</Tag> : '-'}</div>
|
||
{row.haf_coin_amount !== undefined && row.haf_coin_amount > 0 && (
|
||
<Typography.Text type="secondary" style={{ fontSize: 12, whiteSpace: 'nowrap', display: 'block', marginTop: 2 }}>
|
||
哈夫币: {row.haf_coin_amount.toLocaleString()}
|
||
</Typography.Text>
|
||
)}
|
||
</div>
|
||
),
|
||
},
|
||
{
|
||
title: '租金 / 押金',
|
||
width: 150,
|
||
render: (_: unknown, row: AccountDisplay) => {
|
||
const finalPrice = row.site_price_cent || row.price_cent
|
||
const hasMarkup = row.shelf_ratio_delta && row.shelf_ratio_delta > 0
|
||
return (
|
||
<div>
|
||
<Typography.Text strong style={{ color: '#cf1322', fontSize: 15, whiteSpace: 'nowrap', display: 'block' }}>
|
||
{formatMoney(finalPrice)}
|
||
</Typography.Text>
|
||
<div style={{ fontSize: 12, color: '#888', whiteSpace: 'nowrap', marginTop: 2 }}>
|
||
押金: {formatMoney(row.deposit_amount_cent)}
|
||
</div>
|
||
{hasMarkup && (
|
||
<div style={{ fontSize: 11, color: '#389e0d', marginTop: 2, whiteSpace: 'nowrap' }}>
|
||
含加价: +{formatMoney(row.markup_amount_cent)}
|
||
</div>
|
||
)}
|
||
</div>
|
||
)
|
||
},
|
||
},
|
||
{
|
||
title: '加价比例',
|
||
dataIndex: 'shelf_ratio_delta',
|
||
width: 110,
|
||
render: (v: number | undefined) => {
|
||
if (v && v > 0) {
|
||
return (
|
||
<Tag color="gold" style={{ fontWeight: 'bold' }}>
|
||
+{v} 比例点
|
||
</Tag>
|
||
)
|
||
}
|
||
return <span style={{ color: '#aaa', fontSize: 12 }}>无加价 (基准)</span>
|
||
},
|
||
},
|
||
{
|
||
title: '主站状态',
|
||
dataIndex: 'listing_status',
|
||
width: 110,
|
||
render: (v: string | undefined) => {
|
||
const conf = MAIN_LISTING_STATUS_MAP[v || ''] || { label: v || '未知', color: 'default' }
|
||
return <Tag color={conf.color}>{conf.label}</Tag>
|
||
},
|
||
},
|
||
{
|
||
title: '分销展示',
|
||
dataIndex: 'display_status',
|
||
width: 100,
|
||
render: (v: string) => (
|
||
<Tag color={v === 'enabled' ? 'success' : 'default'}>
|
||
{v === 'enabled' ? '展示中' : '已下架'}
|
||
</Tag>
|
||
),
|
||
},
|
||
{
|
||
title: '操作',
|
||
width: 110,
|
||
fixed: 'right' as const,
|
||
render: (_: unknown, row: AccountDisplay) => (
|
||
<Space size={2}>
|
||
<Button
|
||
type="link"
|
||
size="small"
|
||
icon={<EditOutlined />}
|
||
style={{ padding: 0 }}
|
||
onClick={() => handleOpenMarkup(row)}
|
||
>
|
||
加价
|
||
</Button>
|
||
<Button
|
||
type="link"
|
||
size="small"
|
||
danger={row.display_status === 'enabled'}
|
||
style={{ padding: 0 }}
|
||
onClick={() => toggle(row)}
|
||
>
|
||
{row.display_status === 'enabled' ? '下架' : '展示'}
|
||
</Button>
|
||
</Space>
|
||
),
|
||
},
|
||
]}
|
||
/>
|
||
</Card>
|
||
|
||
{/* Rich Multi-mode Markup Modal */}
|
||
<Modal
|
||
title={
|
||
<Space>
|
||
<DollarCircleOutlined style={{ color: '#52c41a' }} />
|
||
<span>{targetAccount ? `商品加价设置 - ${targetAccount.title || targetAccount.listing_no}` : `批量调价 (${selectedRowKeys.length} 个账号商品)`}</span>
|
||
</Space>
|
||
}
|
||
open={markupModalVisible}
|
||
onCancel={() => setMarkupModalVisible(false)}
|
||
onOk={handleSaveMarkup}
|
||
confirmLoading={markupSaving}
|
||
okText="保存并同步货架"
|
||
cancelText="取消"
|
||
width={580}
|
||
destroyOnClose
|
||
>
|
||
<Space direction="vertical" style={{ width: '100%', padding: '8px 0' }} size="middle">
|
||
<Alert
|
||
type="success"
|
||
showIcon
|
||
message="分销商 100% 独享溢价说明"
|
||
description="在主站基准租金之上增加的全部溢价金额（加价差价），100% 独立结算至本分销商账户，不与任何第三方分成！"
|
||
/>
|
||
|
||
{targetAccount ? (
|
||
<>
|
||
<div
|
||
style={{
|
||
background: '#f8fafc',
|
||
border: '1px solid #e2e8f0',
|
||
borderRadius: 6,
|
||
padding: '12px 16px',
|
||
}}
|
||
>
|
||
<Row gutter={[16, 8]}>
|
||
<Col span={24}>
|
||
<Typography.Text strong style={{ fontSize: 14 }}>
|
||
{targetAccount.title || targetAccount.listing_no}
|
||
</Typography.Text>
|
||
</Col>
|
||
<Col span={12}>
|
||
<Typography.Text type="secondary">游戏区服：</Typography.Text>
|
||
<span>{formatGameName(targetAccount.game_name) || '-'} / {targetAccount.server_region || '-'}</span>
|
||
</Col>
|
||
<Col span={12}>
|
||
<Typography.Text type="secondary">哈夫币资产：</Typography.Text>
|
||
<span>
|
||
{(targetAccount.haf_coin_amount || 0).toLocaleString()} 币
|
||
<span style={{ color: '#8c8c8c', marginLeft: 4 }}>
|
||
({((targetAccount.haf_coin_amount || 0) / 10000).toFixed(1)} 万)
|
||
</span>
|
||
</span>
|
||
</Col>
|
||
<Col span={12}>
|
||
<Typography.Text type="secondary">主站基准价：</Typography.Text>
|
||
<strong style={{ color: '#1677ff' }}>¥{((targetAccount.price_cent || 0) / 100).toFixed(2)}</strong>
|
||
</Col>
|
||
<Col span={12}>
|
||
<Typography.Text type="secondary">主站基准比例：</Typography.Text>
|
||
<span>{targetAccount.base_ratio || '-'} 点</span>
|
||
</Col>
|
||
</Row>
|
||
</div>
|
||
|
||
<div>
|
||
<Typography.Text strong style={{ display: 'block', marginBottom: 8 }}>
|
||
加价模式选择：
|
||
</Typography.Text>
|
||
<Radio.Group
|
||
value={pricingMode}
|
||
onChange={(e) => setPricingMode(e.target.value)}
|
||
buttonStyle="solid"
|
||
style={{ width: '100%' }}
|
||
>
|
||
<Radio.Button value="target_price" style={{ width: '25%', textAlign: 'center' }}>期望售价</Radio.Button>
|
||
<Radio.Button value="add_amount" style={{ width: '25%', textAlign: 'center' }}>固定加价</Radio.Button>
|
||
<Radio.Button value="percent" style={{ width: '25%', textAlign: 'center' }}>百分比上浮</Radio.Button>
|
||
<Radio.Button value="ratio_delta" style={{ width: '25%', textAlign: 'center' }}>比例调减</Radio.Button>
|
||
</Radio.Group>
|
||
</div>
|
||
|
||
<div style={{ background: '#fafafa', padding: 12, borderRadius: 6 }}>
|
||
{pricingMode === 'target_price' && (
|
||
<div>
|
||
<div style={{ marginBottom: 6 }}>
|
||
<Typography.Text strong>最终售价（元）：</Typography.Text>
|
||
</div>
|
||
<InputNumber
|
||
prefix="¥"
|
||
min={Number(((targetAccount.price_cent || 0) / 100).toFixed(2))}
|
||
precision={2}
|
||
step={1}
|
||
style={{ width: '100%' }}
|
||
value={targetPriceYuan}
|
||
onChange={onTargetPriceChange}
|
||
placeholder="输入租客最终看到的标价"
|
||
/>
|
||
<Typography.Text type="secondary" style={{ fontSize: 12, display: 'block', marginTop: 4 }}>
|
||
输入最终期望标价，系统自动换算对应比例点
|
||
</Typography.Text>
|
||
</div>
|
||
)}
|
||
|
||
{pricingMode === 'add_amount' && (
|
||
<div>
|
||
<div style={{ marginBottom: 6 }}>
|
||
<Typography.Text strong>加价金额（元）：</Typography.Text>
|
||
</div>
|
||
<InputNumber
|
||
prefix="+¥"
|
||
min={0}
|
||
precision={2}
|
||
step={1}
|
||
style={{ width: '100%' }}
|
||
value={addAmountYuan}
|
||
onChange={onAddAmountChange}
|
||
placeholder="输入在主站价格基础上增加的金额"
|
||
/>
|
||
<Typography.Text type="secondary" style={{ fontSize: 12, display: 'block', marginTop: 4 }}>
|
||
在主站基准价上直接增加的纯利润金额
|
||
</Typography.Text>
|
||
</div>
|
||
)}
|
||
|
||
{pricingMode === 'percent' && (
|
||
<div>
|
||
<div style={{ marginBottom: 6 }}>
|
||
<Typography.Text strong>上浮百分比（%）：</Typography.Text>
|
||
</div>
|
||
<InputNumber
|
||
prefix="+"
|
||
addonAfter="%"
|
||
min={0}
|
||
max={500}
|
||
precision={1}
|
||
step={5}
|
||
style={{ width: '100%' }}
|
||
value={percentMarkup}
|
||
onChange={onPercentMarkupChange}
|
||
placeholder="例如 15"
|
||
/>
|
||
<Typography.Text type="secondary" style={{ fontSize: 12, display: 'block', marginTop: 4 }}>
|
||
按基准价百分比上浮，例如 10% 或 20%
|
||
</Typography.Text>
|
||
</div>
|
||
)}
|
||
|
||
{pricingMode === 'ratio_delta' && (
|
||
<div>
|
||
<div style={{ marginBottom: 6 }}>
|
||
<Typography.Text strong>调减比例点（点）：</Typography.Text>
|
||
</div>
|
||
<InputNumber
|
||
min={0}
|
||
max={100}
|
||
precision={1}
|
||
step={0.1}
|
||
addonAfter="点"
|
||
style={{ width: '100%' }}
|
||
value={markupRatio}
|
||
onChange={onMarkupRatioChange}
|
||
placeholder="0"
|
||
/>
|
||
<Typography.Text type="secondary" style={{ fontSize: 12, display: 'block', marginTop: 4 }}>
|
||
高级模式：直接调减 1 元兑换哈夫币比例，比例越小售价越高
|
||
</Typography.Text>
|
||
</div>
|
||
)}
|
||
</div>
|
||
|
||
{/* Real-time Earnings Comparison Card */}
|
||
<div
|
||
style={{
|
||
padding: '14px 16px',
|
||
background: '#f6ffed',
|
||
borderRadius: 6,
|
||
border: '1px solid #b7eb8f',
|
||
}}
|
||
>
|
||
<div style={{ display: 'flex', justifyContent: 'space-between', alignItems: 'center', marginBottom: 6 }}>
|
||
<Typography.Text type="secondary">预计本站标价：</Typography.Text>
|
||
<Typography.Text strong style={{ fontSize: 16, color: '#cf1322' }}>
|
||
¥{targetPriceYuan.toFixed(2)}
|
||
</Typography.Text>
|
||
</div>
|
||
<div style={{ display: 'flex', justifyContent: 'space-between', alignItems: 'center', marginBottom: 6 }}>
|
||
<Typography.Text type="secondary">本站 100% 独享溢价：</Typography.Text>
|
||
<Typography.Text strong style={{ fontSize: 18, color: '#389e0d' }}>
|
||
+¥{addAmountYuan.toFixed(2)}
|
||
</Typography.Text>
|
||
</div>
|
||
<Divider style={{ margin: '8px 0' }} />
|
||
<div style={{ display: 'flex', justifyContent: 'space-between', fontSize: 12, color: '#595959' }}>
|
||
<span>兑换比例换算：</span>
|
||
<span>
|
||
基准 {targetAccount.base_ratio || '-'} → 标价{' '}
|
||
<strong>{Math.max((targetAccount.base_ratio || 0) - markupRatio, 0.01).toFixed(1)}</strong>{' '}
|
||
(调减 {markupRatio.toFixed(1)} 点)
|
||
</span>
|
||
</div>
|
||
</div>
|
||
</>
|
||
) : (
|
||
<>
|
||
<div>
|
||
<Typography.Text strong style={{ display: 'block', marginBottom: 8 }}>
|
||
批量加价模式（已勾选 {selectedRowKeys.length} 件商品）：
|
||
</Typography.Text>
|
||
<Radio.Group
|
||
value={batchMode}
|
||
onChange={(e) => setBatchMode(e.target.value)}
|
||
buttonStyle="solid"
|
||
style={{ width: '100%' }}
|
||
>
|
||
<Radio.Button value="percent" style={{ width: '33.3%', textAlign: 'center' }}>
|
||
按百分比批量上浮 (推荐)
|
||
</Radio.Button>
|
||
<Radio.Button value="add_amount" style={{ width: '33.3%', textAlign: 'center' }}>
|
||
固定加价金额
|
||
</Radio.Button>
|
||
<Radio.Button value="ratio_delta" style={{ width: '33.3%', textAlign: 'center' }}>
|
||
统一调减比例点
|
||
</Radio.Button>
|
||
</Radio.Group>
|
||
</div>
|
||
|
||
<div style={{ background: '#fafafa', padding: 16, borderRadius: 6 }}>
|
||
{batchMode === 'percent' && (
|
||
<div>
|
||
<Typography.Text strong style={{ display: 'block', marginBottom: 6 }}>
|
||
统一上浮百分比（%）：
|
||
</Typography.Text>
|
||
<InputNumber
|
||
prefix="+"
|
||
addonAfter="%"
|
||
min={0}
|
||
max={500}
|
||
precision={1}
|
||
step={5}
|
||
style={{ width: '100%' }}
|
||
value={batchValue}
|
||
onChange={(v) => setBatchValue(v ?? 0)}
|
||
placeholder="例如 10 或 15"
|
||
/>
|
||
<Typography.Text type="secondary" style={{ fontSize: 12, display: 'block', marginTop: 6 }}>
|
||
所有勾选商品将按各自底价自动上浮 {batchValue}%，并自动为每件商品精确匹配比例点
|
||
</Typography.Text>
|
||
</div>
|
||
)}
|
||
|
||
{batchMode === 'add_amount' && (
|
||
<div>
|
||
<Typography.Text strong style={{ display: 'block', marginBottom: 6 }}>
|
||
统一加价金额（元）：
|
||
</Typography.Text>
|
||
<InputNumber
|
||
prefix="+¥"
|
||
addonAfter="元"
|
||
min={0}
|
||
precision={2}
|
||
step={1}
|
||
style={{ width: '100%' }}
|
||
value={batchValue}
|
||
onChange={(v) => setBatchValue(v ?? 0)}
|
||
placeholder="例如 5.00"
|
||
/>
|
||
<Typography.Text type="secondary" style={{ fontSize: 12, display: 'block', marginTop: 6 }}>
|
||
所有勾选商品统一定价加价 ¥{batchValue.toFixed(2)}，溢价收益全额入账本站
|
||
</Typography.Text>
|
||
</div>
|
||
)}
|
||
|
||
{batchMode === 'ratio_delta' && (
|
||
<div>
|
||
<Typography.Text strong style={{ display: 'block', marginBottom: 6 }}>
|
||
统一调减比例点数：
|
||
</Typography.Text>
|
||
<InputNumber
|
||
min={0}
|
||
max={100}
|
||
precision={1}
|
||
step={0.1}
|
||
addonAfter="点"
|
||
style={{ width: '100%' }}
|
||
value={batchValue}
|
||
onChange={(v) => setBatchValue(v ?? 0)}
|
||
placeholder="例如 0.5"
|
||
/>
|
||
<Typography.Text type="secondary" style={{ fontSize: 12, display: 'block', marginTop: 6 }}>
|
||
统一在各商品原比例基础上调减 {batchValue} 点
|
||
</Typography.Text>
|
||
</div>
|
||
)}
|
||
</div>
|
||
|
||
<div
|
||
style={{
|
||
padding: '12px 16px',
|
||
background: '#f6ffed',
|
||
borderRadius: 6,
|
||
border: '1px solid #b7eb8f',
|
||
fontSize: 13,
|
||
color: '#389e0d',
|
||
}}
|
||
>
|
||
💡 已勾选 <strong>{selectedRowKeys.length}</strong> 件商品，批量调价后差价收益将 100% 归本分销商账户独享！
|
||
</div>
|
||
</>
|
||
)}
|
||
</Space>
|
||
</Modal>
|
||
</Space>
|
||
)
|
||
}
|