Dasko
fd762a6527
- dugme Naplati otvara modal (primljeno/kusur, način plaćanja, prikaz računa) - primljeni iznos se prosleđuje u fiskalni zahtev radi tačnog Gotovina/Povraćaj - nova ruta i handler za prikaz/štampu fiskalnog računa prodaje - fiskalni tab se otvara preko imenovanog prozora (bez blokiranja popup-a) - Fisk mock: refund se sada računa iz stvarnih plaćanja, ne fiksno 0
344 lines
25 KiB
HTML
344 lines
25 KiB
HTML
{{template "base" .}} {{define "naslov"}}Nova prodaja — NTech{{end}} {{define
|
||
"dodatni-css"}}
|
||
<style>
|
||
.forma-kartica:nth-child(1) { animation-delay: 0.04s; }
|
||
.forma-kartica:nth-child(2) { animation-delay: 0.12s; }
|
||
@media (max-width: 768px) { .stavke-tabela-wrapper { display: none; } .stavke-kartice { display: flex !important; } }
|
||
.polje-labela { font-size: 12px; color: var(--tekst-sporedni); display: block; margin-bottom: 4px; }
|
||
.tip-klijenta-opcija {
|
||
display: flex; align-items: center; gap: 5px;
|
||
padding: 3px 10px; border: 1px solid var(--ivica); border-radius: 20px;
|
||
cursor: pointer; font-size: 12px; color: var(--tekst-sporedni); user-select: none;
|
||
}
|
||
.tip-klijenta-opcija-akt { border-color: var(--akcentna); color: var(--tekst-glavni); background: var(--pozadina); }
|
||
.klijent-stavka:last-child { border-bottom: none; }
|
||
.klijent-stavka:hover { background: var(--pozadina); }
|
||
[x-cloak] { display: none !important; }
|
||
</style>
|
||
{{end}} {{define "sadrzaj"}}
|
||
|
||
<script>
|
||
var _ntechArtikli = {{.ArtikliJSON}};
|
||
var _ntechKlijenti = {{.KlijentiJSON}};
|
||
var _ntechPdvObveznik = {{if index .Moduli "pdv"}}true{{else}}false{{end}};
|
||
</script>
|
||
|
||
<div style="width: 100%" x-data="prodajaForma">
|
||
<a href="/prodaja" class="nazad-link" hx-boost="true" hx-target="#glavni-sadrzaj" hx-select="#glavni-sadrzaj" hx-swap="outerHTML">
|
||
<svg xmlns="http://www.w3.org/2000/svg" width="16" height="16" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2" stroke-linecap="round" stroke-linejoin="round" aria-hidden="true">
|
||
<polyline points="15 18 9 12 15 6" />
|
||
</svg>
|
||
Nazad na prodaju
|
||
</a>
|
||
|
||
<form method="POST" action="/prodaja/nova" @submit.prevent="posaljiProdaju($event)">
|
||
<input type="hidden" name="_csrf" value="{{.CsrfToken}}" />
|
||
{{if .Greska}}
|
||
<div class="poruka-greska greska-animacija">{{.Greska}}</div>
|
||
{{end}}
|
||
|
||
<!-- zaglavlje prodaje -->
|
||
<!-- position:relative + z-index: bez ovoga lista rezultata pretrage klijenata
|
||
(position:absolute unutra) crta se ISPOD sledeće kartice (Stavke) — kartica
|
||
bez pozicioniranja slika se u ranijoj fazi rasporeda bez obzira na z-index dece -->
|
||
<div class="kartica forma-kartica animiraj" style="margin-bottom: 16px; position: relative; z-index: 2">
|
||
<div style="margin-bottom: 16px; padding-bottom: 14px; border-bottom: 0.5px solid var(--ivica);">
|
||
<span style="font-size: 16px; font-weight: 500; color: var(--tekst-glavni)">Nova prodaja</span>
|
||
</div>
|
||
<div style="display: flex; flex-direction: column; gap: 14px">
|
||
<div>
|
||
<div style="display: flex; align-items: center; justify-content: space-between; margin-bottom: 4px; flex-wrap: wrap; gap: 6px">
|
||
<label class="polje-labela" style="margin-bottom: 0">Klijent</label>
|
||
<div style="display: flex; gap: 6px">
|
||
<label class="tip-klijenta-opcija" :class="klasaTipKlijenta('sve')" @click="postaviTipKlijenta('sve')">
|
||
<input type="radio" name="tip-klijenta-filter" value="sve" :checked="jeTipKlijenta('sve')" style="margin: 0" /> Sva lica
|
||
</label>
|
||
<label class="tip-klijenta-opcija" :class="klasaTipKlijenta('pravno')" @click="postaviTipKlijenta('pravno')">
|
||
<input type="radio" name="tip-klijenta-filter" value="pravno" :checked="jeTipKlijenta('pravno')" style="margin: 0" /> Pravna lica
|
||
</label>
|
||
<label class="tip-klijenta-opcija" :class="klasaTipKlijenta('fizicko')" @click="postaviTipKlijenta('fizicko')">
|
||
<input type="radio" name="tip-klijenta-filter" value="fizicko" :checked="jeTipKlijenta('fizicko')" style="margin: 0" /> Fizička lica
|
||
</label>
|
||
</div>
|
||
</div>
|
||
<input type="hidden" name="klijent_id" :value="izabraniKlijentId || ''" />
|
||
<template x-if="izabraniKlijent">
|
||
<div style="display: flex; align-items: flex-start; justify-content: space-between; gap: 10px; padding: 8px 10px; background: var(--pozadina); border: 0.5px solid var(--ivica); border-radius: 8px">
|
||
<div>
|
||
<div style="font-size: 13px; font-weight: 500; color: var(--tekst-glavni)" x-text="izabraniKlijent.naziv"></div>
|
||
<template x-for="p in poljaIzabranogKlijenta(izabraniKlijent)" :key="p.labela">
|
||
<div style="font-size: 11px; color: var(--tekst-sporedni)"><span x-text="p.labela"></span>: <span x-text="p.vrednost"></span></div>
|
||
</template>
|
||
</div>
|
||
<button type="button" class="btn-sekundarno" @click="ocistiKlijenta()" style="padding: 3px 10px; font-size: 12px">Promeni</button>
|
||
</div>
|
||
</template>
|
||
<div x-show="!izabraniKlijent" style="position: relative" @click.outside="prikaziListuKlijenata = false">
|
||
<input type="text" x-model="pretragaKlijent" autocomplete="off" @focus="pretragaKlijentPromenjena()" @input="pretragaKlijentPromenjena()" placeholder="Pretraži klijenta ili ostavi prazno..." style="width: 100%" />
|
||
<div x-show="prikaziListuKlijenata && filtriraniKlijenti.length" x-cloak @scroll="ucitajViseKlijenata($event)" style="position: absolute; z-index: 30; left: 0; right: 0; margin-top: 4px; background: var(--pozadina); border: 0.5px solid var(--ivica); border-radius: 10px; max-height: 220px; overflow: auto; box-shadow: 0 8px 24px rgba(0, 0, 0, 0.14)">
|
||
<template x-for="k in filtriraniKlijenti" :key="k.id">
|
||
<div @click="izaberiKlijenta(k)" class="klijent-stavka" style="padding: 8px 12px; cursor: pointer; border-bottom: 0.5px solid var(--ivica)">
|
||
<div style="font-size: 13px; font-weight: 500; color: var(--tekst-glavni)" x-text="k.naziv"></div>
|
||
<div style="font-size: 11px; color: var(--tekst-sporedni)" x-text="detaljKlijenta(k)"></div>
|
||
</div>
|
||
</template>
|
||
<div x-show="imaJosKlijenata" style="padding: 6px 12px; text-align: center; font-size: 11px; color: var(--tekst-sporedni)">Skrolujte za još rezultata...</div>
|
||
</div>
|
||
</div>
|
||
</div>
|
||
<div>
|
||
<label class="polje-labela">Napomena</label>
|
||
<textarea name="napomena" rows="2" placeholder="Interna napomena o prodaji..." style="width: 100%; resize: vertical"></textarea>
|
||
</div>
|
||
</div>
|
||
</div>
|
||
|
||
<!-- stavke -->
|
||
<!-- :style ovde vraća karticu na bazno stanje dok je miš nad zbirnim redom (Osnovica/PDV/Ukupno) —
|
||
inline stil pobeđuje .kartica:hover, jer čist CSS ne ume selektivno da isključi hover na detetu -->
|
||
<div class="kartica forma-kartica animiraj"
|
||
:style="'margin-bottom: 16px;' + (zbirnoHover ? 'box-shadow: var(--senka); border-color: var(--ivica); background: var(--kartica); transform: none;' : '')">
|
||
<div style="margin-bottom: 16px; padding-bottom: 14px; border-bottom: 0.5px solid var(--ivica); display: flex; justify-content: space-between; align-items: center; flex-wrap: wrap; gap: 8px;">
|
||
<span style="font-size: 16px; font-weight: 500; color: var(--tekst-glavni)">Stavke</span>
|
||
<button type="button" @click="dodajStavku()" class="btn-primarno" style="font-size: 13px; padding: 6px 14px">
|
||
+ Dodaj stavku
|
||
</button>
|
||
</div>
|
||
|
||
<!-- pretraga artikala / skener barkoda -->
|
||
<div style="margin-bottom:12px;">
|
||
<input type="text" x-model="pretragaArtikal" @keydown.enter.prevent="dodajPoBarkodu()" placeholder="Pretraži artikle po nazivu, šifri, barkodu ili skeniraj barkod..." autocomplete="off" style="width:100%;">
|
||
</div>
|
||
|
||
<!-- desktop tabela stavki -->
|
||
<div class="stavke-tabela-wrapper">
|
||
<table class="tabela">
|
||
<thead>
|
||
<tr style="border-bottom: 0.5px solid var(--ivica)">
|
||
<th style="padding: 8px 10px; text-align: left; font-size: 12px; font-weight: 500; color: var(--tekst-sporedni);">Artikal</th>
|
||
<th style="padding: 8px 10px; text-align: center; font-size: 12px; font-weight: 500; color: var(--tekst-sporedni); width: 90px;">Kol.</th>
|
||
<th style="padding: 8px 10px; text-align: right; font-size: 12px; font-weight: 500; color: var(--tekst-sporedni); width: 130px;">Cena/kom{{if index .Moduli "pdv"}} (sa PDV){{end}}</th>
|
||
<th style="padding: 8px 10px; text-align: right; font-size: 12px; font-weight: 500; color: var(--tekst-sporedni); width: 80px;">Popust%</th>
|
||
<th style="padding: 8px 10px; text-align: right; font-size: 12px; font-weight: 500; color: var(--tekst-sporedni); width: 110px;">Ukupno</th>
|
||
<th style="width: 40px;"></th>
|
||
</tr>
|
||
</thead>
|
||
<tbody>
|
||
<template x-for="(stavka, i) in stavke" :key="i">
|
||
<tr style="border-bottom: 0.5px solid var(--ivica)">
|
||
<td style="padding: 8px 10px; position: relative;">
|
||
<input type="hidden" :name="'pdv_stopa[]'" :value="stavka.pdv_stopa">
|
||
<input type="hidden" :name="'artikal_id[]'" :value="stavka.artikal_id" :disabled="isMobile">
|
||
<template x-if="stavka.artikal_id">
|
||
<div style="display:flex;align-items:center;justify-content:space-between;gap:6px;padding:7px 10px;border:0.5px solid var(--ivica);border-radius:8px;">
|
||
<span style="font-size:13px;color:var(--tekst-glavni);overflow:hidden;text-overflow:ellipsis;white-space:nowrap;" x-text="stavka._naziv"></span>
|
||
<button type="button" @click="promeniArtikal(stavka)" :disabled="isMobile" title="Promeni artikal"
|
||
style="background:none;border:none;cursor:pointer;color:var(--tekst-sporedni);font-size:13px;flex-shrink:0;padding:0;">✎</button>
|
||
</div>
|
||
</template>
|
||
<template x-if="!stavka.artikal_id">
|
||
<div @click.outside="stavka._prikaziListu = false">
|
||
<input type="text" x-model="stavka._pretraga" @focus="stavka._prikaziListu = true" @input="stavka._prikaziListu = true"
|
||
placeholder="Pretraži artikal..." autocomplete="off" :disabled="isMobile" style="width: 100%">
|
||
<div x-show="stavka._prikaziListu && filtriraniArtikliZaStavku(stavka).length" x-cloak
|
||
@scroll="ucitajViseArtikala(stavka, $event)"
|
||
style="position: absolute; z-index: 40; left: 8px; right: 8px; margin-top: 4px; background: var(--pozadina); border: 0.5px solid var(--ivica); border-radius: 10px; max-height: 240px; overflow: auto; box-shadow: 0 8px 24px rgba(0, 0, 0, 0.14);">
|
||
<template x-for="a in filtriraniArtikliZaStavku(stavka)" :key="a.id">
|
||
<div @click="izaberiArtikal(stavka, a)" style="display:flex;justify-content:space-between;gap:10px;padding:8px 12px;cursor:pointer;border-bottom:0.5px solid var(--ivica);">
|
||
<div style="min-width:0;">
|
||
<div style="font-size:13px;font-weight:500;color:var(--tekst-glavni);white-space:nowrap;overflow:hidden;text-overflow:ellipsis;" x-text="a.naziv"></div>
|
||
<div style="font-size:11px;color:var(--tekst-sporedni);" x-text="a.kategorija_naziv"></div>
|
||
</div>
|
||
<div style="font-size:13px;font-weight:500;color:var(--tekst-glavni);white-space:nowrap;" x-text="fmtDin(pdvObveznik ? a.cena_sa_pdv : a.cena) + ' din'"></div>
|
||
</div>
|
||
</template>
|
||
<div x-show="imaJosArtikala(stavka)" style="padding: 6px 12px; text-align: center; font-size: 11px; color: var(--tekst-sporedni)">Skrolujte za još rezultata...</div>
|
||
</div>
|
||
</div>
|
||
</template>
|
||
<div x-show="stavka.kategorija_naziv" style="font-size:11px;color:var(--tekst-sporedni);margin-top:3px;" x-text="stavka.kategorija_naziv"></div>
|
||
</td>
|
||
<td style="padding: 8px 10px">
|
||
<input type="number" :name="'kolicina[]'" x-model="stavka.kolicina" min="1" :disabled="isMobile"
|
||
:style="prekoracenje(i) ? 'border-color:#dc2626;' : ''" style="width: 100%; text-align: center" />
|
||
<div x-show="stavka.artikal_id"
|
||
:style="'font-size:11px;margin-top:3px;text-align:center;white-space:nowrap;color:' + (prekoracenje(i) ? '#dc2626' : 'var(--tekst-sporedni)')"
|
||
x-text="'Na stanju: ' + dostupnaKolicina(i)"></div>
|
||
<div x-show="prekoracenje(i)" style="font-size: 11px; color: #dc2626; margin-top: 1px; text-align: center; white-space: nowrap;">Prekoračena količina</div>
|
||
</td>
|
||
<td style="padding: 8px 10px">
|
||
<input type="number" :name="'cena_po_komadu[]'" x-model="stavka.cena" min="0" step="0.01" :disabled="isMobile" style="width: 100%; text-align: right" />
|
||
</td>
|
||
<td style="padding: 8px 10px">
|
||
<input type="number" :name="'popust[]'" x-model="stavka.popust" min="0" max="100" step="0.01" :disabled="isMobile" style="width: 100%; text-align: right" />
|
||
</td>
|
||
<td style="padding: 8px 10px; text-align: right; font-size: 14px; font-weight: 500; color: var(--tekst-glavni);">
|
||
<span x-text="fmtDin(ukupnoStavke(stavka)) + ' din'"></span>
|
||
</td>
|
||
<td style="padding: 8px 10px; text-align: center">
|
||
<button type="button" @click="ukloniStavku(i)" x-show="stavkaImaVrednost(stavka)"
|
||
style="background: none; border: none; cursor: pointer; color: #dc2626; font-size: 18px; line-height: 1; padding: 2px 6px; border-radius: 4px; transition: background 0.15s;"
|
||
onmouseover="this.style.background = 'rgba(220,38,38,0.08)'" onmouseout="this.style.background = 'none'" title="Ukloni stavku">×</button>
|
||
</td>
|
||
</tr>
|
||
</template>
|
||
</tbody>
|
||
<tfoot @mouseenter="zbirnoHover = true" @mouseleave="zbirnoHover = false">
|
||
<tr x-show="pdvObveznik" x-cloak style="border-top: 0.5px solid var(--ivica)">
|
||
<td colspan="4" style="padding: 4px 10px; text-align: right; font-size: 12px; color: var(--tekst-sporedni);">Osnovica:</td>
|
||
<td style="padding: 4px 10px; text-align: right; font-size: 12px; color: var(--tekst-sporedni);">
|
||
<span x-text="fmtDin(osnovicaSvega()) + ' din'"></span>
|
||
</td>
|
||
<td></td>
|
||
</tr>
|
||
<tr x-show="pdvObveznik" x-cloak>
|
||
<td colspan="4" style="padding: 0 10px 4px; text-align: right; font-size: 12px; color: var(--tekst-sporedni);">PDV:</td>
|
||
<td style="padding: 0 10px 4px; text-align: right; font-size: 12px; color: var(--tekst-sporedni);">
|
||
<span x-text="fmtDin(pdvSvega()) + ' din'"></span>
|
||
</td>
|
||
<td></td>
|
||
</tr>
|
||
<tr :style="!pdvObveznik ? 'border-top: 0.5px solid var(--ivica);' : ''">
|
||
<td colspan="4" style="padding: 10px; text-align: right; font-size: 13px; color: var(--tekst-sporedni); font-weight: 500;" x-text="pdvObveznik ? 'Ukupno za naplatu:' : 'Ukupno:'"></td>
|
||
<td style="padding: 10px; text-align: right; font-size: 15px; font-weight: 600; color: var(--tekst-glavni);">
|
||
<span x-text="fmtDin(ukupnoSvega()) + ' din'"></span>
|
||
</td>
|
||
<td></td>
|
||
</tr>
|
||
</tfoot>
|
||
</table>
|
||
</div>
|
||
|
||
<!-- mobilne kartice stavki -->
|
||
<div class="stavke-kartice" style="display: none; flex-direction: column; gap: 10px">
|
||
<template x-for="(stavka, i) in stavke" :key="i">
|
||
<div style="border: 0.5px solid var(--ivica); border-radius: 8px; padding: 12px;">
|
||
<div style="display: flex; justify-content: space-between; align-items: center; margin-bottom: 10px;">
|
||
<span style="font-size: 13px; font-weight: 500; color: var(--tekst-sporedni);" x-text="'Stavka ' + (i + 1)"></span>
|
||
<button type="button" @click="ukloniStavku(i)" x-show="stavkaImaVrednost(stavka)"
|
||
style="background: none; border: 0.5px solid #dc2626; color: #dc2626; cursor: pointer; font-size: 13px; padding: 2px 8px; border-radius: 4px;">Ukloni</button>
|
||
</div>
|
||
<div style="display: flex; flex-direction: column; gap: 10px">
|
||
<input type="hidden" :name="'pdv_stopa[]'" :value="stavka.pdv_stopa">
|
||
<div style="position: relative;">
|
||
<label class="polje-labela">Artikal</label>
|
||
<input type="hidden" :name="'artikal_id[]'" :value="stavka.artikal_id" :disabled="!isMobile">
|
||
<template x-if="stavka.artikal_id">
|
||
<div style="display:flex;align-items:center;justify-content:space-between;gap:6px;padding:7px 10px;border:0.5px solid var(--ivica);border-radius:8px;">
|
||
<span style="font-size:13px;color:var(--tekst-glavni);overflow:hidden;text-overflow:ellipsis;white-space:nowrap;" x-text="stavka._naziv"></span>
|
||
<button type="button" @click="promeniArtikal(stavka)" :disabled="!isMobile" title="Promeni artikal"
|
||
style="background:none;border:none;cursor:pointer;color:var(--tekst-sporedni);font-size:13px;flex-shrink:0;padding:0;">✎</button>
|
||
</div>
|
||
</template>
|
||
<template x-if="!stavka.artikal_id">
|
||
<div @click.outside="stavka._prikaziListu = false">
|
||
<input type="text" x-model="stavka._pretraga" @focus="stavka._prikaziListu = true" @input="stavka._prikaziListu = true"
|
||
placeholder="Pretraži artikal..." autocomplete="off" :disabled="!isMobile" style="width: 100%">
|
||
<div x-show="stavka._prikaziListu && filtriraniArtikliZaStavku(stavka).length" x-cloak
|
||
@scroll="ucitajViseArtikala(stavka, $event)"
|
||
style="position: absolute; z-index: 40; left: 0; right: 0; margin-top: 4px; background: var(--pozadina); border: 0.5px solid var(--ivica); border-radius: 10px; max-height: 240px; overflow: auto; box-shadow: 0 8px 24px rgba(0, 0, 0, 0.14);">
|
||
<template x-for="a in filtriraniArtikliZaStavku(stavka)" :key="a.id">
|
||
<div @click="izaberiArtikal(stavka, a)" style="display:flex;justify-content:space-between;gap:10px;padding:8px 12px;cursor:pointer;border-bottom:0.5px solid var(--ivica);">
|
||
<div style="min-width:0;">
|
||
<div style="font-size:13px;font-weight:500;color:var(--tekst-glavni);white-space:nowrap;overflow:hidden;text-overflow:ellipsis;" x-text="a.naziv"></div>
|
||
<div style="font-size:11px;color:var(--tekst-sporedni);" x-text="a.kategorija_naziv"></div>
|
||
</div>
|
||
<div style="font-size:13px;font-weight:500;color:var(--tekst-glavni);white-space:nowrap;" x-text="fmtDin(pdvObveznik ? a.cena_sa_pdv : a.cena) + ' din'"></div>
|
||
</div>
|
||
</template>
|
||
<div x-show="imaJosArtikala(stavka)" style="padding: 6px 12px; text-align: center; font-size: 11px; color: var(--tekst-sporedni)">Skrolujte za još rezultata...</div>
|
||
</div>
|
||
</div>
|
||
</template>
|
||
</div>
|
||
<div x-show="stavka.kategorija_naziv" style="font-size:11px;color:var(--tekst-sporedni);margin-top:-4px;" x-text="stavka.kategorija_naziv"></div>
|
||
<div style="display:grid;grid-template-columns:1fr 1fr;gap:10px;">
|
||
<div>
|
||
<label class="polje-labela">Količina</label>
|
||
<input type="number" :name="'kolicina[]'" x-model="stavka.kolicina" min="1" :disabled="!isMobile"
|
||
:style="prekoracenje(i) ? 'border-color:#dc2626;' : ''" style="width: 100%" />
|
||
<div x-show="stavka.artikal_id"
|
||
:style="'font-size:11px;margin-top:3px;color:' + (prekoracenje(i) ? '#dc2626' : 'var(--tekst-sporedni)')"
|
||
x-text="'Na stanju: ' + dostupnaKolicina(i)"></div>
|
||
</div>
|
||
<div>
|
||
<label class="polje-labela">Cena/kom (din){{if index .Moduli "pdv"}} sa PDV{{end}}</label>
|
||
<input type="number" :name="'cena_po_komadu[]'" x-model="stavka.cena" min="0" step="0.01" :disabled="!isMobile" style="width: 100%" />
|
||
</div>
|
||
</div>
|
||
<div style="display:grid;grid-template-columns:1fr 1fr;gap:10px;">
|
||
<div>
|
||
<label class="polje-labela">Popust %</label>
|
||
<input type="number" :name="'popust[]'" x-model="stavka.popust" min="0" max="100" step="0.01" :disabled="!isMobile" style="width: 100%" />
|
||
</div>
|
||
<div style="text-align: right; font-size: 14px; font-weight: 500; color: var(--tekst-glavni);">
|
||
<span x-text="fmtDin(ukupnoStavke(stavka)) + ' din'"></span>
|
||
</div>
|
||
</div>
|
||
</div>
|
||
</div>
|
||
</template>
|
||
<div @mouseenter="zbirnoHover = true" @mouseleave="zbirnoHover = false">
|
||
<div x-show="pdvObveznik" x-cloak style="text-align: right; font-size: 12px; color: var(--tekst-sporedni); padding: 0 4px;">
|
||
Osnovica: <span x-text="fmtDin(osnovicaSvega()) + ' din'"></span> · PDV: <span x-text="fmtDin(pdvSvega()) + ' din'"></span>
|
||
</div>
|
||
<div style="text-align: right; font-size: 15px; font-weight: 600; color: var(--tekst-glavni); padding: 8px 4px;">
|
||
<span x-text="pdvObveznik ? 'Ukupno za naplatu:' : 'Ukupno:'"></span> <span x-text="fmtDin(ukupnoSvega()) + ' din'"></span>
|
||
</div>
|
||
</div>
|
||
</div>
|
||
</div>
|
||
|
||
<!-- dugmad forme -->
|
||
<div style="display: flex; justify-content: flex-end; gap: 10px">
|
||
<a hx-boost="true" hx-target="#glavni-sadrzaj" hx-select="#glavni-sadrzaj" hx-swap="outerHTML" href="/prodaja" class="btn-sekundarno">Odustani</a>
|
||
<button type="button" @click="otvoriModalNaplate()" class="btn-primarno" :disabled="imaPrekoracenja() || !imaPopunjenuStavku()" :style="(imaPrekoracenja() || !imaPopunjenuStavku()) ? 'opacity:0.4;cursor:not-allowed;' : ''">
|
||
Naplati
|
||
</button>
|
||
</div>
|
||
|
||
<!-- modal naplate — unos primljenog iznosa/kusura i način plaćanja pre konačnog slanja prodaje -->
|
||
<dialog class="premesti-modal" x-ref="dijalogNaplate" onclick="if(event.target===this)this.close()">
|
||
<div class="premesti-zaglavlje">
|
||
<h3>Naplata</h3>
|
||
<button type="button" class="premesti-zatvori" @click="$refs.dijalogNaplate.close()" aria-label="Zatvori">×</button>
|
||
</div>
|
||
<div style="display:flex;flex-direction:column;gap:10px;padding:16px;">
|
||
<div style="display:flex;justify-content:space-between;align-items:center;">
|
||
<span style="font-size:16px;font-weight:600;color:var(--tekst-glavni);">Za naplatu</span>
|
||
<span style="font-size:18px;font-weight:600;color:var(--tekst-glavni);" x-text="fmtDin(ukupnoSvega()) + ' din'"></span>
|
||
</div>
|
||
<div style="margin-top:6px;padding-top:10px;border-top:0.5px solid var(--ivica);">
|
||
<label class="polje-labela">Primljeno (din)</label>
|
||
<input type="number" name="primljeno" min="0" step="0.01" x-model="primljenoIznos" placeholder="Unesite primljeni iznos"
|
||
style="width:100%;padding:8px 12px;background:var(--pozadina);border:0.5px solid var(--ivica);border-radius:8px;color:var(--tekst-glavni);font-size:14px;box-sizing:border-box;">
|
||
</div>
|
||
<div x-show="primljenoIznos !== '' && kusurIznos() >= 0" x-cloak
|
||
style="display:flex;justify-content:space-between;align-items:center;padding:8px 12px;background:color-mix(in srgb,var(--uspeh) 10%,transparent);border:0.5px solid var(--uspeh);border-radius:8px;">
|
||
<span style="color:var(--uspeh);font-weight:500;">Kusur (vratiti)</span>
|
||
<span style="font-size:16px;font-weight:600;color:var(--uspeh);" x-text="fmtDin(kusurIznos()) + ' din'"></span>
|
||
</div>
|
||
<div>
|
||
<label class="polje-labela">Način plaćanja</label>
|
||
<select name="nacin_placanja" x-model="nacinPlacanja"
|
||
style="width:100%;padding:8px 12px;background:var(--pozadina);border:0.5px solid var(--ivica);border-radius:8px;color:var(--tekst-glavni);font-size:13px;">
|
||
<option value="gotovina">Gotovina</option>
|
||
<option value="kartica">Platna kartica</option>
|
||
<option value="prenos">Bankarski prenos</option>
|
||
</select>
|
||
</div>
|
||
<label style="display:flex;align-items:center;gap:10px;padding:10px 12px;background:var(--pozadina);border:0.5px solid var(--ivica);border-radius:8px;cursor:pointer;">
|
||
<input type="checkbox" name="prikazi_racun" value="1" x-model="prikaziRacun"
|
||
style="width:16px;height:16px;accent-color:var(--sb-akcent);cursor:pointer;flex-shrink:0;">
|
||
<span style="font-size:13px;color:var(--tekst-glavni);">Prikaži fiskalni račun</span>
|
||
</label>
|
||
<button type="submit" class="btn-primarno" style="width:100%;margin-top:4px;" :disabled="!naplataValidna()"
|
||
:style="!naplataValidna() ? 'opacity:0.4;cursor:not-allowed;' : ''" @click="pripremiFiskalniTab()">
|
||
Naplati
|
||
</button>
|
||
</div>
|
||
</dialog>
|
||
</form>
|
||
</div>
|
||
{{end}}
|