obliczanie dziala, dodanie posta

index.html

@@ -31,10 +31,11 @@
                     
                     <label id="cena">Calculate ...</label>
 
-                    <label for="liters">Ile litrów?</label>
-                    <input type="text" id="liters" name="liters">
-                    
-                    <input type="submit" value="OBLICZ">
+                    Ile litrow?</br>
+                    <input id = "ile_litrow"></input></br>
+                    <input id = "oblicz" type="button" value="OBLICZ">
+
+                    <p id="wynik"></p>
                 </form>
 
         </div>
@@ -43,9 +44,20 @@
         </div>
     </div>
 
+    <div class="post">
+        <h2>Dodaj rodzaj paliwa</h2>
+        Nazwa:</br>
+        <input id="name" type="text" placeholder="nazwa"></br></br>
+        Cena:</br>
+        <input id="price" type="number" placeholder = "cena"></br></br>
+        <button id = "button_dodaj">Dodaj</button>
+    </div>
+
     <div class="footer">
         Stronę opracował: 000000000000
     </div>
+
+    <script src="js/post.js"></script>
 </body>
 </html>
 

js/post.js

@@ -0,0 +1,26 @@
+document.addEventListener('DOMContentLoaded', () => {
+
+    button_dodaj = document.getElementById("button_dodaj")
+    
+    button_dodaj.addEventListener("click", () => {
+
+        data = {
+            nazwa: document.getElementById("name").value,
+            cena: document.getElementById("price").value
+        }
+        fetch("php/post.php", {
+            method: "POST",
+            headers: {
+                "Content-Type":"application/json",
+            }, 
+            body: JSON.stringify(data)
+        })
+        .then(response => response.json)
+        .then(data => {
+            console.log("Succes", data)
+            window.location.reload()
+        })
+        
+    })
+
+})

js/script.js

@@ -4,6 +4,7 @@ const cena = document.getElementById("cena");
 
 let usersData = [];
 
+
 document.addEventListener('DOMContentLoaded', function() {
     fetch('php/gget.php')
         .then(response => response.json())
@@ -40,3 +41,15 @@ fuelType.addEventListener('change', function() {
     }
 });
 
+document.getElementById("oblicz").addEventListener("click", () => {
+    const ile_litrow = document.getElementById("ile_litrow").value
+    const cena_paliwa = document.getElementById("cena").innerHTML
+    console.log(ile_litrow)
+    console.log(cena_paliwa)
+
+    const wynik = ile_litrow * cena_paliwa
+
+    console.log(wynik)
+
+    document.getElementById("wynik").innerHTML = wynik
+})

php/gget.php

@@ -1,6 +1,6 @@
 <?php
 
-$polaczenie = mysqli_connect("172.19.0.2", "root", "secret", "db");
+$polaczenie = mysqli_connect("localhost", "root", "", "db");
 
 $kwerenda = mysqli_query($polaczenie, "SELECT * FROM paliwa ORDER BY id DESC LIMIT 3;");
 

php/post.php

@@ -0,0 +1,20 @@
+<?php
+
+$dbhost = "localhost";
+$dbuser = "root";
+$dbpass = "";
+$dbname = "db";
+
+$con = mysqli_connect($dbhost, $dbuser, $dbpass, $dbname);
+
+$rawData = file_get_contents('php://input');
+
+$data = json_decode($rawData, true);
+
+$kw = "INSERT INTO paliwa (nazwa, cena) VALUES ('{$data['nazwa']}', {$data['cena']} );";
+
+echo json_encode($kw);
+
+$ans = mysqli_query($con, $kw);
+
+?>

token.txt

@@ -0,0 +1 @@
+03abdf5412e60673d79cd8929fdd18a8bbb631b3