Tugas Individu : Belajar Membuat Kalkulator Hitungan Menggunakan Pilihan " Case " di PHP

 Tugas Individu Kelas X PPLG1-2
 Belajar Membuat Kalkulator Hitungan Menggunakan Pilihan " Case " di PHP

Silahkan Buat dan ikuti Program kalkulator_fisika_mtk.php di bawah ini !

>> Fitur Utama
- Menu pilihan untuk 4 jenis perhitungan
​- Input otomatis berubah sesuai pilihan
​- Validasi nilai (tidak boleh kurang dari atau sama dengan 0)
​- Tampilan hasil yang jelas (dengan warna berbeda untuk error)
​- Responsif untuk perangkat mobile
​- Tampilan bersih dan mudah dipahami

>> Hasil Program

Tampilan Jika di input angka NOL ( 0 )
 
>> Program:
kalkulator_fisika_mtk.php

>> coding program :
<?php
// Inisialisasi variabel hasil
$hasil = '';
$jenis_perhitungan = '';

// Proses perhitungan jika form disubmit
if (isset($_POST['hitung'])) {
    $jenis_perhitungan = $_POST['jenis_perhitungan'];
    
    switch ($jenis_perhitungan) {
        // Luas Segitiga (L = 1/2 × alas × tinggi)
        case 'luas_segitiga':
            $alas = $_POST['alas'] ?? 0;
            $tinggi = $_POST['tinggi'] ?? 0;
            if ($alas > 0 && $tinggi > 0) {
                $luas = 0.5 * $alas * $tinggi;
                $hasil = "Luas Segitiga = 1/2 × $alas × $tinggi = $luas satuan luas";
            } else {
                $hasil = "Error: Nilai alas dan tinggi harus lebih besar dari 0!";
            }
            break;
        
        // Luas Persegi Panjang (L = panjang × lebar)
        case 'luas_persegi_panjang':
            $panjang = $_POST['panjang'] ?? 0;
            $lebar = $_POST['lebar'] ?? 0;
            if ($panjang > 0 && $lebar > 0) {
                $luas = $panjang * $lebar;
                $hasil = "Luas Persegi Panjang = $panjang × $lebar = $luas satuan luas";
            } else {
                $hasil = "Error: Nilai panjang dan lebar harus lebih besar dari 0!";
            }
            break;
        
        // Kecepatan (v = jarak / waktu)
        case 'kecepatan':
            $jarak = $_POST['jarak'] ?? 0;
            $waktu = $_POST['waktu'] ?? 0;
            if ($jarak > 0 && $waktu > 0) {
                $kecepatan = $jarak / $waktu;
                $hasil = "Kecepatan = $jarak / $waktu = $kecepatan satuan kecepatan (misal: m/s atau km/jam)";
            } else {
                $hasil = "Error: Nilai jarak dan waktu harus lebih besar dari 0!";
            }
            break;
        
        // Tegangan Listrik (V = arus × hambatan)
        case 'tegangan_listrik':
            $arus = $_POST['arus'] ?? 0;
            $hambatan = $_POST['hambatan'] ?? 0;
            if ($arus > 0 && $hambatan > 0) {
                $tegangan = $arus * $hambatan;
                $hasil = "Tegangan Listrik = $arus × $hambatan = $tegangan Volt";
            } else {
                $hasil = "Error: Nilai arus dan hambatan harus lebih besar dari 0!";
            }
            break;
        
        default:
            $hasil = "Pilih jenis perhitungan terlebih dahulu!";
            break;
    }
}
?>

