Sve osim fetcha objasnjeno

Mostar ce da gori🦇
mail@pastecode.io avatarunknown
javascript
2 months ago
7.5 kB
1
Indexable
Never
let globalPodaci = []; //placeholder for now
let preuzmi = () =>{
    // uzmi od popunje firme iz comboBox-a
    let url = `https://restapiexample.wrd.app.fit.ba/Ispit20230715/GetPonuda?travelfirma=${firma.value}`
    destinacije.innerHTML = "";
    fetch(url).then(r =>{
        if(r.status !== 200){
            return;
            //alert("200")
        }
        r.json().then(t => {
            let b=0;
            globalPodaci = t.podaci

            for(const x of t.podaci){
                // imam class Destinacije ovde i onda hardcodiram ovaj citav dio
                //console.log(x);
                destinacije.innerHTML+=`
                        <article class="offer">
                        <div class="akcija">Polazak za <br>${x.naredniPolazak.zaDana} dana</div>
                        <div class="offer-image" style="background-image: url('${x.imageUrl}');" ></div>
                        <div class="offer-details">
                            <div class="offer-destination">${x.mjestoDrzava}</div> 
                            <div class="offer-description">${x.opisPonude} </div>                                       
                            <div class="offer-description">${x.opisPonude} </div>                                       
                            <div class="offer-price">${x.naredniPolazak.cijenaEUR} €</div>
                            <br> 
                            <div class="offer-free">
                                <label>
                                    Slobodno mjesta: 
                                </label>
                                <span>
                                    ${x.naredniPolazak.brojSlobodnihMjesta}
                                </span>
                            </div> 
                        </div>
                        


                        <div class="offer-footer">
                            <div class="ponuda-dugme" onclick="odaberiDestinaciju(${b})">Pogledaj</div>
                        </div>
                    </article>
                `
                b++;

                // odaberi destinaciju i generisi planirana putovanja su crazy ngl
            }
        })
    })
}
let odaberiDestinaciju=(rb)=>{
    // gore mi je proslijedjen index json stringa
    let destinacijObj = globalPodaci[rb]; // u ovo pohranjujem json string iz kojeg cu kasnije podatke kupiti
    destinacija.value=destinacijObj.mjestoDrzava; // mijenjam u skroz donjem textboxu vrijednost
    generisiPlaniranaPutovanja(destinacijObj.planiranaPutovanja); // prosljedjujem json string
}

let generisiPlaniranaPutovanja = (putovanjaNiz) =>{
    // generisi tabelu za svaki element iz json stringa
    let s = "";
    for (const o of putovanjaNiz) {
        s += `
        <tr>
            <td>ID ${o.id}</td>
            <td>${o.datumPolaska}</td>
            <td>${o.datumPovratka}</td>
            <td>${o.hotelOpis}</td>
            <td>${o.vrstaPrevoza}</td>
            <td>${o.cijenaEUR} €</td>
            <td><button onclick="odaberiPutovanje('${o.datumPolaska}', ${o.cijenaEUR})">Odaberi</button></td>
        </tr>`
        // proslijedi u donju funkciju 
    }
    putovanjaTabela.innerHTML = s;
}

let odaberiPutovanje=(datumPolaskaValue, cijenaEUR)=>{
    datumPolaska.value = datumPolaskaValue; // promjena vrijednosti donjih textboxa
    cijenaPoGostu.value = cijenaEUR;
    promjenaBrojaGostiju();
}

const osvjeziCijenu=()=>{
    // iskreno ne vidim neku poentu zasto zasebna klasa ali isto mijenja vrijednosti textboxa
    let cijenaPoGostuValue = Number(cijenaPoGostu.value); 
    ukupnaCijena.value = Number(brojGostiju.value) * cijenaPoGostuValue;
    // stavljen number samo zbog toga sto je default string u textboxu
}
let ErrorBackgroundColor = "#FE7D7D";
let OkBackgroundColor = "#DFF6D8";

