חיפוש
סגור את תיבת החיפוש
חיפוש
סגור את תיבת החיפוש
				
					console.log( 'Code is Poetry' );
import React, { useState } from 'react';
import { Card, CardHeader, CardContent } from '@/components/ui/card';
import { Input } from '@/components/ui/input';
import { Button } from '@/components/ui/button';
import { RadioGroup, RadioGroupItem } from '@/components/ui/radio-group';
import { Label } from '@/components/ui/label';
import { Tabs, TabsList, TabsTrigger, TabsContent } from '@/components/ui/tabs';

const RealEstateCalculator = () => {
  const VAT_RATE = 0.17;
  
  const [apartmentData, setApartmentData] = useState({
    price: 0,
    isFirstApartment: true,
    brokerFee: 2,
    lawyerFee: 0.5,
    advisorFee: 0.5,
    renovationCost: 0,
    includeRenovation: false
  });

  // פונקציה לפורמוט מספרים לפורמט מטבע
  const formatCurrency = (amount) => {
    return new Intl.NumberFormat('he-IL', {
      style: 'currency',
      currency: 'ILS',
      maximumFractionDigits: 0
    }).format(amount);
  };

  // חישוב מס רכישה
  const calculatePurchaseTax = (price, isFirstApartment) => {
    if (isFirstApartment) {
      if (price <= 1_748_470) return 0;
      if (price <= 2_073_560) return (price - 1_748_470) * 0.035;
      return (2_073_560 - 1_748_470) * 0.035 + (price - 2_073_560) * 0.05;
    } else {
      if (price <= 5_486_445) return price * 0.08;
      return price * 0.10;
    }
  };

  // חישוב עמלת תיווך כולל מע"מ
  const calculateBrokerFee = (price, percentage) => {
    const baseAmount = (price * percentage) / 100;
    return {
      base: baseAmount,
      vat: baseAmount * VAT_RATE,
      total: baseAmount * (1 + VAT_RATE)
    };
  };

  // חישוב שכר טרחת עו"ד
  const calculateLawyerFee = (price, percentage) => {
    const baseAmount = Math.max((price * percentage) / 100, 5000);
    return {
      base: baseAmount,
      vat: baseAmount * VAT_RATE,
      total: baseAmount * (1 + VAT_RATE)
    };
  };

  // חישוב עמלת יועץ השקעות
  const calculateAdvisorFee = (price, percentage) => {
    const baseAmount = (price * percentage) / 100;
    return {
      base: baseAmount,
      vat: baseAmount * VAT_RATE,
      total: baseAmount * (1 + VAT_RATE)
    };
  };

  // חישוב עלות שיפוץ כולל מע"מ
  const calculateRenovationCost = (amount) => {
    return {
      base: amount,
      vat: amount * VAT_RATE,
      total: amount * (1 + VAT_RATE)
    };
  };

  // חישוב כל העלויות
  const calculateTotalCosts = () => {
    const propertyPrice = apartmentData.price;
    const purchaseTax = calculatePurchaseTax(propertyPrice, apartmentData.isFirstApartment);
    const brokerFee = calculateBrokerFee(propertyPrice, apartmentData.brokerFee);
    const lawyerFee = calculateLawyerFee(propertyPrice, apartmentData.lawyerFee);
    const investmentAdvisorFee = calculateAdvisorFee(propertyPrice, apartmentData.advisorFee);
    const renovation = calculateRenovationCost(apartmentData.renovationCost);

    const total = propertyPrice + 
                 purchaseTax + 
                 brokerFee.total + 
                 lawyerFee.total + 
                 investmentAdvisorFee.total +
                 (apartmentData.includeRenovation ? renovation.total : 0);

    return {
      propertyPrice,
      purchaseTax,
      brokerFee,
      lawyerFee,
      investmentAdvisorFee,
      renovation,
      total
    };
  };

  const CostBreakdown = () => {
    const costs = calculateTotalCosts();
    return (
      <div className="mt-4 overflow-x-auto">
        <table className="w-full border-collapse">
          <thead>
            <tr className="bg-gray-100">
              <th className="text-right p-2 border">סעיף</th>
              <th className="text-right p-2 border">סכום לפני מע"מ</th>
              <th className="text-right p-2 border">מע"מ</th>
              <th className="text-right p-2 border">סה"כ כולל מע"מ</th>
            </tr>
          </thead>
          <tbody>
            <tr>
              <td className="p-2 border">מחיר דירה</td>
              <td className="p-2 border">{formatCurrency(costs.propertyPrice)}</td>
              <td className="p-2 border">-</td>
              <td className="p-2 border">{formatCurrency(costs.propertyPrice)}</td>
            </tr>
            <tr>
              <td className="p-2 border">מס רכישה</td>
              <td className="p-2 border">{formatCurrency(costs.purchaseTax)}</td>
              <td className="p-2 border">-</td>
              <td className="p-2 border">{formatCurrency(costs.purchaseTax)}</td>
            </tr>
            <tr>
              <td className="p-2 border">תיווך</td>
              <td className="p-2 border">{formatCurrency(costs.brokerFee.base)}</td>
              <td className="p-2 border">{formatCurrency(costs.brokerFee.vat)}</td>
              <td className="p-2 border">{formatCurrency(costs.brokerFee.total)}</td>
            </tr>
            <tr>
              <td className="p-2 border">עו"ד</td>
              <td className="p-2 border">{formatCurrency(costs.lawyerFee.base)}</td>
              <td className="p-2 border">{formatCurrency(costs.lawyerFee.vat)}</td>
              <td className="p-2 border">{formatCurrency(costs.lawyerFee.total)}</td>
            </tr>
            <tr>
              <td className="p-2 border">יועץ השקעות</td>
              <td className="p-2 border">{formatCurrency(costs.investmentAdvisorFee.base)}</td>
              <td className="p-2 border">{formatCurrency(costs.investmentAdvisorFee.vat)}</td>
              <td className="p-2 border">{formatCurrency(costs.investmentAdvisorFee.total)}</td>
            </tr>
            {apartmentData.includeRenovation && (
              <tr>
                <td className="p-2 border">שיפוץ</td>
                <td className="p-2 border">{formatCurrency(costs.renovation.base)}</td>
                <td className="p-2 border">{formatCurrency(costs.renovation.vat)}</td>
                <td className="p-2 border">{formatCurrency(costs.renovation.total)}</td>
              </tr>
            )}
            <tr className="font-bold bg-gray-50">
              <td className="p-2 border">סה"כ</td>
              <td className="p-2 border">-</td>
              <td className="p-2 border">-</td>
              <td className="p-2 border">{formatCurrency(costs.total)}</td>
            </tr>
          </tbody>
        </table>
      </div>
    );
  };

  return (
    <div className="w-full max-w-4xl mx-auto p-4">
      <Card>
        <CardHeader className="text-right">
          <h1 className="text-2xl font-bold">מחשבון עלויות רכישת דירה</h1>
        </CardHeader>
        <CardContent>
          <Tabs defaultValue="costs">
            <TabsList className="grid w-full grid-cols-2">
              <TabsTrigger value="costs">חישוב עלויות</TabsTrigger>
              <TabsTrigger value="mortgage">חישוב משכנתה</TabsTrigger>
            </TabsList>

            <TabsContent value="costs" className="space-y-4">
              <div className="space-y-4">
                <div>
                  <Label>מחיר הדירה</Label>
                  <Input 
                    type="number" 
                    value={apartmentData.price}
                    onChange={(e) => setApartmentData({
                      ...apartmentData,
                      price: Number(e.target.value)
                    })}
                    className="text-right"
                  />
                </div>

                <RadioGroup 
                  value={apartmentData.isFirstApartment.toString()}
                  onValueChange={(value) => setApartmentData({
                    ...apartmentData,
                    isFirstApartment: value === 'true'
                  })}
                >
                  <div className="flex items-center space-x-2">
                    <RadioGroupItem value="true" id="first" />
                    <Label htmlFor="first">דירה ראשונה</Label>
                  </div>
                  <div className="flex items-center space-x-2">
                    <RadioGroupItem value="false" id="second" />
                    <Label htmlFor="second">דירה נוספת</Label>
                  </div>
                </RadioGroup>

                <div className="space-y-2">
                  <Label>עמלת תיווך (%)</Label>
                  <Input 
                    type="number" 
                    value={apartmentData.brokerFee}
                    onChange={(e) => setApartmentData({
                      ...apartmentData,
                      brokerFee: Number(e.target.value)
                    })}
                    className="text-right"
                  />
                </div>

                <div className="space-y-2">
                  <Label>שכר טרחת עו"ד (%)</Label>
                  <Input 
                    type="number" 
                    value={apartmentData.lawyerFee}
                    onChange={(e) => setApartmentData({
                      ...apartmentData,
                      lawyerFee: Number(e.target.value)
                    })}
                    className="text-right"
                  />
                </div>

                <div className="space-y-2">
                  <Label>עמלת יועץ השקעות (%)</Label>
                  <Input 
                    type="number" 
                    value={apartmentData.advisorFee}
                    onChange={(e) => setApartmentData({
                      ...apartmentData,
                      advisorFee: Number(e.target.value)
                    })}
                    className="text-right"
                  />
                </div>

                <div className="space-y-2">
                  <div className="flex items-center space-x-2">
                    <input
                      type="checkbox"
                      checked={apartmentData.includeRenovation}
                      onChange={(e) => setApartmentData({
                        ...apartmentData,
                        includeRenovation: e.target.checked
                      })}
                      className="ml-2"
                    />
                    <Label>כלול עלות שיפוץ</Label>
                  </div>
                  {apartmentData.includeRenovation && (
                    <Input 
                      type="number" 
                      value={apartmentData.renovationCost}
                      onChange={(e) => setApartmentData({
                        ...apartmentData,
                        renovationCost: Number(e.target.value)
                      })}
                      className="text-right"
                      placeholder="הכנס עלות שיפוץ משוערת"
                    />
                  )}
                </div>

                <CostBreakdown />

              </div>
            </TabsContent>

            <TabsContent value="mortgage">
              <div className="p-4 text-center text-gray-500">
                חלק זה בפיתוח - יתווסף בקרוב
              </div>
            </TabsContent>
          </Tabs>
        </CardContent>
      </Card>
    </div>
  );
};

export default RealEstateCalculator;