berkahlandgroup.com

Kalkulator

0) {
$cicilan_perbulan = $plafon * ($margin_bulan * pow(1 + $margin_bulan, $tenor_bulan)) / (pow(1 + $margin_bulan, $tenor_bulan) – 1);
} else {
$cicilan_perbulan = $plafon / $tenor_bulan;
}
}

$min_inc_25 = $cicilan_perbulan / 0.25;
$min_inc_30 = $cicilan_perbulan / 0.30;
$min_inc_33 = $cicilan_perbulan / (1/3);
$min_inc_35 = $cicilan_perbulan / 0.35;

$show_result = true;
}

function format_rp($num) {
// Handling zero without decimals based on output
if ($num == 0) return “0”;
return “Rp ” . number_format($num, 2, ‘,’, ‘.’);
}
?>





Simulasi KPR Syariah


Simulasi KPR Syariah
Harga Rumah :
rupiah

Rp 500.000.000,00

Uang Muka :(DP)
%

(persen dari harga rumah)

Jangka Waktu :(Tenor)
tahun

= 120 bulan

Margin Bank :
% / tahun

= 0.69 % / bulan

Perhitungan Margin :


Harga Rumah :
Uang Muka
(DP)		 :
( %)
Jangka Waktu
(Tenor)		 : tahun
( bulan)
Margin Bank : % / tahun
( % / bulan)
Perhitungan Margin :
KPR Anda
Plafon Pinjaman
(Harga Rumah – Uang Muka)		 :
Angsuran per Periode :
Total Periode : bulan
Penghasilan Minimum per Bulan*
Untuk Angsuran 25% dari penghasilan :
Untuk Angsuran 30% dari penghasilan :
Untuk Angsuran 1/3 dari penghasilan :
Untuk Angsuran 35% dari penghasilan :

Tabel Angsuran

-1) $sisa_pinjaman = 0;

echo “

“;
echo “

“;
echo “

“;
echo “

“;
echo “

“;
echo “

“;
echo “

“;
}
?>

Bulan Angsuran Margin Angsuran Pokok Total Angsuran Sisa pinjaman
0 0 0 0
$i ” . format_rp($bunga_bulan_ini) . “ ” . format_rp($pokok_bulan_ini) . “ ” . format_rp($cicilan_perbulan) . “ ” . format_rp(abs($sisa_pinjaman)) . “ 


<?php
$show_result = false;
if ($_SERVER['REQUEST_METHOD'] == 'POST') {
    $harga_rumah = floatval($_POST['harga_rumah']);
    $dp_persen = floatval($_POST['dp_persen']);
    $tenor_tahun = intval($_POST['tenor_tahun']);
    $margin_tahun = floatval($_POST['margin_tahun']);
    $metode = $_POST['metode'];

    $dp_nominal = $harga_rumah * ($dp_persen / 100);
    $plafon = $harga_rumah - $dp_nominal;
    $tenor_bulan = $tenor_tahun * 12;
    $margin_bulan = ($margin_tahun / 100) / 12;

    if ($metode == 'flat') {
        $total_margin = $plafon * ($margin_tahun / 100) * $tenor_tahun;
        $cicilan_perbulan = ($plafon + $total_margin) / $tenor_bulan;
        $angsuran_pokok_tetap = $plafon / $tenor_bulan;
        $angsuran_margin_tetap = $total_margin / $tenor_bulan;
    } else { // anuitas
        if ($margin_bulan > 0) {
            $cicilan_perbulan = $plafon * ($margin_bulan * pow(1 + $margin_bulan, $tenor_bulan)) / (pow(1 + $margin_bulan, $tenor_bulan) - 1);
        } else {
            $cicilan_perbulan = $plafon / $tenor_bulan;
        }
    }

    $min_inc_25 = $cicilan_perbulan / 0.25;
    $min_inc_30 = $cicilan_perbulan / 0.30;
    $min_inc_33 = $cicilan_perbulan / (1/3);
    $min_inc_35 = $cicilan_perbulan / 0.35;

    $show_result = true;
}