let posalji = () => {
    //https://restapiexample.wrd.app.fit.ba/ -> Ispit20230715 -> Add


    let jsObjekat = new Object();

    jsObjekat.travelFirma=firma.value;
    jsObjekat.destinacijaDrzava=destinacija.value;
    jsObjekat.brojIndeksa=brojIndeksa.value;
    jsObjekat.gosti=[]; //prazan niz koji se tek puni u linijama ispod
    jsObjekat.poruka=messagetxt.value;
    jsObjekat.telefon=phone.value;
    jsObjekat.datumPolaska= datumPolaska.value;

    document.querySelectorAll(".imegostaklasa").forEach(f=>{
        jsObjekat.gosti.push(f.value);
    })

    let jsonString = JSON.stringify(jsObjekat);

    console.log(jsObjekat);

    let url = "https://restapiexample.wrd.app.fit.ba/Ispit20230715/Add";

    //fetch tipa "POST" i saljemo "jsonString"
    fetch(url, {
        method: "POST",
        body: jsonString,
        headers: {
            "Content-Type": "application/json",
        }
    })
        .then(r => {
            if (r.status != 200) {
                alert("Greška")
                return;
            }

            r.json().then(t => {
                
                if (t.idRezervacije>0 && Number(ukupnaCijena.value)>0)
                {
                    dialogSuccess(`Idi na placanje rezervacije broj ${t.idRezervacije} - iznos ${ukupnaCijena.value} EUR`, ()=>{
                        window.location = `https://www.paypal.com/cgi-bin/webscr?business=adil.joldic@yahoo.com&cmd=_xclick&currency_code=EUR&amount=${ukupnaCijena.value}&item_name=Dummy invoice`
                    });
                }
            })

        })
}// kurac moj ovo cu za drugi dan ostaviti

let popuniFimeUCombox = () => {
    let urlFirme = "https://restapiexample.wrd.app.fit.ba/Ispit20230624/GetTravelFirme";


    //basic fetch za popunjavanje dropdown Boxa, fetchaj podatke sa ovog api-a i u firmu dodaj svaku opciju
    fetch(urlFirme)
        .then(obj => {
            if (obj.status != 200) {
                window.alert("Greska pri komunikaciji sa serverom!");
                return;
            }
            obj.json().then(element => {
                element.forEach(e => {
                    firma.innerHTML += `<option>${e.naziv}</option>`;
                });

                preuzmi();
            })
        })
        .catch(error => {
            window.alert("Greska!" + error);
        })
}
popuniFimeUCombox(); // pokreni odmah!!


let promjenaBrojaGostiju = () => {
    gosti.innerHTML=''; // ako je broj veci od 5 opucaj alert 
    if(brojGostiju.value>5){
        alert("Dosegnut maksimum gostiju!");
        return;
    }
    // ako je broj manji od 6 generisi toliko redova odakle ces kupiti informacije u post metodi 
    for (let i=0;i<brojGostiju.value;i++){
        gosti.innerHTML+=
        `<div class="item-full">
            <label>Ime gosta ${i+1}</label>
            <input class="imegostaklasa" />
        </div>`
    }
    osvjeziCijenu(); // promjeni vrijednost cijene jer imas sad vise korisnika znaci korisnik*cijena
}


let provjeriTelefon=()=> {
    let r = /^\+[0-9]{3}-[0-9]{2}-[0-9]{3}-[0-9]{3}$/;
    if (!r.test(phone.value)) {
       phone.style.backgroundColor=ErrorBackgroundColor;
    }
    else {
        phone.style.backgroundColor=OkBackgroundColor;
    }
}

let provjeriBrojIndeksa=()=>{
    let r = /^IB[0-9]{6}$/;
    if (!r.test(brojIndeksa.value)) {
       brojIndeksa.style.backgroundColor=ErrorBackgroundColor;
    }
    else {
        brojIndeksa.style.backgroundColor=OkBackgroundColor;
    }
}