Add more rent info
This commit is contained in:
@@ -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>
|
||||
|
||||
@@ -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)
|
||||
|
||||
@@ -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} m²)</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 €/m²), den Nebenkosten (1,20 €/m²) 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 €/m²), den Nebenkosten (1,20 €/m²) 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>
|
||||
|
||||
Reference in New Issue
Block a user