Add more rent info

This commit is contained in:
Niklas Meinzer
2024-09-29 09:45:09 +02:00
parent 55572f71c4
commit ee8a1e3ffb
3 changed files with 41 additions and 12 deletions

View File

@@ -23,6 +23,7 @@ function App() {
const [selectedFlat, setSelectedFlat] = useState();
const [selectedRoom, setSelectedRoom] = useState();
const [numAdults, setNumAdults] = useState(1);
const [rent, setRent] = useState(0);
@@ -73,8 +74,8 @@ function App() {
<Heading>Wohnung</Heading>
<Box></Box>
<FlatSelectionCard setSelectedFlat={setSelectedFlat} onRoomSelected={setSelectedRoom} />
<FlatDetailsCard flat={selectedFlat} room={selectedRoom} />
<FlatSelectionCard setSelectedFlat={setSelectedFlat} onRoomSelected={setSelectedRoom} onNumAdultsSelected={setNumAdults} />
<FlatDetailsCard flat={selectedFlat} room={selectedRoom} numAdults={numAdults} />
<Heading>Selbsteinschätzung</Heading>
<Box></Box>

View File

@@ -59,7 +59,7 @@ class Room {
export const flatData = {
"north": {
0: [
new Flat("W 0.1", 4, 84.834, false, false, [
new Flat("W 0.1 (WG)", 4, 84.834, false, false, [
new Room("0.1 02", 12.523), new Room("0.1 03", 12.102), new Room("0.1 04", 14.746)
]),
new Flat("W 0.2", 2, 53.453, true),
@@ -68,21 +68,21 @@ export const flatData = {
1: [
new Flat("W 1.1", 4, 84.794, true),
new Flat("W 1.2", 1, 36.469, true),
new Flat("W 1.3", 4, 63.128, true, false, [
new Flat("W 1.3 (WG)", 4, 63.128, true, false, [
new Room("1.3 02", 11.434), new Room("1.3 03", 11.245), new Room("1.3 04", 11.77)
])
],
2: [
new Flat("W 2.1", 4, 84.794, true),
new Flat("W 2.2", 2, 46.261, true),
new Flat("W 2.3", 5, 154.196, true, true, [
new Flat("W 2.3 (Cluster)", 5, 154.196, true, true, [
new Room("1 Person", 28.774), new Room("2 Personen", 46.32, 2), new Room("1 Person (rollstuhlgerecht)", 41.814)
]),
new Flat("W 2.4", 2, 64.265, true, true)
],
3: [
new Flat("W 3.1", 4, 84.794),
new Flat("W 3.2", 5, 154.97, true, true, [
new Flat("W 3.2 (Cluster)", 5, 154.97, true, true, [
new Room("1 Person", 28.531), new Room("2 Personen", 47.146, 2), new Room("1 Person (rollstuhlgerecht)", 44.036)
]),
new Flat("W 3.3", 3, 63.128, true)

View File

@@ -27,7 +27,7 @@ import {
import { flatData, minRent, maxRent } from './Data';
export function FlatSelectionCard({ setSelectedFlat, onRoomSelected }) {
export function FlatSelectionCard({ setSelectedFlat, onRoomSelected, onNumAdultsSelected }) {
const [levelOptions, setLevelOption] = useState([{ value: 0, label: "EG" }, { value: 1, label: "1. OG" }, { value: 2, label: "2. OG" }, { value: 3, label: "3. OG" }]);
const [flatOptions, setFlatOptions] = useState([]);
const [roomOptions, setRoomOptions] = useState([]);
@@ -64,6 +64,9 @@ export function FlatSelectionCard({ setSelectedFlat, onRoomSelected }) {
onRoomSelected(roomOptions[e.target.value]);
}
function numAdultsSelected(e) {
onNumAdultsSelected(e.target.value);
}
return <Card>
<CardHeader>
<Heading size='md'>Wohnungsauswahl</Heading>
@@ -83,22 +86,29 @@ export function FlatSelectionCard({ setSelectedFlat, onRoomSelected }) {
{roomOptions.length > 0 ? (<Select placeholder='Zimmer auswählen' onChange={roomSelected}>
{roomOptions.map((room, index) => <option value={index} >{room.print()} ({room.size} )</option>)}
</Select>) : null}
<Select placeholder='Anzahl Erwachsene' onChange={numAdultsSelected}>
<option value="1">1 erwachsene Person</option>
<option value="2">2 erwachsene Personen</option>
</Select>
</Stack>
</CardBody>
</Card>
</Card >
}
export function FlatDetailsCard({ flat, room }) {
export function FlatDetailsCard({ flat, room, numAdults }) {
var body = <CardBody>
Bitte auswählen
</CardBody>;
var badges = "";
var kitchenCost = 50;
var commonAreaShare = 60 * numAdults;
if (flat && (room || flat.wgRoomList.length === 0)) {
var sizePrivate = flat.sizePrivate;
if (room) {
sizePrivate = room.size;
kitchenCost = kitchenCost / flat.wgRoomList.length;
}
var sizeSharedBox = null;
@@ -155,9 +165,27 @@ export function FlatDetailsCard({ flat, room }) {
<Heading size='xs' textTransform='uppercase'>
Mindestmiete
</Heading>
<Text fontSize="xs">Die Mindestmiete ergibt sich aus dem WBS Satz für die private Fläche (4,45 /), den Nebenkosten (1,20 /) und der Küchen-Nutzungspauschale von 50 pro Küche</Text>
<Text pt='2' fontSize='m' fontWeight='bold'>
{((sizePrivate + internalAreaShare) * minRent + 50).toFixed(2)}
<Text fontSize="xs">Die Mindestmiete ergibt sich aus dem WBS Satz für die private Fläche (4,45 /), den Nebenkosten (1,20 /) und der Küchen-Nutzungspauschale von 50 pro Küche (in Clustern und WGs auf Parteien aufgeteilt)</Text>
<Text pt='2' fontSize='xl' fontWeight='bold'>
{((sizePrivate + internalAreaShare) * minRent + kitchenCost).toFixed(2)}
</Text>
</Box>
<Box>
<Heading size='xs' textTransform='uppercase'>
Deckungsmiete WBS
</Heading>
<Text fontSize="xs">Die Deckungsmiete beinhaltet einen Beitrag von 60 pro erwachsener Person für die Gemeinschaftsflächen</Text>
<Text pt='2' fontSize='xl' fontWeight='bold'>
{((sizePrivate + internalAreaShare) * minRent + kitchenCost + commonAreaShare).toFixed(2)}
</Text>
</Box>
<Box>
<Heading size='xs' textTransform='uppercase'>
Deckungsmiete freifinanziert {flat.isWbs ? "(zum Vergleich)" : ""}
</Heading>
<Text fontSize="xs">Das ist die Miete, die für diese Wohnung ohne solidarischen Ausgleich anfallen würde{flat.isWbs ? ", wenn Sie frei finanziert wäre." : "."}</Text>
<Text pt='2' fontSize='xl' fontWeight='bold'>
{((sizePrivate + internalAreaShare) * maxRent + kitchenCost + commonAreaShare).toFixed(2)}
</Text>
</Box>
</Stack>