• Najnowsze pytania
  • Bez odpowiedzi
  • Zadaj pytanie
  • Kategorie
  • Tagi
  • Zdobyte punkty
  • Ekipa ninja
  • IRC
  • FAQ
  • Regulamin
  • Książki warte uwagi

question-closed Czego użyć w tej sytuacji?

Object Storage Arubacloud
0 głosów
199 wizyt
pytanie zadane 13 października 2023 w JavaScript przez domelcio Użytkownik (960 p.)
zamknięte 13 października 2023 przez domelcio

Cześć, stworzyłem stronę internetową do medycznej gry. I moje zapytanie jest takie w jaki sposób zaokrąglić kod aby po wypełnieniu drugiej tabelki "Leku i dawkowania":


Kod wyświetlał tak: (koncept)


A nie tak:


Oryginał wygląda tak:



Nie mam bladego pojęcia w jaki sposób to wytłumaczyć, koszmarny jestem w tłumaczeniu mam nadzieje, że poniekąd rozumiecie.

Oto mój kod JS:
 

let idRecepty; // Zmienna do przechowywania ID recepty
let kodDostepu; // Zmienna do przechowywania kodu dostępu
let pwzLekarza;
let numerTelefonuLekarza;
let liczbaWystawionychRecept = 1;

function generujIdRecepty() {
    // Prosta funkcja generująca losowe ID
    return Math.floor(Math.random() * 1000000) + 1;
}

function generujKodDostepu() {
    // Prosta funkcja generująca losowy 4-cyfrowy kod
    return Math.floor(1000 + Math.random() * 9000);
}

function getCurrentDate() {
    // Pobierz aktualną datę
    const currentDate = new Date();

    // Sformatuj datę jako dd.mm.rrrr
    const day = String(currentDate.getDate()).padStart(2, '0');
    const month = String(currentDate.getMonth() + 1).padStart(2, '0');
    const year = currentDate.getFullYear();

    return `${day}.${month}.${year}`;
}

function formatujDate(d) {
    // Funkcja do formatowania daty w formie "dzień miesiąc rok"
    const options = { day: 'numeric', month: 'long', year: 'numeric' };
    return new Date(d).toLocaleDateString('pl-PL', options);
}


function generujUnikalnyKod() {
    // Generuj 8 zer
    let kod = '00000000';

    // Dodaj dwie losowe litery
    kod += String.fromCharCode(65 + Math.floor(Math.random() * 26));
    kod += String.fromCharCode(65 + Math.floor(Math.random() * 26));

    // Dodaj 6 cyfr od 1 do 9
    for (let i = 0; i < 6; i++) {
        kod += Math.floor(1 + Math.random() * 9);
    }

    return kod;
}