function format_rp($num) {
    // Handling zero without decimals based on output
    if ($num == 0) return "0";
    return "Rp " . number_format($num, 2, ',', '.');
}
?>
<!DOCTYPE html>
<html lang="id">
<head>
    <meta charset="UTF-8">
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
    <title>Simulasi KPR Syariah</title>
    <style>
        body {
            font-family: Arial, sans-serif;
            background-color: #f0f0f0;
            padding: 20px;
        }
        .container {
            max-width: 900px;
            margin: auto;
        }
        .calculator-card {
            background-color: #fff;
            width: 100%;
            max-width: 500px;
            margin: 0 auto 30px auto;
            border-radius: 8px;
            box-shadow: 0 4px 8px rgba(0,0,0,0.1);
            overflow: hidden;
            border: 1px solid #ccc;
        }
        .card-header {
            background-color: #3b428b;
            color: white;
            padding: 15px 20px;
            font-size: 18px;
            font-weight: bold;
        }
        .form-body {
            padding: 20px;
            background-color: #f4f6fa;
        }
        .form-row {
            display: flex;
            margin-bottom: 15px;
            align-items: flex-start;
        }
        .form-label {
            width: 160px;
            text-align: right;
            padding-right: 15px;
            font-size: 15px;
            padding-top: 5px;
        }
        .form-label span.sub-label {
            display: block;
            color: #888;
            font-size: 13px;
        }
        .form-input-group {
            flex: 1;
        }
        .input-wrapper {
            display: flex;
            align-items: center;
        }
        .input-wrapper input[type="number"], .input-wrapper select {
            padding: 6px;
            border: 1px solid #aaa;
            border-radius: 3px;
            font-size: 14px;
        }
        .input-wrapper input[type="number"] {
            width: 120px;
        }
        .input-wrapper .suffix {
            margin-left: 10px;
            font-size: 14px;
        }
        .helper-text {
            color: #bfa35b;
            font-size: 13px;
            margin-top: 5px;
            display: block;
        }
        .helper-text.gray {
            color: #888;
        }
        .btn-submit {
            display: block;
            width: 100%;
            padding: 12px;
            background-color: #3b428b;
            color: white;
            border: none;
            font-size: 16px;
            cursor: pointer;
            border-radius: 4px;
            margin-top: 10px;
        }
        .btn-submit:hover {
            background-color: #2c326e;
        }

        /* Result Styles */
        .result-container {
            background: #fff;
            padding: 0;
            margin-top: 20px;
        }
        .result-table {
            width: 100%;
            border-collapse: collapse;
            font-size: 15px;
        }
        .result-table td {
            padding: 8px 12px;
            vertical-align: top;
        }
        .result-table tr:nth-child(odd) {
            background-color: #eef1f9;
        }
        .result-table tr:nth-child(even) {
            background-color: #fff;
        }
        .result-table td:first-child {
            text-align: right;
            width: 40%;
            padding-right: 15px;
        }
        .result-table td:nth-child(2) {
            width: 10px;
            text-align: center;
            padding: 8px 0;
        }
        .result-table td:last-child {
            text-align: left;
            padding-left: 15px;
        }
        .result-table small {
            color: #666;
            font-size: 13px;
        }

        .section-header {
            background-color: #3b428b;
            color: white;
            padding: 8px 15px;
            font-weight: bold;
            margin-top: 20px;
            margin-bottom: 0;
            font-size: 16px;
        }

        .amortization-table {
            width: 100%;
            border-collapse: collapse;
            font-family: Arial, sans-serif;
            font-size: 14px;
            margin-top: 10px;
        }
        .amortization-table th {
            background-color: #3b428b;
            color: white;
            padding: 8px;
            text-align: right;
            border: 1px solid #ccc;
        }
        .amortization-table th:first-child {
            text-align: center;
        }
        .amortization-table td {
            padding: 6px 10px;
            text-align: right;
            border: 1px solid #ddd;
        }
        .amortization-table td:first-child {
            text-align: center;
        }
        .amortization-table tr:nth-child(even) {
            background-color: #eef1f9;
        }
        .amortization-table tr:nth-child(odd) {
            background-color: #fff;
        }
    </style>
</head>
<body>