<!DOCTYPE html>
<html lang="id">
<head>
    <meta charset="UTF-8">
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
    <title>Kalkulator Matematika & Fisika</title>
    <style>
        * {
            margin: 0;
            padding: 0;
            box-sizing: border-box;
            font-family: Arial, sans-serif;
        }

        body {
            background-color: #f0f4f8;
            padding: 20px;
        }

        .container {
            max-width: 600px;
            margin: 30px auto;
            background: white;
            padding: 30px;
            border-radius: 10px;
            box-shadow: 0 2px 15px rgba(0,0,0,0.1);
        }

        h1 {
            color: #2d3748;
            text-align: center;
            margin-bottom: 25px;
            border-bottom: 2px solid #3182ce;
            padding-bottom: 10px;
        }

        .form-group {
            margin-bottom: 15px;
        }

        label {
            display: block;
            margin-bottom: 5px;
            font-weight: bold;
            color: #4a5568;
        }

        select, input[type="number"] {
            width: 100%;
            padding: 10px;
            border: 1px solid #cbd5e0;
            border-radius: 5px;
            font-size: 16px;
        }

        button {
            background-color: #3182ce;
            color: white;
            border: none;
            padding: 12px 20px;
            border-radius: 5px;
            font-size: 16px;
            cursor: pointer;
            width: 100%;
            margin-top: 10px;
        }

        button:hover {
            background-color: #2b6cb0;
        }

        .input-section {
            margin: 20px 0;
            padding: 15px;
            border: 1px dashed #3182ce;
            border-radius: 5px;
            display: <?= $jenis_perhitungan ? 'block' : 'none' ?>;
        }

        .hasil {
            margin-top: 20px;
            padding: 15px;
            border-radius: 5px;
            background-color: #e2e8f0;
            font-size: 18px;
            font-weight: bold;
            text-align: center;
            color: #2d3748;
        }

        .error {
            background-color: #fed7d7;
            color: #c53030;
        }
    </style>
    <script>
        // Tampilkan input sesuai pilihan perhitungan
        function tampilkanInput() {
            const pilihan = document.getElementById('jenis_perhitungan').value;
            const inputSection = document.querySelector('.input-section');
            
            // Kosongkan input sebelumnya
            inputSection.innerHTML = '';
            
            if (pilihan) {
                inputSection.style.display = 'block';
                
                switch (pilihan) {
                    case 'luas_segitiga':
                        inputSection.innerHTML = `
                            <div class="form-group">
                                <label>Alas Segitiga:</label>
                                <input type="number" name="alas" step="any" required>
                            </div>
                            <div class="form-group">
                                <label>Tinggi Segitiga:</label>
                                <input type="number" name="tinggi" step="any" required>
                            </div>
                        `;
                        break;
                    case 'luas_persegi_panjang':
                        inputSection.innerHTML = `
                            <div class="form-group">
                                <label>Panjang:</label>
                                <input type="number" name="panjang" step="any" required>
                            </div>
                            <div class="form-group">
                                <label>Lebar:</label>
                                <input type="number" name="lebar" step="any" required>
                            </div>
                        `;
                        break;
                    case 'kecepatan':
                        inputSection.innerHTML = `
                            <div class="form-group">
                                <label>Jarak:</label>
                                <input type="number" name="jarak" step="any" required>
                            </div>
                            <div class="form-group">
                                <label>Waktu:</label>
                                <input type="number" name="waktu" step="any" required>
                            </div>
                        `;
                        break;
                    case 'tegangan_listrik':
                        inputSection.innerHTML = `
                            <div class="form-group">
                                <label>Arus Listrik (Ampere):</label>
                                <input type="number" name="arus" step="any" required>
                            </div>
                            <div class="form-group">
                                <label>Hambatan (Ohm):</label>
                                <input type="number" name="hambatan" step="any" required>
                            </div>
                        `;
                        break;
                }
            } else {
                inputSection.style.display = 'none';
            }
        }
    </script>