function wystawRecepte() {
    // Generuj nowe ID recepty i kod dostępu
    idRecepty = generujIdRecepty();
    kodDostepu = generujKodDostepu();

    // Pobierz dane z formularza
    const lekarz = document.getElementById('lekarz').value;
    pwzLekarza = document.getElementById('pwzLekarza').value;
    numerTelefonuLekarza = document.getElementById('numerTelefonuLekarza').value;
    const specjalizacjaLekarza = document.getElementById('specjalizacjaLekarza').value;
    const imiePacjenta = document.getElementById('imiePacjenta').value;
    const wiekPacjenta = document.getElementById('wiekPacjenta').value;
    const kodPocztowy = document.getElementById('kodPocztowy').value;
    const szpital = document.getElementById('szpital').value;
    const ulica = document.getElementById('ulica').value;
    const dataGodzina = document.getElementById('dataGodzina').value;
    const podpisLekarza = document.getElementById('podpisLekarza').value;
    const Miasto = document.getElementById('Miasto').value;
    const StanKraj = document.getElementById('StanKraj').value;

    // Pobierz dane z tabeli leków
    const lekiTable = document.getElementById('leki');
    const lekiRows = lekiTable.getElementsByTagName('tr');
    let lekiHtml = '';

    for (let i = 1; i < lekiRows.length; i++) {
        const cells = lekiRows[i].getElementsByTagName('td');
        const nazwaLeku = cells[0].getElementsByTagName('input')[0].value;
        const dawkowanie = cells[1].getElementsByTagName('input')[0].value;

        // Pobierz datę realizacji z pola input w tabeli dataRealizacji
        const dataRealizacji = document.getElementsByName('dataRealizacji')[0].value;

        lekiHtml += `<p><strong style="font-size: 30px;">${nazwaLeku}</strong></p>`;
        lekiHtml += `<p>Data realizacji: ${dataRealizacji}</p>`;
        lekiHtml += `<p>Dawkowanie: ${dawkowanie}</p>`; // Dodaj informację o dawkowaniu
        lekiHtml += `<hr>`; // Dodaj linię po tekście "Dawkowanie:"
    }

        // Pobierz liczbę leków z tabeli leków
        const liczbaLekow = document.getElementById('leki').getElementsByTagName('tbody')[0].getElementsByTagName('tr').length;


        // Aktualizuj numerację recepty
        let numeracjaRecepty = `${liczbaWystawionychRecept} z ${liczbaLekow}`;

    const unikalnyKod = generujUnikalnyKod();

    // Pobierz dane z tabeli kontroli
    const kontrolaTable = document.getElementById('kontrolaTable');
    const kontrolaRows = kontrolaTable.getElementsByTagName('tr');
    let kontrolaHtml = '';

    for (let i = 1; i < kontrolaRows.length; i++) {
        const cells = kontrolaRows[i].getElementsByTagName('td');
        const dataKontroli = cells[0].getElementsByTagName('input')[0].value;
        const godzinaKontroli = cells[1].getElementsByTagName('input')[0].value;

        kontrolaHtml += `<p><strong>Termin Kontroli:</strong> ${formatujDate(dataKontroli)} godz. ${godzinaKontroli}</p>`;
    }

    // Zresetuj liczbę wystawionych recept przy każdym wywołaniu funkcji
    liczbaWystawionychRecept = 1;

    // Utwórz HTML zawierający wszystkie informacje
    const htmlDoWyswietlenia = `
    <div id="wygenerowanaRecepta">
        <html>
        <head>
            <title>Recepta</title>
            <style>
            body {
                font-family: 'Arial', sans-serif;
                margin: 20px;
                max-width: 400px;
                margin: auto;
                border: 2px solid #007bff;
                padding: 20px;
                border-radius: 10px;
            }
            h1 {
                color: #007bff;
                text-align: center;
            }
            p {
                margin-bottom: 10px;
            }
            hr {
                border: 1px solid #007bff;
                margin-bottom: 7%;
            }
            .podpis {
                text-align: center;
                font-style: italic;
                color: #888;
            }
            /* Dodatkowy styl dla ID recepty, kodu dostępu i daty wystawienia */
            #id-recepty, #data-wystawienia {
                color: #888;
                text-align: right;
                margin-bottom: 5%;
            }
            #kod-dostepu {
                font-size: 12px;
                display: flex;
                align-items: center;
            }
            
            #kod-dostepu strong {
                font-size: 14px;
                margin-right: 5px;
            }

            #data-wystawienia {
                color: #888;
                text-align: right;
                margin-bottom: 5%;
                transform: translateX(56%); /* Skorzystaj z transformacji, aby skorygować pozycję */
            }
        </style>
    
        </head>
        <body>
        <img src="logo2.png" alt="Kod kreskowy" style="max-width: 35%;">
        <img src="ind2.png" alt="Kod kreskowy" style="max-width: 100%; margin: 1% auto">
            <div id="id-recepty">ID recepty: ${idRecepty}</div>
            <div id="kod-dostepu"><strong>Kod dostępu: </strong><div style="display: inline; font-size: 2em;">${kodDostepu}</div><span id="data-wystawienia">Data wystawienia: ${getCurrentDate()}</span></div>
            <hr>
            <p><strong style="margin-right: 20%;">Pacjent:</strong> <span id="imie">${imiePacjenta}</span>, <span id="nazwisko">${wiekPacjenta}</span></p>
        <div id="info-lekarz" style="display: flex; flex-direction: column; align-items: flex-start; margin-top: 20px;">
            <p style="display: flex; justify-content: space-between; align-items: center; margin-bottom: 0;">
                <strong>Wystawca:</strong> <span id="lekarz" style="margin-left: 57px;">lek. ${lekarz}</span>
            </p>
            <p style="margin: 0; padding: 0; margin-left: 35%;">PWZ lekarza: ${pwzLekarza}</p>
            <p style="margin: 0; padding: 0; margin-left: 35%;">tel. (rejestracja): ${numerTelefonuLekarza}</p>
            ${kontrolaHtml} <!-- Dodaj informacje o kontroli do wygenerowanej recepty -->
        </div>
        <hr>
        <p style="font-weight: bold; margin-top: 10px; margin-bottom: 0;">Recepta ${numeracjaRecepty}</p>
        <div style="float: right; font-size: 15px; margin-top: -19px;">${unikalnyKod}</div>
        ${lekiHtml}
        </body>
        </html>
    `;

    // Utwórz nowe okno przeglądarki do wyświetlenia HTML
    const htmlWindow = window.open('', '_blank');

    // Ustaw zawartość okna na HTML do wyświetlenia
    htmlWindow.document.write(htmlDoWyswietlenia);
}