<div class="container">
    <div class="calculator-card">
        <div class="card-header">Simulasi KPR Syariah</div>
        <div class="form-body">
            <form method="POST" action="">
                <div class="form-row">
                    <div class="form-label">Harga Rumah :</div>
                    <div class="form-input-group">
                        <div class="input-wrapper">
                            <input type="number" name="harga_rumah" id="harga_rumah" value="<?= isset($_POST['harga_rumah']) ? $_POST['harga_rumah'] : '500000000' ?>" required oninput="updateHelpers()">
                            <span class="suffix">rupiah</span>
                        </div>
                        <span class="helper-text" id="helper_harga">Rp 500.000.000,00</span>
                    </div>
                </div>
                
                <div class="form-row">
                    <div class="form-label">Uang Muka :<span class="sub-label">(DP)</span></div>
                    <div class="form-input-group">
                        <div class="input-wrapper">
                            <input type="number" step="0.1" name="dp_persen" id="dp_persen" value="<?= isset($_POST['dp_persen']) ? $_POST['dp_persen'] : '30' ?>" style="width: 60px;" required>
                            <span class="suffix">%</span>
                        </div>
                        <span class="helper-text gray">(persen dari harga rumah)</span>
                    </div>
                </div>

                <div class="form-row">
                    <div class="form-label">Jangka Waktu :<span class="sub-label">(Tenor)</span></div>
                    <div class="form-input-group">
                        <div class="input-wrapper">
                            <input type="number" name="tenor_tahun" id="tenor_tahun" value="<?= isset($_POST['tenor_tahun']) ? $_POST['tenor_tahun'] : '10' ?>" style="width: 60px;" required oninput="updateHelpers()">
                            <span class="suffix">tahun</span>
                        </div>
                        <span class="helper-text" id="helper_tenor">= 120 bulan</span>
                    </div>
                </div>

                <div class="form-row">
                    <div class="form-label">Margin Bank :</div>
                    <div class="form-input-group">
                        <div class="input-wrapper">
                            <input type="number" step="0.01" name="margin_tahun" id="margin_tahun" value="<?= isset($_POST['margin_tahun']) ? $_POST['margin_tahun'] : '8.3' ?>" style="width: 60px;" required oninput="updateHelpers()">
                            <span class="suffix">% / tahun</span>
                        </div>
                        <span class="helper-text" id="helper_margin">= 0.69 % / bulan</span>
                    </div>
                </div>

                <div class="form-row">
                    <div class="form-label">Perhitungan Margin :</div>
                    <div class="form-input-group">
                        <div class="input-wrapper">
                            <select name="metode" id="metode" style="width: 150px;">
                                <option value="anuitas" <?= (isset($_POST['metode']) && $_POST['metode'] == 'anuitas') ? 'selected' : '' ?>>Anuitas</option>
                                <option value="flat" <?= (isset($_POST['metode']) && $_POST['metode'] == 'flat') ? 'selected' : '' ?>>Flat</option>
                            </select>
                        </div>
                    </div>
                </div>
                
                <button type="submit" class="btn-submit">Hitung</button>
            </form>
        </div>
    </div>

    <?php if ($show_result): ?>
    <div class="result-container">
        <table class="result-table">
            <tr>
                <td>Harga Rumah</td>
                <td>:</td>
                <td><?= format_rp($harga_rumah) ?></td>
            </tr>
            <tr>
                <td>Uang Muka<br><small>(DP)</small></td>
                <td>:</td>
                <td><?= format_rp($dp_nominal) ?><br><small>(<?= $dp_persen ?> %)</small></td>
            </tr>
            <tr>
                <td>Jangka Waktu<br><small>(Tenor)</small></td>
                <td>:</td>
                <td><?= $tenor_tahun ?> tahun<br><small>(<?= $tenor_bulan ?> bulan)</small></td>
            </tr>
            <tr>
                <td>Margin Bank</td>
                <td>:</td>
                <td><?= $margin_tahun ?> % / tahun<br><small>(<?= number_format($margin_tahun/12, 2, '.', '') ?> % / bulan)</small></td>
            </tr>
            <tr>
                <td>Perhitungan Margin</td>
                <td>:</td>
                <td><strong><?= ucfirst($metode) ?></strong></td>
            </tr>
        </table>

        <div class="section-header">KPR Anda</div>
        <table class="result-table">
            <tr>
                <td>Plafon Pinjaman<br><small>(Harga Rumah - Uang Muka)</small></td>
                <td>:</td>
                <td><?= format_rp($plafon) ?></td>
            </tr>
            <tr>
                <td>Angsuran per Periode</td>
                <td>:</td>
                <td><?= format_rp($cicilan_perbulan) ?></td>
            </tr>
            <tr>
                <td>Total Periode</td>
                <td>:</td>
                <td><?= $tenor_bulan ?> bulan</td>
            </tr>
        </table>

        <div class="section-header">Penghasilan Minimum per Bulan*</div>
        <table class="result-table">
            <tr>
                <td>Untuk Angsuran 25% dari penghasilan</td>
                <td>:</td>
                <td><?= format_rp($min_inc_25) ?></td>
            </tr>
            <tr>
                <td>Untuk Angsuran 30% dari penghasilan</td>
                <td>:</td>
                <td><?= format_rp($min_inc_30) ?></td>
            </tr>
            <tr>
                <td>Untuk Angsuran 1/3 dari penghasilan</td>
                <td>:</td>
                <td><?= format_rp($min_inc_33) ?></td>
            </tr>
            <tr>
                <td>Untuk Angsuran 35% dari penghasilan</td>
                <td>:</td>
                <td><?= format_rp($min_inc_35) ?></td>
            </tr>
        </table>

        <h3 style="margin-top: 30px; margin-bottom: 5px; font-weight: bold; font-family: 'Times New Roman', Times, serif; font-size: 18px;">Tabel Angsuran</h3>
        <table class="amortization-table">
            <tr>
                <th>Bulan</th>
                <th>Angsuran Margin</th>
                <th>Angsuran Pokok</th>
                <th>Total Angsuran</th>
                <th>Sisa pinjaman</th>
            </tr>
            <tr>
                <td>0</td>
                <td>0</td>
                <td>0</td>
                <td>0</td>
                <td><?= format_rp($plafon) ?></td>
            </tr>
            <?php
            $sisa_pinjaman = $plafon;
            for ($i = 1; $i <= $tenor_bulan; $i++) {
                if ($metode == 'flat') {
                    $bunga_bulan_ini = $angsuran_margin_tetap;
                    $pokok_bulan_ini = $angsuran_pokok_tetap;
                } else {
                    $bunga_bulan_ini = $sisa_pinjaman * $margin_bulan;
                    $pokok_bulan_ini = $cicilan_perbulan - $bunga_bulan_ini;
                }
                
                $sisa_pinjaman -= $pokok_bulan_ini;
                if ($sisa_pinjaman < 0 && $sisa_pinjaman > -1) $sisa_pinjaman = 0;
                
                echo "<tr>";
                echo "<td>$i</td>";
                echo "<td>" . format_rp($bunga_bulan_ini) . "</td>";
                echo "<td>" . format_rp($pokok_bulan_ini) . "</td>";
                echo "<td>" . format_rp($cicilan_perbulan) . "</td>";
                echo "<td>" . format_rp(abs($sisa_pinjaman)) . "</td>";
                echo "</tr>";
            }
            ?>
        </table>
    </div>
    <?php endif; ?>
</div>

<script>
    function updateHelpers() {
        const harga = document.getElementById('harga_rumah').value;
        const tenor = document.getElementById('tenor_tahun').value;
        const margin = document.getElementById('margin_tahun').value;

        if (harga) {
            let formatted = new Intl.NumberFormat('id-ID', { style: 'currency', currency: 'IDR' }).format(harga);
            document.getElementById('helper_harga').innerText = formatted;
        }

        if (tenor) {
            document.getElementById('helper_tenor').innerText = '= ' + (tenor * 12) + ' bulan';
        }

        if (margin) {
            let marginBulan = (margin / 12).toFixed(2);
            document.getElementById('helper_margin').innerText = '= ' + marginBulan + ' % / bulan';
        }
    }
    
    updateHelpers();
</script>

</body>
</html>