- Introduced a new `DiscountTierDto` to represent volume discount tiers, allowing roles with a config quota at or above specified thresholds to receive discounts on pricing. - Updated the `PricingSettingsDto` to include a list of discount tiers, enhancing the pricing model to support more flexible pricing strategies. - Modified the `GetPricingSettingsQueryHandler` and `UpdatePricingSettingsCommandHandler` to handle discount tiers, ensuring they are correctly retrieved and updated in the database. - Enhanced validation in `UpdatePricingSettingsCommandValidator` to enforce uniqueness and progressive discount tiers, preventing invalid configurations. - Updated frontend components to support the new discount tier functionality, including forms for adding and managing discount tiers in the admin interface. - Revised API documentation to reflect the new discount tier features and their usage in pricing settings.
177 lines
8.3 KiB
TypeScript
177 lines
8.3 KiB
TypeScript
import { useState } from 'react'
|
|
import { useMutation, useQueryClient } from '@tanstack/react-query'
|
|
import { useTranslation } from 'react-i18next'
|
|
import { toast } from '@/shared/ui/toast-store'
|
|
import { Button } from '@/shared/ui/button'
|
|
import { Input } from '@/shared/ui/input'
|
|
import { Label } from '@/shared/ui/label'
|
|
import { HttpError } from '@/shared/api/client'
|
|
import type { PricingSettingsDto } from '@/shared/api/types'
|
|
import { updatePricingSettings } from './api'
|
|
|
|
type TierRow = { minConfigs: string; discountPercent: string }
|
|
|
|
export function PricingSettingsEditor({ settings }: { settings: PricingSettingsDto }) {
|
|
const { t } = useTranslation()
|
|
const queryClient = useQueryClient()
|
|
const [pricePerConfigPerQuarter, setPricePerConfigPerQuarter] = useState(
|
|
settings.pricePerConfigPerQuarter != null ? String(settings.pricePerConfigPerQuarter) : '',
|
|
)
|
|
const [pricePerConfigPerHalfYear, setPricePerConfigPerHalfYear] = useState(
|
|
settings.pricePerConfigPerHalfYear != null ? String(settings.pricePerConfigPerHalfYear) : '',
|
|
)
|
|
const [pricePerConfigPerYear, setPricePerConfigPerYear] = useState(
|
|
settings.pricePerConfigPerYear != null ? String(settings.pricePerConfigPerYear) : '',
|
|
)
|
|
const [tiers, setTiers] = useState<TierRow[]>(
|
|
settings.discountTiers.map((t) => ({ minConfigs: String(t.minConfigs), discountPercent: String(t.discountPercent) })),
|
|
)
|
|
|
|
const updateTier = (index: number, patch: Partial<TierRow>) =>
|
|
setTiers((rows) => rows.map((row, i) => (i === index ? { ...row, ...patch } : row)))
|
|
const removeTier = (index: number) => setTiers((rows) => rows.filter((_, i) => i !== index))
|
|
const addTier = () => setTiers((rows) => [...rows, { minConfigs: '', discountPercent: '' }])
|
|
|
|
// Зеркалит бэкенд-инварианты UpdatePricingSettingsCommandValidator: пороги не повторяются, скидка
|
|
// на большем пороге не меньше скидки на меньшем (иначе лесенка не прогрессивная).
|
|
const tierErrors = (() => {
|
|
if (tiers.some((t) => t.minConfigs === '' || t.discountPercent === '')) return null
|
|
const parsed = tiers.map((t) => ({ minConfigs: Number(t.minConfigs), discountPercent: Number(t.discountPercent) }))
|
|
if (parsed.some((t) => !Number.isInteger(t.minConfigs) || t.minConfigs < 1)) return t('admin.pricing.discountTierInvalidMinConfigs')
|
|
if (parsed.some((t) => !Number.isInteger(t.discountPercent) || t.discountPercent < 1 || t.discountPercent > 99))
|
|
return t('admin.pricing.discountTierInvalidPercent')
|
|
if (new Set(parsed.map((t) => t.minConfigs)).size !== parsed.length) return t('admin.pricing.discountTiersDuplicate')
|
|
const sorted = [...parsed].sort((a, b) => a.minConfigs - b.minConfigs)
|
|
for (let i = 1; i < sorted.length; i++) {
|
|
if (sorted[i].discountPercent < sorted[i - 1].discountPercent) return t('admin.pricing.discountTiersNotProgressive')
|
|
}
|
|
return null
|
|
})()
|
|
const hasIncompleteTier = tiers.some((t) => t.minConfigs === '' || t.discountPercent === '')
|
|
|
|
// Все ставки — цена за конфиг в месяц; итог за более длинный период (ставка × месяцев) не должен
|
|
// быть дешевле итога за более короткий, иначе выгоднее купить длинный тариф и не продлевать.
|
|
const isHalfYearCheaperThanQuarter =
|
|
pricePerConfigPerQuarter !== '' &&
|
|
pricePerConfigPerHalfYear !== '' &&
|
|
Number(pricePerConfigPerHalfYear) * 6 < Number(pricePerConfigPerQuarter) * 3
|
|
|
|
const isYearCheaperThanHalfYear =
|
|
pricePerConfigPerHalfYear !== '' &&
|
|
pricePerConfigPerYear !== '' &&
|
|
Number(pricePerConfigPerYear) * 12 < Number(pricePerConfigPerHalfYear) * 6
|
|
|
|
const isYearCheaperThanQuarter =
|
|
pricePerConfigPerHalfYear === '' &&
|
|
pricePerConfigPerQuarter !== '' &&
|
|
pricePerConfigPerYear !== '' &&
|
|
Number(pricePerConfigPerYear) * 12 < Number(pricePerConfigPerQuarter) * 3
|
|
|
|
const hasInvalidCombo = isHalfYearCheaperThanQuarter || isYearCheaperThanHalfYear || isYearCheaperThanQuarter
|
|
|
|
const mutation = useMutation({
|
|
mutationFn: () =>
|
|
updatePricingSettings(
|
|
pricePerConfigPerQuarter === '' ? null : Number(pricePerConfigPerQuarter),
|
|
pricePerConfigPerHalfYear === '' ? null : Number(pricePerConfigPerHalfYear),
|
|
pricePerConfigPerYear === '' ? null : Number(pricePerConfigPerYear),
|
|
tiers.map((t) => ({ minConfigs: Number(t.minConfigs), discountPercent: Number(t.discountPercent) })),
|
|
),
|
|
onSuccess: async () => {
|
|
toast.success(t('admin.pricing.updated'))
|
|
await queryClient.invalidateQueries({ queryKey: ['admin-pricing'] })
|
|
},
|
|
onError: (error) => toast.error(error instanceof HttpError ? error.detail : t('auth.genericError')),
|
|
})
|
|
|
|
return (
|
|
<form
|
|
className="flex flex-col gap-4"
|
|
onSubmit={(e) => {
|
|
e.preventDefault()
|
|
mutation.mutate()
|
|
}}
|
|
>
|
|
<div className="flex flex-col gap-1.5">
|
|
<Label htmlFor="pricePerConfigPerQuarter">{t('admin.pricing.pricePerConfigPerQuarter')}</Label>
|
|
<Input
|
|
id="pricePerConfigPerQuarter"
|
|
type="number"
|
|
min={0}
|
|
value={pricePerConfigPerQuarter}
|
|
onChange={(e) => setPricePerConfigPerQuarter(e.target.value)}
|
|
/>
|
|
<p className="text-xs text-muted-foreground">{t('admin.pricing.pricePerConfigPerQuarterHint')}</p>
|
|
</div>
|
|
<div className="flex flex-col gap-1.5">
|
|
<Label htmlFor="pricePerConfigPerHalfYear">{t('admin.pricing.pricePerConfigPerHalfYear')}</Label>
|
|
<Input
|
|
id="pricePerConfigPerHalfYear"
|
|
type="number"
|
|
min={0}
|
|
value={pricePerConfigPerHalfYear}
|
|
onChange={(e) => setPricePerConfigPerHalfYear(e.target.value)}
|
|
/>
|
|
<p className="text-xs text-muted-foreground">{t('admin.pricing.pricePerConfigPerHalfYearHint')}</p>
|
|
{isHalfYearCheaperThanQuarter && (
|
|
<p className="text-xs text-red-600">{t('admin.pricing.halfYearCheaperThanQuarter')}</p>
|
|
)}
|
|
</div>
|
|
<div className="flex flex-col gap-1.5">
|
|
<Label htmlFor="pricePerConfigPerYear">{t('admin.pricing.pricePerConfigPerYear')}</Label>
|
|
<Input
|
|
id="pricePerConfigPerYear"
|
|
type="number"
|
|
min={0}
|
|
value={pricePerConfigPerYear}
|
|
onChange={(e) => setPricePerConfigPerYear(e.target.value)}
|
|
/>
|
|
<p className="text-xs text-muted-foreground">{t('admin.pricing.pricePerConfigPerYearHint')}</p>
|
|
{isYearCheaperThanHalfYear && (
|
|
<p className="text-xs text-red-600">{t('admin.pricing.yearCheaperThanHalfYear')}</p>
|
|
)}
|
|
{isYearCheaperThanQuarter && (
|
|
<p className="text-xs text-red-600">{t('admin.pricing.yearCheaperThanQuarter')}</p>
|
|
)}
|
|
</div>
|
|
<div className="flex flex-col gap-2">
|
|
<Label>{t('admin.pricing.discountTiersTitle')}</Label>
|
|
<p className="text-xs text-muted-foreground">{t('admin.pricing.discountTiersHint')}</p>
|
|
{tiers.map((tier, index) => (
|
|
<div key={index} className="flex items-center gap-2">
|
|
<Input
|
|
type="number"
|
|
min={1}
|
|
placeholder={t('admin.pricing.discountTierMinConfigs')}
|
|
value={tier.minConfigs}
|
|
onChange={(e) => updateTier(index, { minConfigs: e.target.value })}
|
|
/>
|
|
<Input
|
|
type="number"
|
|
min={1}
|
|
max={99}
|
|
placeholder={t('admin.pricing.discountTierPercent')}
|
|
value={tier.discountPercent}
|
|
onChange={(e) => updateTier(index, { discountPercent: e.target.value })}
|
|
/>
|
|
<Button type="button" variant="ghost" size="sm" onClick={() => removeTier(index)}>
|
|
{t('admin.pricing.removeDiscountTier')}
|
|
</Button>
|
|
</div>
|
|
))}
|
|
{tierErrors && <p className="text-xs text-red-600">{tierErrors}</p>}
|
|
<div>
|
|
<Button type="button" variant="outline" size="sm" onClick={addTier}>
|
|
{t('admin.pricing.addDiscountTier')}
|
|
</Button>
|
|
</div>
|
|
</div>
|
|
<div>
|
|
<Button type="submit" disabled={mutation.isPending || hasInvalidCombo || !!tierErrors || hasIncompleteTier}>
|
|
{t('admin.roles.save')}
|
|
</Button>
|
|
</div>
|
|
</form>
|
|
)
|
|
}
|