S-VPN/panel-web
3
0
Fork 0
Code Issues Pull Requests Actions Packages Projects Releases Wiki Activity

🐛 fix(forms): Add step attribute to number inputs for better value control

Browse Source
This commit is contained in:
web@ppanel 2025-03-17 22:47:42 +07:00
parent aa1d42651d
commit b8f4f1e694
4 changed files with 20 additions and 5 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

2
apps/admin/app/dashboard/coupon/coupon-form.tsx
View File

@ -307,6 +307,7 @@ export default function CouponForm<T extends Record<string, any>>({
<EnhancedInput <EnhancedInput
placeholder={t('form.countPlaceholder')} placeholder={t('form.countPlaceholder')}
type='number' type='number'
step={1}
{...field} {...field}
onValueChange={(value) => { onValueChange={(value) => {
form.setValue(field.name, value); form.setValue(field.name, value);
@ -327,6 +328,7 @@ export default function CouponForm<T extends Record<string, any>>({
<EnhancedInput <EnhancedInput
placeholder={t('form.userLimitPlaceholder')} placeholder={t('form.userLimitPlaceholder')}
type='number' type='number'
step={1}
{...field} {...field}
onValueChange={(value) => { onValueChange={(value) => {
form.setValue(field.name, value); form.setValue(field.name, value);

3
apps/admin/app/dashboard/payment/payment-form.tsx
View File

@ -319,7 +319,8 @@ export default function PaymentForm<T>({
}} }}
defaultValue={field.value} defaultValue={field.value}
value={field.value} value={field.value}
disabled={isEdit} // @ts-expect-error
disabled={isEdit && Boolean(initialValues?.platform)}
> >
<FormControl> <FormControl>
<SelectTrigger> <SelectTrigger>

8
apps/admin/app/dashboard/subscribe/subscribe-form.tsx
View File

@ -298,6 +298,7 @@ export default function SubscribeForm<T extends Record<string, any>>({
<EnhancedInput <EnhancedInput
placeholder={t('form.noLimit')} placeholder={t('form.noLimit')}
type='number' type='number'
step={1}
{...field} {...field}
onValueChange={(value) => { onValueChange={(value) => {
form.setValue(field.name, value); form.setValue(field.name, value);
@ -321,7 +322,8 @@ export default function SubscribeForm<T extends Record<string, any>>({
<EnhancedInput <EnhancedInput
placeholder={t('form.noLimit')} placeholder={t('form.noLimit')}
type='number' type='number'
value={field.value === -1 ? 0 : field.value} step={1}
value={field.value}
min={0} min={0}
onValueChange={(value) => { onValueChange={(value) => {
form.setValue(field.name, value); form.setValue(field.name, value);
@ -343,6 +345,7 @@ export default function SubscribeForm<T extends Record<string, any>>({
<EnhancedInput <EnhancedInput
placeholder={t('form.noLimit')} placeholder={t('form.noLimit')}
type='number' type='number'
step={1}
{...field} {...field}
onValueChange={(value) => { onValueChange={(value) => {
form.setValue(field.name, value); form.setValue(field.name, value);
@ -545,6 +548,7 @@ export default function SubscribeForm<T extends Record<string, any>>({
{ {
name: 'quantity', name: 'quantity',
type: 'number', type: 'number',
step: 1,
min: 1, min: 1,
suffix: unit_time && t(`form.${unit_time}`), suffix: unit_time && t(`form.${unit_time}`),
}, },
@ -569,7 +573,6 @@ export default function SubscribeForm<T extends Record<string, any>>({
name: 'price', name: 'price',
placeholder: t('form.discount_price'), placeholder: t('form.discount_price'),
type: 'number', type: 'number',
min: 0,
formatInput: (value) => unitConversion('centsToDollars', value), formatInput: (value) => unitConversion('centsToDollars', value),
formatOutput: (value) => unitConversion('dollarsToCents', value), formatOutput: (value) => unitConversion('dollarsToCents', value),
internal: true, internal: true,
@ -586,6 +589,7 @@ export default function SubscribeForm<T extends Record<string, any>>({
]} ]}
value={field.value} value={field.value}
onChange={(value) => { onChange={(value) => {
console.log(value);
form.setValue(field.name, value); form.setValue(field.name, value);
}} }}
/> />

12
packages/ui/src/custom-components/dynamic-Inputs.tsx
View File

@ -33,8 +33,16 @@ export function ObjectInput<T extends Record<string, any>>({
const [internalState, setInternalState] = useState<T>(value); const [internalState, setInternalState] = useState<T>(value);
useEffect(() => { useEffect(() => {
setInternalState(value); let updatedState = { ...internalState, ...value };
}, [value]);
fields.forEach((field) => {
if (field.calculateValue) {
updatedState = field.calculateValue(updatedState);
}
});
setInternalState(updatedState);
}, [value, fields]);
const updateField = (key: keyof T, fieldValue: string | number | boolean) => { const updateField = (key: keyof T, fieldValue: string | number | boolean) => {
let updatedInternalState = { ...internalState, [key]: fieldValue }; let updatedInternalState = { ...internalState, [key]: fieldValue };