Add +-1000 spinner buttons to amount fields, floor (not round) to nearest 1000 in all allocation calculations
Deploy App / deploy (push) Successful in 45s
Deploy App / deploy (push) Successful in 45s
This commit is contained in:
@@ -2,6 +2,7 @@ import { NextRequest, NextResponse } from "next/server";
|
||||
import { z } from "zod";
|
||||
import { prisma } from "@/lib/db";
|
||||
import { computeSecurityYearlyValues } from "@/lib/calculations";
|
||||
import { floorToThousand } from "@/lib/format";
|
||||
|
||||
const transitionItemSchema = z.object({
|
||||
positionType: z.enum(["SECURITY", "REAL_ESTATE"]),
|
||||
@@ -132,6 +133,11 @@ export async function PUT(
|
||||
}
|
||||
}
|
||||
|
||||
// Auf ein Vielfaches von 1'000 abrunden, damit der Betrag ueber Wertschriften
|
||||
// (die nur in 1'000er-Schritten Sparbeitraege/Startwerte annehmen) vollstaendig
|
||||
// verteilbar bleibt.
|
||||
incomingCapital = floorToThousand(incomingCapital);
|
||||
|
||||
const transition = await prisma.$transaction(async (tx) => {
|
||||
await tx.phaseTransition.deleteMany({ where: { fromPhaseId: phaseId } });
|
||||
|
||||
|
||||
@@ -2,7 +2,7 @@
|
||||
|
||||
import { useState } from "react";
|
||||
import { InfoBubble } from "@/components/InfoBubble";
|
||||
import { formatChf, parseChfInput, roundToThousand } from "@/lib/format";
|
||||
import { floorToThousand, formatChf, parseChfInput } from "@/lib/format";
|
||||
|
||||
const baseInputClass =
|
||||
"w-full rounded-md border border-zinc-300 bg-white px-2 py-1.5 text-sm text-zinc-900 focus:border-zinc-500 focus:outline-none dark:border-zinc-600 dark:bg-zinc-900 dark:text-zinc-100";
|
||||
@@ -50,8 +50,9 @@ export function NumberField({
|
||||
}
|
||||
|
||||
// Roher Betrags-Input ohne Label (fuer kompakte Tabellenzellen o.ae.). Zeigt den Wert
|
||||
// formatiert mit 1'000er-Trennzeichen an, solange das Feld nicht fokussiert ist, und
|
||||
// rundet beim Verlassen des Feldes auf ein Vielfaches von 1'000 (siehe lib/format.ts).
|
||||
// formatiert mit 1'000er-Trennzeichen an, solange das Feld nicht fokussiert ist, rundet
|
||||
// beim Verlassen des Feldes auf ein Vielfaches von 1'000 ABwaerts (siehe lib/format.ts)
|
||||
// und bietet Pfeil-Buttons zum Erhoehen/Verringern in 1'000er-Schritten.
|
||||
export function MoneyInput({
|
||||
value,
|
||||
onChange,
|
||||
@@ -62,24 +63,52 @@ export function MoneyInput({
|
||||
className?: string;
|
||||
}) {
|
||||
const [focused, setFocused] = useState(false);
|
||||
const [text, setText] = useState(() => String(Math.round(value || 0)));
|
||||
const [text, setText] = useState(() => String(Math.floor(value || 0)));
|
||||
|
||||
function step(delta: number) {
|
||||
onChange(floorToThousand(value) + delta);
|
||||
}
|
||||
|
||||
return (
|
||||
<input
|
||||
type="text"
|
||||
inputMode="numeric"
|
||||
className={className ?? baseInputClass}
|
||||
value={focused ? text : formatChf(value)}
|
||||
onFocus={() => {
|
||||
setFocused(true);
|
||||
setText(String(Math.round(value || 0)));
|
||||
}}
|
||||
onChange={(e) => setText(e.target.value.replace(/[^0-9-]/g, ""))}
|
||||
onBlur={() => {
|
||||
setFocused(false);
|
||||
onChange(roundToThousand(parseChfInput(text)));
|
||||
}}
|
||||
/>
|
||||
<div className={`relative ${className ?? "w-full"}`}>
|
||||
<input
|
||||
type="text"
|
||||
inputMode="numeric"
|
||||
className={`${baseInputClass} w-full pr-6`}
|
||||
value={focused ? text : formatChf(value)}
|
||||
onFocus={() => {
|
||||
setFocused(true);
|
||||
setText(String(Math.floor(value || 0)));
|
||||
}}
|
||||
onChange={(e) => setText(e.target.value.replace(/[^0-9-]/g, ""))}
|
||||
onBlur={() => {
|
||||
setFocused(false);
|
||||
onChange(floorToThousand(parseChfInput(text)));
|
||||
}}
|
||||
/>
|
||||
<div className="absolute inset-y-0 right-0 flex w-5 flex-col overflow-hidden rounded-r-md border-l border-zinc-300 dark:border-zinc-600">
|
||||
<button
|
||||
type="button"
|
||||
tabIndex={-1}
|
||||
aria-label="Um 1'000 erhoehen"
|
||||
onMouseDown={(e) => e.preventDefault()}
|
||||
onClick={() => step(1000)}
|
||||
className="flex flex-1 items-center justify-center text-[8px] leading-none text-zinc-500 hover:bg-zinc-100 dark:text-zinc-400 dark:hover:bg-zinc-800"
|
||||
>
|
||||
▲
|
||||
</button>
|
||||
<button
|
||||
type="button"
|
||||
tabIndex={-1}
|
||||
aria-label="Um 1'000 verringern"
|
||||
onMouseDown={(e) => e.preventDefault()}
|
||||
onClick={() => step(-1000)}
|
||||
className="flex flex-1 items-center justify-center border-t border-zinc-300 text-[8px] leading-none text-zinc-500 hover:bg-zinc-100 dark:border-zinc-600 dark:text-zinc-400 dark:hover:bg-zinc-800"
|
||||
>
|
||||
▼
|
||||
</button>
|
||||
</div>
|
||||
</div>
|
||||
);
|
||||
}
|
||||
|
||||
|
||||
@@ -3,7 +3,7 @@
|
||||
import { useEffect, useState } from "react";
|
||||
import { MoneyInput } from "@/components/FormField";
|
||||
import { api } from "@/lib/api-client";
|
||||
import { formatChf } from "@/lib/format";
|
||||
import { floorToThousand, formatChf } from "@/lib/format";
|
||||
import type { PhaseInput, TransitionDecision } from "@/lib/types";
|
||||
import type { PhaseComputed } from "@/lib/calculations";
|
||||
|
||||
@@ -106,19 +106,21 @@ export function TransitionPanel({
|
||||
);
|
||||
}
|
||||
|
||||
const totalAvailableCapital = items.reduce((sum, it) => {
|
||||
if (it.positionType === "SECURITY") {
|
||||
const totalAvailableCapital = floorToThousand(
|
||||
items.reduce((sum, it) => {
|
||||
if (it.positionType === "SECURITY") {
|
||||
if (it.decision === "CARRY_OVER") return sum;
|
||||
const gain = Math.max(0, it.carryOverValue - it.originalValue);
|
||||
const tax = gain * (it.saleTaxRate / 100);
|
||||
return sum + (it.carryOverValue - tax);
|
||||
}
|
||||
if (it.decision === "CARRY_OVER") return sum;
|
||||
const gain = Math.max(0, it.carryOverValue - it.originalValue);
|
||||
const salePrice = it.salePrice ?? 0;
|
||||
const gain = Math.max(0, salePrice - it.originalValue);
|
||||
const tax = gain * (it.saleTaxRate / 100);
|
||||
return sum + (it.carryOverValue - tax);
|
||||
}
|
||||
if (it.decision === "CARRY_OVER") return sum;
|
||||
const salePrice = it.salePrice ?? 0;
|
||||
const gain = Math.max(0, salePrice - it.originalValue);
|
||||
const tax = gain * (it.saleTaxRate / 100);
|
||||
return sum + (salePrice - tax);
|
||||
}, 0);
|
||||
return sum + (salePrice - tax);
|
||||
}, 0)
|
||||
);
|
||||
|
||||
async function handleSave() {
|
||||
setSaving(true);
|
||||
@@ -181,7 +183,7 @@ export function TransitionPanel({
|
||||
<td className="py-2">
|
||||
{it.positionType === "REAL_ESTATE" && it.decision === "SELL" ? (
|
||||
<MoneyInput
|
||||
className="w-32 rounded-md border border-zinc-300 bg-white px-2 py-1 text-xs dark:border-zinc-600 dark:bg-zinc-900"
|
||||
className="w-32"
|
||||
value={it.salePrice ?? 0}
|
||||
onChange={(v) =>
|
||||
setItems((prev) => prev.map((x, idx) => (idx === i ? { ...x, salePrice: v } : x)))
|
||||
|
||||
+6
-4
@@ -10,10 +10,12 @@ export function formatChf(value: number): string {
|
||||
return sign + withSeparators;
|
||||
}
|
||||
|
||||
// Rundet auf ein Vielfaches von 1'000 -- Betraege unter 1'000 CHF sind fuer dieses
|
||||
// Planungstool nicht relevant.
|
||||
export function roundToThousand(value: number): number {
|
||||
return Math.round((value || 0) / 1000) * 1000;
|
||||
// Rundet ABwaerts auf ein Vielfaches von 1'000. Bewusst floor statt round: Betraege wie
|
||||
// z. B. eine verfuegbare Sparquote von 1'450 CHF liessen sich sonst nicht vollstaendig
|
||||
// auf Wertschriften verteilen (nur 1'000er-Schritte moeglich) -- durch Abrunden bleibt
|
||||
// der angezeigte/verplanbare Betrag immer tatsaechlich erreichbar.
|
||||
export function floorToThousand(value: number): number {
|
||||
return Math.floor((value || 0) / 1000) * 1000;
|
||||
}
|
||||
|
||||
export function parseChfInput(text: string): number {
|
||||
|
||||
Reference in New Issue
Block a user