function validateTable(tableId) {
    var lekiTable = document.getElementById(tableId);
    var lekiRows = lekiTable.getElementsByTagName('tr');

    // Sprawdź, czy wszystkie pola w danej tabeli są wypełnione
    for (var i = 1; i < lekiRows.length; i++) {
        var cells = lekiRows[i].getElementsByTagName('td');
        var nazwaLeku = cells[0].getElementsByTagName('input')[0].value;
        var dawkowanie = cells[1].getElementsByTagName('input')[0].value;

        if (nazwaLeku.trim() === '' || dawkowanie.trim() === '') {
            showNotification('Wypełnij wszystkie pola w tabeli leków', 'warning');
            return false; // Przerwij proces, jeśli tabela nie jest poprawnie wypełniona
        }
    }

    return true; // Kontynuuj proces, jeśli tabela jest poprawnie wypełniona
}

function dodajLek() {
    const tabelaLekow = document.getElementById('leki').getElementsByTagName('tbody')[0];
    const nowyWiersz = tabelaLekow.insertRow();

    // Dodaj komórkę z nazwą leku
    const komorkaNazwaLeku = nowyWiersz.insertCell();
    const inputNazwaLeku = document.createElement('input');
    inputNazwaLeku.type = 'text';
    inputNazwaLeku.name = 'nazwaLeku';
    komorkaNazwaLeku.appendChild(inputNazwaLeku);

    // Dodaj komórkę z dawkowaniem
    const komorkaDawkowanie = nowyWiersz.insertCell();
    const inputDawkowanie = document.createElement('input');
    inputDawkowanie.type = 'text';
    inputDawkowanie.name = 'dawkowanie';
    komorkaDawkowanie.appendChild(inputDawkowanie);
}

function usunLek() {
    const tabelaLekow = document.getElementById('leki').getElementsByTagName('tbody')[0];
    const iloscWierszy = tabelaLekow.rows.length;

    // Nie usuwaj pierwszego wiersza (nagłówka tabeli)
    if (iloscWierszy > 1) {
        tabelaLekow.deleteRow(iloscWierszy - 1);
    }
}

 

komentarz zamknięcia: Rozwiązane.
komentarz 13 października 2023 przez adrian17 Ekspert (345,620 p.)
Nie wiem co masz na myśli przez "zaokrąglić kod".

Jedyna różnica jaką na oko widzę jest to "recepta 2 z 2" i numer recepty obok?
komentarz 13 października 2023 przez domelcio Użytkownik (960 p.)
Tak, chciałbym aby pod drugim dodanym lekiem wyświetlało "Recepta 2 z 2" i obok unikalny kod 16 cyfrowy.
komentarz 13 października 2023 przez overcq Pasjonat (21,800 p.)
edycja 13 października 2023 przez overcq

Po­trze­bujesz prze­nieść od­po­wie­d­nie dwie li­nie z “htmlDo­Wy­s­wie­t­le­nia” do pę­t­li “le­kiH­tml”, prze­nieść kil­ka przy­pi­sań zmien­nych zza pę­t­li do jej wnę­trza i zmienić “li­cz­ba­Wys­ta­wio­ny­ch­Re­ce­pt” na “i”. ;)

komentarz 13 października 2023 przez domelcio Użytkownik (960 p.)
przywrócone 13 października 2023 przez domelcio

@overcq
Czyli przenieść:

<p style="font-weight: bold; margin-top: 10px; margin-bottom: 0;">Recepta ${numeracjaRecepty}</p>
<div style="float: right; font-size: 15px; margin-top: -19px;">${unikalnyKod}</div>