</head>
<body>
    <div class="container">
        <h1>Kalkulator Matematika & Fisika</h1>
        
        <form method="POST" onsubmit="return true">
            <div class="form-group">
                <label>Pilih Jenis Perhitungan:</label>
                <select id="jenis_perhitungan" name="jenis_perhitungan" onchange="tampilkanInput()" required>
                    <option value="">-- Pilih Opsi --</option>
                    <option value="luas_segitiga" <?= $jenis_perhitungan == 'luas_segitiga' ? 'selected' : '' ?>>Luas Segitiga</option>
                    <option value="luas_persegi_panjang" <?= $jenis_perhitungan == 'luas_persegi_panjang' ? 'selected' : '' ?>>Luas Persegi Panjang</option>
                    <option value="kecepatan" <?= $jenis_perhitungan == 'kecepatan' ? 'selected' : '' ?>>Kecepatan</option>
                    <option value="tegangan_listrik" <?= $jenis_perhitungan == 'tegangan_listrik' ? 'selected' : '' ?>>Tegangan Listrik</option>
                </select>
            </div>
            
            <!-- Bagian Input yang Berubah Sesuai Pilihan -->
            <div class="input-section">
                <?php
                // Tampilkan input jika sudah ada pilihan sebelumnya
                if ($jenis_perhitungan) {
                    switch ($jenis_perhitungan) {
                        case 'luas_segitiga':
                            echo '<div class="form-group"><label>Alas Segitiga:</label><input type="number" name="alas" step="any" value="' . ($_POST['alas'] ?? '') . '" required></div>';
                            echo '<div class="form-group"><label>Tinggi Segitiga:</label><input type="number" name="tinggi" step="any" value="' . ($_POST['tinggi'] ?? '') . '" required></div>';
                            break;
                        case 'luas_persegi_panjang':
                            echo '<div class="form-group"><label>Panjang:</label><input type="number" name="panjang" step="any" value="' . ($_POST['panjang'] ?? '') . '" required></div>';
                            echo '<div class="form-group"><label>Lebar:</label><input type="number" name="lebar" step="any" value="' . ($_POST['lebar'] ?? '') . '" required></div>';
                            break;
                        case 'kecepatan':
                            echo '<div class="form-group"><label>Jarak:</label><input type="number" name="jarak" step="any" value="' . ($_POST['jarak'] ?? '') . '" required></div>';
                            echo '<div class="form-group"><label>Waktu:</label><input type="number" name="waktu" step="any" value="' . ($_POST['waktu'] ?? '') . '" required></div>';
                            break;
                        case 'tegangan_listrik':
                            echo '<div class="form-group"><label>Arus Listrik (Ampere):</label><input type="number" name="arus" step="any" value="' . ($_POST['arus'] ?? '') . '" required></div>';
                            echo '<div class="form-group"><label>Hambatan (Ohm):</label><input type="number" name="hambatan" step="any" value="' . ($_POST['hambatan'] ?? '') . '" required></div>';
                            break;
                    }
                }
                ?>
            </div>
            
            <button type="submit" name="hitung">Hitung</button>
        </form>
        
        <!-- Tampilkan Hasil Perhitungan -->
        <?php if ($hasil) : ?>
            <div class="hasil <?= strpos($hasil, 'Error') !== false ? 'error' : '' ?>">
                <?= $hasil ?>
            </div>
        <?php endif; ?>
    </div>
</body>
</html>

>> Eksplorasi
- Silahkan ditambahkan Menu pilihannya (---Pilih Opsi---), yang semula 4 Jenis Perhitungan menjadi 8 Jenis Perhitungan Menu Pilihan, dengan ketentuan mencari Jenis Perhitungannya, bebas (misal : luas lingkaran atau yang lainnya).
- Bubuhkan nama sendiri pada tampilan teks berjalan warna merah dibagian footer.
SELAMAT MENGERJAKAN DAN TETAP SEMANGAT !!






Komentar

Posting Komentar

Postingan populer dari blog ini

Tugas Membuat, Menelusuri dan memperbaiki BUG (Implementasi QA : "Quality Assurance")

Gambar
Tugas Kelas X PPLG1 dan X PPLG2 SMKN 2 Bandung.   Membuat, Menelusuri dan memperbaiki BUG (Implementasi QA : "Quality Assurance") Catatan : - Tugas dikerjakan secara kelompok (5 orang/kelompok), silahkan dibentuk kelompoknya dipimpin oleh KM. Cantumkan nama anggota kelompoknya di komentar, dengan format :  [Kelas...][Kelompok...][Nama² Anggota] - Silahkan cari bug pada coding, kemudian perbaiki agar aplikasi berjalan lancar - Dikerjakan 2xpertemuan. Setelah selesai, akan dipresentasikan pada pertemuan-pertemuan selanjutnya. >> Silahkan membuat sebuah aplikasi berita-website dengan ketentuan sebagai berikut :  1. Struktur Folder : 2. index.php <?php  $pageTitle = "Home"; include 'includes/header.php'; ?> <!-- Berita Utama --> <section class="berita-utama">     <div class="berita-card">         <img src="img/berita1.jpg" alt="Bandung Bangun Kawasan Wisata Baru">         <div cla...
Baca selengkapnya

Tugas Kelas X PPLG1 dan X PPLG2

  Buatlah Program Kalkulator dengan Bahasa Pemrograman PHP, dengan tampilan seperti Video di bawah ini : Catatan : 1. Program harus berjalan di server lokal PHP ( XAMPP ) 2. Nama file gunakan :  kalkulator.php 3. Kerjakan secara individu 4. Setelah selesai, tugas Coding php berikut tangkapan layarnya dibuat dalam bentuk file pdf  dan di kirim kan ke link :  https://forms.gle/HKtUC8mM37YYkJR88   dan dikirim selambat-lambatnya tgl. 22 Januari 2026 pukul 12.00 wib. by.Achdijat.S.
Baca selengkapnya