Do:
 

    for (let i = 1; i < lekiRows.length; i++) {
        const cells = lekiRows[i].getElementsByTagName('td');
        const nazwaLeku = cells[0].getElementsByTagName('input')[0].value;
        const dawkowanie = cells[1].getElementsByTagName('input')[0].value;

        // Pobierz datę realizacji z pola input w tabeli dataRealizacji
        const dataRealizacji = document.getElementsByName('dataRealizacji')[0].value;

        lekiHtml += `<p><strong style="font-size: 30px;">${nazwaLeku}</strong></p>`;
        lekiHtml += `<p>Data realizacji: ${dataRealizacji}</p>`;
        lekiHtml += `<p>Dawkowanie: ${dawkowanie}</p>`; // Dodaj informację o dawkowaniu
        lekiHtml += `<hr>`; // Dodaj linię po tekście "Dawkowanie:"
        lekiHtml += `<p style="font-weight: bold; margin-top: 10px; margin-bottom: 0;">Recepta ${numeracjaRecepty}</p>` 
        lekiHtml += `<div style="float: right; font-size: 15px; margin-top: -19px;">${unikalnyKod}</div>`
    }

A to zmienić na i?:

    // Zresetuj liczbę wystawionych recept przy każdym wywołaniu funkcji
    liczbaWystawionychRecept = i;


No i przenieś zmienne let do wnętrza do tej pętli?:
 

    for (let i = 1; i < lekiRows.length; i++) {
        const cells = lekiRows[i].getElementsByTagName('td');
        const nazwaLeku = cells[0].getElementsByTagName('input')[0].value;
        const dawkowanie = cells[1].getElementsByTagName('input')[0].value;

        // Pobierz datę realizacji z pola input w tabeli dataRealizacji
        const dataRealizacji = document.getElementsByName('dataRealizacji')[0].value;

        lekiHtml += `<p><strong style="font-size: 30px;">${nazwaLeku}</strong></p>`;
        lekiHtml += `<p>Data realizacji: ${dataRealizacji}</p>`;
        lekiHtml += `<p>Dawkowanie: ${dawkowanie}</p>`; // Dodaj informację o dawkowaniu
        lekiHtml += `<hr>`; // Dodaj linię po tekście "Dawkowanie:"
        lekiHtml += `<p style="font-weight: bold; margin-top: 10px; margin-bottom: 0;">Recepta ${numeracjaRecepty}</p>` 
        lekiHtml += `<div style="float: right; font-size: 15px; margin-top: -19px;">${unikalnyKod}</div>`
    }

Dobrze rozumiem?

komentarz 13 października 2023 przez domelcio Użytkownik (960 p.)

@overcq, 

komentarz 14 października 2023 przez overcq Pasjonat (21,800 p.)
W “lekiHtml” zachowaj właściwą kolejność.

Natomiast potrzebujesz przenieść inicjowanie zmiennych, które znajdują się w tych przeniesionych dwóch linijkach, do wnętrza pętli.

Nie możesz tego przetestować i wyłapać błędy?

Podobne pytania

0 głosów
1 odpowiedź 152 wizyt
pytanie zadane 25 sierpnia 2020 w PHP przez Bakkit Dyskutant (7,600 p.)
+1 głos
1 odpowiedź 312 wizyt
0 głosów
2 odpowiedzi 143 wizyt

92,655 zapytań

141,546 odpowiedzi

319,984 komentarzy

62,024 pasjonatów

Motyw:

Akcja Pajacyk

Pajacyk od wielu lat dożywia dzieci. Pomóż klikając w zielony brzuszek na stronie. Dziękujemy! ♡

Oto polecana książka warta uwagi.
Pełną listę książek znajdziesz tutaj.

Akademia Sekuraka

Kolejna edycja największej imprezy hakerskiej w Polsce, czyli Mega Sekurak Hacking Party odbędzie się już 20 maja 2024r. Z tej okazji mamy dla Was kod: pasjamshp - jeżeli wpiszecie go w koszyku, to wówczas otrzymacie 40% zniżki na bilet w wersji standard!

Więcej informacji na temat imprezy znajdziecie tutaj. Dziękujemy ekipie Sekuraka za taką fajną zniżkę dla wszystkich Pasjonatów!

Akademia Sekuraka

Niedawno wystartował dodruk tej świetnej, rozchwytywanej książki (około 940 stron). Mamy dla Was kod: pasja (wpiszcie go w koszyku), dzięki któremu otrzymujemy 10% zniżki - dziękujemy zaprzyjaźnionej ekipie Sekuraka za taki bonus dla Pasjonatów! Książka to pierwszy tom z serii o ITsec, który łagodnie wprowadzi w świat bezpieczeństwa IT każdą osobę - warto, polecamy!

...