prodaja: popust, kategorija, cene po režimu, pretraga, zabrana brisanja

Migracija 092: popust_procenat na stavke_prodaje. Model: PopustProcenat u StavkaProdaje, KategorijaNaziv u StavkaProdajeSaArtiklom. Repo: pretraga prodaje proširena na klijenta i napomenu. DohvatiStavke dodaje popust i kategoriju. Kreiraj primenjuje popust na ukupno. Handler: artikalUJSONSaCenom proširen sa sifra, barkod, cena_sa_pdv, kategorija_naziv. parseFormuProdaje parsira popust. ObrisiProdaju sada koristi storno (zabrana fizičkog brisanja). JS: prodajaForma ažurirana — pretraga artikala po nazivu/šifri/barkodu, popust polje, kategorija, kalkulacija sa popustom. Forma: pretraga artikala, popust kolona, kategorija, PDV režim (cena/cena_sa_pdv). Responsive desktop+mobilne kartice. Detalji: kategorija ispod naziva, popust kolona, 'Ukloni nalog' (storno) umesto 'Obriši'.
2026-06-30 19:14:40 +02:00
parent 3c2dd06f28
commit ac7c9df2eb
7 changed files with 207 additions and 345 deletions
@@ -51,8 +51,8 @@ func (r *ProdajaRepo) Lista(ctx context.Context, pretraga string) ([]model.Proda
 	args := []any{}

 	if pretraga != "" {
-		upit += " AND pn.broj_naloga LIKE ?"
-		args = append(args, "%"+pretraga+"%")
+		upit += " AND (pn.broj_naloga LIKE ? OR kp.naziv LIKE ? OR pn.napomena LIKE ?)"
+		args = append(args, "%"+pretraga+"%", "%"+pretraga+"%", "%"+pretraga+"%")
 	}

 	upit += " ORDER BY pn.datum DESC"
@@ -122,10 +122,13 @@ func (r *ProdajaRepo) DohvatiID(ctx context.Context, id int64) (*model.ProdajniN
 // DohvatiStavke vraća stavke prodaje sa nazivima artikala i PDV podacima za dati nalog
 func (r *ProdajaRepo) DohvatiStavke(ctx context.Context, nalogID int64) ([]model.StavkaProdajeSaArtiklom, error) {
 	redovi, err := r.db.QueryContext(ctx, `
-		SELECT sp.id, sp.nalog_id, sp.artikal_id, sp.kolicina, sp.cena_po_komadu, sp.ukupno,
-		       sp.pdv_stopa, sp.pdv_iznos, sp.cena_bez_pdv, a.naziv, a.jedinica_mere
+		SELECT sp.id, sp.nalog_id, sp.artikal_id, sp.kolicina, sp.cena_po_komadu,
+		       sp.popust_procenat, sp.ukupno,
+		       sp.pdv_stopa, sp.pdv_iznos, sp.cena_bez_pdv,
+		       a.naziv, a.jedinica_mere, COALESCE(k.naziv, '') AS kategorija_naziv
 		FROM stavke_prodaje sp
 		JOIN artikli a ON a.id = sp.artikal_id
+		LEFT JOIN kategorije k ON k.id = a.kategorija_id
 		WHERE sp.nalog_id = ?
 		ORDER BY sp.id`, nalogID)
 	if err != nil {
@@ -138,9 +141,9 @@ func (r *ProdajaRepo) DohvatiStavke(ctx context.Context, nalogID int64) ([]model
 		var s model.StavkaProdajeSaArtiklom
 		err := redovi.Scan(
 			&s.ID, &s.NalogID, &s.ArtikalID, &s.Kolicina,
-			&s.CenaPoKomadu, &s.Ukupno,
+			&s.CenaPoKomadu, &s.PopustProcenat, &s.Ukupno,
 			&s.PdvStopa, &s.PdvIznos, &s.CenaBezPdv,
-			&s.ArtikalNaziv, &s.JedinicaMere,
+			&s.ArtikalNaziv, &s.JedinicaMere, &s.KategorijaNaziv,
 		)
 		if err != nil {
 			return nil, fmt.Errorf("ntech: ProdajaRepo.DohvatiStavke: scan: %w", err)
@@ -215,12 +218,17 @@ func (r *ProdajaRepo) Kreiraj(ctx context.Context, n *model.ProdajniNalog, stavk
 			pdvIznos = cenaBezPdv * s.PdvStopa / 100
 		}

-		ukupnoStavke := float64(s.Kolicina) * s.CenaPoKomadu
+		// popust umanjuje cenu po komadu pre računanja ukupnog i PDV-a
+		cenaPoslePopusta := s.CenaPoKomadu
+		if s.PopustProcenat > 0 {
+			cenaPoslePopusta = cenaPoslePopusta * (1 - s.PopustProcenat/100)
+		}
+		ukupnoStavke := float64(s.Kolicina) * cenaPoslePopusta
 		_, err = tx.ExecContext(ctx, `
 			INSERT INTO stavke_prodaje
-				(nalog_id, artikal_id, kolicina, cena_po_komadu, ukupno, pdv_stopa, pdv_iznos, cena_bez_pdv)
-			VALUES (?, ?, ?, ?, ?, ?, ?, ?)`,
-			nalogID, s.ArtikalID, s.Kolicina, s.CenaPoKomadu, ukupnoStavke,
+				(nalog_id, artikal_id, kolicina, cena_po_komadu, popust_procenat, ukupno, pdv_stopa, pdv_iznos, cena_bez_pdv)
+			VALUES (?, ?, ?, ?, ?, ?, ?, ?, ?)`,
+			nalogID, s.ArtikalID, s.Kolicina, s.CenaPoKomadu, s.PopustProcenat, ukupnoStavke,
 			s.PdvStopa, pdvIznos, cenaBezPdv,
 		)
 		if err != nil {
@@ -62,18 +62,32 @@ type PodaciStampeProdaje struct {
 	PIB          string
 }

-// artikalUJSONSaCenom pretvara listu artikala u template.JS vrednost sa prodajnom cenom, PDV stopom i stanjem
+// artikalUJSONSaCenom pretvara listu artikala u template.JS vrednost sa prodajnom cenom, PDV stopom, kategorijom i stanjem
 func artikalUJSONSaCenom(artikli []model.ArtikalSaKategorijom) template.JS {
 	type stavka struct {
-		ID       int64   `json:"id"`
-		Naziv    string  `json:"naziv"`
-		Cena     float64 `json:"cena"`
-		PdvStopa float64 `json:"pdv_stopa"`
-		Kolicina int     `json:"kolicina"`
+		ID              int64   `json:"id"`
+		Naziv           string  `json:"naziv"`
+		Sifra           string  `json:"sifra"`
+		Barkod          string  `json:"barkod"`
+		Cena            float64 `json:"cena"`
+		CenaSaPdv       float64 `json:"cena_sa_pdv"`
+		PdvStopa        float64 `json:"pdv_stopa"`
+		Kolicina        int     `json:"kolicina"`
+		KategorijaNaziv string  `json:"kategorija_naziv"`
 	}
 	lista := make([]stavka, 0, len(artikli))
 	for _, a := range artikli {
-		lista = append(lista, stavka{ID: a.ID, Naziv: a.Naziv, Cena: a.ProdajnaCena, PdvStopa: a.PdvStopa, Kolicina: a.Kolicina})
+		lista = append(lista, stavka{
+			ID:              a.ID,
+			Naziv:           a.Naziv,
+			Sifra:           a.Sifra,
+			Barkod:          a.Barkod,
+			Cena:            a.ProdajnaCena,
+			CenaSaPdv:       a.CenaSaPdv,
+			PdvStopa:        a.PdvStopa,
+			Kolicina:        a.Kolicina,
+			KategorijaNaziv: a.KategorijaNaziv,
+		})
 	}
 	b, _ := json.Marshal(lista)
 	return template.JS(b)
@@ -186,7 +200,11 @@ func (h *Handler) SacuvajProdaju(w http.ResponseWriter, r *http.Request) {

 	var ukupno float64
 	for _, s := range stavke {
-		ukupno += float64(s.Kolicina) * s.CenaPoKomadu
+		cenaPoslePopusta := s.CenaPoKomadu
+		if s.PopustProcenat > 0 {
+			cenaPoslePopusta = cenaPoslePopusta * (1 - s.PopustProcenat/100)
+		}
+		ukupno += float64(s.Kolicina) * cenaPoslePopusta
 	}
 	nalog.Ukupno = ukupno

@@ -394,9 +412,10 @@ func (h *Handler) StampaProdaje(w http.ResponseWriter, r *http.Request) {
 	h.renderujStandalone(w, "prodaja_stampa", podaci)
 }

-// ObrisiProdaju prima POST zahtev, vraća stanje na magacin i briše nalog
+// ObrisiProdaju prima POST zahtev i stornira nalog umesto fizičkog brisanja.
+// Jednom izdat račun ne sme da nestane — umesto brisanja koristi se storno.
 func (h *Handler) ObrisiProdaju(w http.ResponseWriter, r *http.Request) {
-	if _, ok := h.zahtevajDozvolu(w, r, "prodaja.obrisi"); !ok {
+	if _, ok := h.zahtevajDozvolu(w, r, "prodaja.storno"); !ok {
 		return
 	}
 	k := middleware.KorisnikIzKonteksta(r.Context())
@@ -406,9 +425,8 @@ func (h *Handler) ObrisiProdaju(w http.ResponseWriter, r *http.Request) {
 		return
 	}

-	if err := h.ProdajaRepo.Obrisi(r.Context(), id, &k.ID); err != nil {
-		http.Error(w, "Greška pri brisanju naloga", http.StatusInternalServerError)
-		return
+	if err := h.ProdajaRepo.Storno(r.Context(), id, "administrativno uklanjanje", &k.ID); err != nil {
+		slog.Error("greška pri uklanjanju naloga", "error", err)
 	}
 	// ukloni vezani auto-KIR zapis (ako ga je ova prodaja kreirala)
 	if err := h.PdvKirRepo.ObrisiPoIzvoru(r.Context(), "prodaja", id); err != nil {
@@ -438,6 +456,7 @@ func parseFormuProdaje(r *http.Request) (model.ProdajniNalog, []model.StavkaProd
 	kolicine := r.Form["kolicina[]"]
 	cene := r.Form["cena_po_komadu[]"]
 	pdvStope := r.Form["pdv_stopa[]"]
+	popusti := r.Form["popust[]"]

 	if len(artikalIDovi) == 0 {
 		return nalog, nil, "Prodaja mora imati najmanje jednu stavku."
@@ -469,11 +488,17 @@ func parseFormuProdaje(r *http.Request) (model.ProdajniNalog, []model.StavkaProd
 			pdvStopa, _ = strconv.ParseFloat(strings.TrimSpace(pdvStope[i]), 64)
 		}

+		var popust float64
+		if i < len(popusti) {
+			popust, _ = strconv.ParseFloat(strings.TrimSpace(popusti[i]), 64)
+		}
+
 		stavke = append(stavke, model.StavkaProdaje{
-			ArtikalID:    artikalID,
-			Kolicina:     kolicina,
-			CenaPoKomadu: cena,
-			PdvStopa:     pdvStopa,
+			ArtikalID:      artikalID,
+			Kolicina:       kolicina,
+			CenaPoKomadu:   cena,
+			PdvStopa:       pdvStopa,
+			PopustProcenat: popust,
 		})
 	}

@@ -17,15 +17,16 @@ type ProdajniNalog struct {

 // StavkaProdaje predstavlja jednu liniju (artikal) unutar prodaje
 type StavkaProdaje struct {
-	ID           int64
-	NalogID      int64
-	ArtikalID    int64
-	Kolicina     int
-	CenaPoKomadu float64
-	Ukupno       float64
-	PdvStopa     float64
-	PdvIznos     float64
-	CenaBezPdv   float64
+	ID             int64
+	NalogID        int64
+	ArtikalID      int64
+	Kolicina       int
+	CenaPoKomadu   float64
+	PopustProcenat float64 // rabat u procentima (npr. 10 = 10% popusta)
+	Ukupno         float64
+	PdvStopa       float64
+	PdvIznos       float64
+	CenaBezPdv     float64
 }

 // UkupnoBezPdv vraća ukupno bez PDV-a za stavku (CenaBezPdv × količina)
@@ -42,6 +43,7 @@ type ProdajniNalogSaDetaljem struct {
 // StavkaProdajeSaArtiklom je stavka prodaje sa nazivom artikla — za prikaz u detaljima
 type StavkaProdajeSaArtiklom struct {
 	StavkaProdaje
-	ArtikalNaziv string
-	JedinicaMere string
+	ArtikalNaziv    string
+	JedinicaMere    string
+	KategorijaNaziv string
 }
@@ -0,0 +1,4 @@
+-- Prodaja: popust na stavci (rabat u procentima)
+-- Neophodno za B2B fakture; PDV se obračunava na iznos posle popusta
+
+ALTER TABLE stavke_prodaje ADD COLUMN popust_procenat REAL NOT NULL DEFAULT 0;
@@ -136,18 +136,30 @@ document.addEventListener('alpine:init', () => {

    // forma za prodaju
    Alpine.data('prodajaForma', () => ({
-        stavke: [{artikal_id: '', kolicina: 1, cena: 0, pdv_stopa: 20}],
+        stavke: [{artikal_id: '', kolicina: 1, cena: 0, cena_sa_pdv: 0, pdv_stopa: 20, popust: 0, kategorija_naziv: ''}],
        artikliOpcije: [],
+        pretragaArtikal: '',
+        pdvObveznik: true,
        isMobile: false,
        init() {
            this.artikliOpcije = window._ntechArtikli || []
+            this.pdvObveznik = window._ntechPdvObveznik === true
            this.isMobile = window.matchMedia('(max-width: 768px)').matches
            window.matchMedia('(max-width: 768px)').addEventListener('change', e => {
                this.isMobile = e.matches
            })
        },
+        get filtriraniArtikli() {
+            const q = this.pretragaArtikal.trim().toLowerCase()
+            if (!q) return this.artikliOpcije.slice(0, 50)
+            return this.artikliOpcije.filter(a =>
+                (a.naziv || '').toLowerCase().includes(q) ||
+                (a.sifra || '').toLowerCase().includes(q) ||
+                (a.barkod || '').toLowerCase().includes(q)
+            ).slice(0, 30)
+        },
        dodajStavku() {
-            this.stavke.push({artikal_id: '', kolicina: 1, cena: 0, pdv_stopa: 20})
+            this.stavke.push({artikal_id: '', kolicina: 1, cena: 0, cena_sa_pdv: 0, pdv_stopa: 20, popust: 0, kategorija_naziv: ''})
        },
        ukloniStavku(i) {
            if (this.stavke.length > 1) this.stavke.splice(i, 1)
@@ -155,10 +167,15 @@ document.addEventListener('alpine:init', () => {
        popuniCenu(stavka) {
            const a = this.artikliOpcije.find(x => x.id == stavka.artikal_id)
            if (a) {
-                stavka.cena = a.cena
+                stavka.cena = a.cena || 0
+                stavka.cena_sa_pdv = a.cena_sa_pdv || 0
                stavka.pdv_stopa = a.pdv_stopa !== undefined ? a.pdv_stopa : 20
+                stavka.kategorija_naziv = a.kategorija_naziv || ''
            }
        },
+        prikaziCenu(stavka) {
+            return this.pdvObveznik ? (stavka.cena || 0) : (stavka.cena_sa_pdv || stavka.cena || 0)
+        },
        dostupnaKolicina(i) {
            const stavka = this.stavke[i]
            if (!stavka.artikal_id) return null
@@ -177,10 +194,18 @@ document.addEventListener('alpine:init', () => {
            return this.stavke.some((_, i) => this.prekoracenje(i))
        },
        ukupnoStavke(s) {
-            return (parseFloat(s.kolicina) * parseFloat(s.cena) || 0).toFixed(2)
+            const cena = parseFloat(s.cena) || 0
+            const popust = parseFloat(s.popust) || 0
+            const cenaPosle = popust > 0 ? cena * (1 - popust/100) : cena
+            return (parseFloat(s.kolicina) * cenaPosle || 0).toFixed(2)
        },
        ukupnoSvega() {
-            return this.stavke.reduce((z, s) => z + (parseFloat(s.kolicina) * parseFloat(s.cena) || 0), 0).toFixed(2)
+            return this.stavke.reduce((z, s) => {
+                const cena = parseFloat(s.cena) || 0
+                const popust = parseFloat(s.popust) || 0
+                const cenaPosle = popust > 0 ? cena * (1 - popust/100) : cena
+                return z + (parseFloat(s.kolicina) * cenaPosle || 0)
+            }, 0).toFixed(2)
        },
        // fmtDin formatira broj sa separatorom hiljada (tačka) i 2 decimale (zarez): 1234567.5 → "1.234.567,50"
        fmtDin(v) {
@@ -188,10 +188,21 @@
                font-size: 12px;
                font-weight: 500;
                color: var(--tekst-sporedni);
-                width: 140px;
+                width: 120px;
              ">
              Cena/kom
            </th>
+            <th
+              style="
+                padding: 10px 8px;
+                text-align: center;
+                font-size: 12px;
+                font-weight: 500;
+                color: var(--tekst-sporedni);
+                width: 60px;
+              ">
+              Popust
+            </th>
            {{if index .Moduli "pdv"}}<th style="padding:10px 20px;text-align:center;font-size:12px;font-weight:500;color:var(--tekst-sporedni);width:80px;">
              PDV %
            </th>{{end}}
@@ -203,9 +214,15 @@
        <tbody>
          {{range .Stavke}}
          <tr style="border-bottom: 0.5px solid var(--ivica)">
-            <td style="padding:10px 20px;font-size:14px;color:var(--tekst-glavni);">{{.ArtikalNaziv}}</td>
+            <td style="padding:10px 20px;font-size:14px;color:var(--tekst-glavni);">
+              {{.ArtikalNaziv}}
+              {{if .KategorijaNaziv}}<div style="font-size:11px;color:var(--tekst-sporedni);">{{.KategorijaNaziv}}</div>{{end}}
+            </td>
            <td style="padding:10px 20px;text-align:center;font-size:14px;color:var(--tekst-glavni);">{{.Kolicina}}</td>
            <td style="padding:10px 20px;text-align:right;font-size:14px;color:var(--tekst-sporedni);">{{dinari .CenaPoKomadu}} din</td>
+            <td style="padding:10px 8px;text-align:center;font-size:13px;color:var(--tekst-sporedni);">
+              {{if gt .PopustProcenat 0.0}}{{printf "%.1f" .PopustProcenat}}%{{else}}—{{end}}
+            </td>
            {{if index $.Moduli "pdv"}}<td style="padding:10px 20px;text-align:center;font-size:13px;color:var(--tekst-sporedni);">
              {{if .PdvStopa}}{{printf "%.0f" .PdvStopa}}%{{else}}—{{end}}
            </td>{{end}}
@@ -272,16 +289,16 @@
      {{if index $.Dozvole "prodaja.obrisi"}}
      <div style="display:flex;align-items:flex-start;gap:12px;flex-wrap:wrap;padding-top:14px;border-top:0.5px solid var(--ivica);">
        <div style="flex:1;min-width:200px;">
-          <div style="font-size:14px;font-weight:500;color:#dc2626;margin-bottom:4px;">Brisanje naloga</div>
+          <div style="font-size:14px;font-weight:500;color:#f97316;margin-bottom:4px;">Uklanjanje naloga</div>
          <div class="pomocni-tekst">
-            Brisanje je trajno.{{if not .Nalog.Stornirano}} Količine artikala biće vraćene na stanje u magacinu.{{end}}
+            Nalog će biti storniran (vraća artikle na stanje) i označen kao uklonjen. Ne briše se fizički — ostaje u evidenciji.
          </div>
        </div>
        <form method="POST" action="/prodaja/obrisi/{{.Nalog.ID}}">
          <input type="hidden" name="csrf_token" value="{{.CsrfToken}}">
-          <button type="submit" class="btn-opasno"
-            data-potvrda="Da li ste sigurni da želite da obrišete nalog {{.Nalog.BrojNaloga}}?">
-            Obriši nalog
+          <button type="submit" class="btn-upozorenje"
+            data-potvrda="Stornirati nalog {{.Nalog.BrojNaloga}}? Količine artikala biće vraćene na stanje.">
+            Ukloni nalog
          </button>
        </form>
      </div>
@@ -4,28 +4,18 @@
  .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; }
 </style>
 {{end}} {{define "sadrzaj"}}

-<!-- lista artikala kao JSON — sadrži id, naziv i prodajnu cenu -->
 <script>
-  var _ntechArtikli = {{.ArtikliJSON }};
+  var _ntechArtikli = {{.ArtikliJSON}};
+  var _ntechPdvObveznik = {{if index .Moduli "pdv"}}true{{else}}false{{end}};
 </script>

 <div style="width: 100%" x-data="prodajaForma">
-  <!-- nazad dugme -->
  <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">
+    <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
@@ -38,17 +28,11 @@

    <!-- zaglavlje prodaje -->
    <div class="kartica forma-kartica animiraj" style="margin-bottom: 16px">
-      <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 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 class="forma-grid-2" style="display:grid;grid-template-columns:1fr 1fr;gap:12px;">
+        <div style="display:grid;grid-template-columns:1fr 1fr;gap:12px;">
          <div>
            <label class="polje-labela">Klijent</label>
            <select name="klijent_id" style="width: 100%">
@@ -69,202 +53,82 @@
        </div>
        <div>
          <label class="polje-labela">Napomena</label>
-          <textarea name="napomena" rows="2"
-            placeholder="Interna napomena o prodaji..."
-            style="width: 100%; resize: vertical"></textarea>
+          <textarea name="napomena" rows="2" placeholder="Interna napomena o prodaji..." style="width: 100%; resize: vertical"></textarea>
        </div>
      </div>
    </div>

    <!-- stavke -->
    <div class="kartica forma-kartica animiraj" style="margin-bottom: 16px">
-      <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">
+      <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 -->
+      <div style="margin-bottom:12px;">
+        <input type="text" x-model="pretragaArtikal" placeholder="Pretraži artikle po nazivu, šifri ili barkodu..." style="width:100%;">
+      </div>
+
      <!-- desktop tabela stavki -->
      <div class="stavke-tabela-wrapper" style="overflow-x: auto">
        <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;
-                ">
-                Količina
-              </th>
-              <th
-                style="
-                  padding: 8px 10px;
-                  text-align: right;
-                  font-size: 12px;
-                  font-weight: 500;
-                  color: var(--tekst-sporedni);
-                  width: 140px;
-                ">
-                Cena/kom (din)
-              </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>
+              <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</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">
+                <td style="padding: 8px 10px;">
                  <input type="hidden" :name="'pdv_stopa[]'" :value="stavka.pdv_stopa">
-                  <select
-                    :name="'artikal_id[]'"
-                    x-model="stavka.artikal_id"
-                    @change="popuniCenu(stavka)"
-                    :disabled="isMobile"
-                    style="width: 100%">
+                  <select :name="'artikal_id[]'" x-model="stavka.artikal_id" @change="popuniCenu(stavka)" :disabled="isMobile" style="width: 100%">
                    <option value="">— odaberi artikal —</option>
-                    <template x-for="a in artikliOpcije" :key="a.id">
-                      <option :value="a.id" x-text="a.naziv"></option>
+                    <template x-for="a in filtriraniArtikli" :key="a.id">
+                      <option :value="a.id" x-text="a.naziv + (a.kategorija_naziv ? ' [' + a.kategorija_naziv + ']' : '')"></option>
                    </template>
                  </select>
+                  <div x-show="stavka.kategorija_naziv" style="font-size:11px;color:var(--tekst-sporedni);margin-top:2px;" 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="prekoracenje(i) ? 'color:#dc2626' : 'color:var(--tekst-sporedni)'"
-                    x-text="'Na stanju: ' + dostupnaKolicina(i)"
-                    style="
-                      font-size: 11px;
-                      margin-top: 3px;
-                      text-align: center;
-                      white-space: nowrap;
-                    "></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
+                  <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="prekoracenje(i) ? 'color:#dc2626' : 'color:var(--tekst-sporedni)'"
+                    x-text="'Na stanju: ' + dostupnaKolicina(i)" style="font-size: 11px; margin-top: 3px; text-align: center; white-space: nowrap;"></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">
+                  <div style="display:flex;flex-direction:column;gap:2px;">
+                    <input type="number" :name="'cena_po_komadu[]'" x-model="stavka.cena" min="0" step="0.01" :disabled="isMobile" style="width: 100%; text-align: right" />
+                    <span x-show="pdvObveznik && stavka.pdv_stopa > 0" style="font-size:10px;color:var(--tekst-sporedni);text-align:right;" x-text="'+PDV ' + stavka.pdv_stopa + '%'"></span>
                  </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" />
+                  <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);
-                  ">
+                <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="stavke.length > 1"
-                    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>
+                  <button type="button" @click="ukloniStavku(i)" x-show="stavke.length > 1"
+                    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>
            <tr style="border-top: 0.5px solid var(--ivica)">
-              <td
-                colspan="3"
-                style="
-                  padding: 10px;
-                  text-align: right;
-                  font-size: 13px;
-                  color: var(--tekst-sporedni);
-                  font-weight: 500;
-                ">
-                Ukupno:
-              </td>
-              <td
-                style="
-                  padding: 10px;
-                  text-align: right;
-                  font-size: 15px;
-                  font-weight: 600;
-                  color: var(--tekst-glavni);
-                ">
+              <td colspan="4" style="padding: 10px; text-align: right; font-size: 13px; color: var(--tekst-sporedni); font-weight: 500;">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>
@@ -274,134 +138,55 @@
      </div>

      <!-- mobilne kartice stavki -->
-      <div
-        class="stavke-kartice"
-        style="display: none; flex-direction: column; gap: 10px">
+      <div class="stavke-kartice" style="display: none; flex-direction: column; gap: 10px">
+        <!-- pretraga na mobilnom -->
+        <input type="text" x-model="pretragaArtikal" placeholder="Pretraži artikle..." style="width:100%;">
        <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="stavke.length > 1"
-                style="
-                  background: none;
-                  border: 0.5px solid #dc2626;
-                  color: #dc2626;
-                  cursor: pointer;
-                  font-size: 13px;
-                  padding: 2px 8px;
-                  border-radius: 4px;
-                ">
-                Ukloni
-              </button>
+          <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="stavke.length > 1"
+                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">
+              <!-- kategorija badge -->
+              <div x-show="stavka.kategorija_naziv" style="font-size:11px;color:var(--tekst-sporedni);background:var(--pozadina);padding:2px 8px;border-radius:4px;align-self:flex-start;" x-text="stavka.kategorija_naziv"></div>
              <div>
-                <label
-                  style="
-                    font-size: 12px;
-                    color: var(--tekst-sporedni);
-                    display: block;
-                    margin-bottom: 4px;
-                  ">Artikal</label>
-                <select
-                  :name="'artikal_id[]'"
-                  x-model="stavka.artikal_id"
-                  @change="popuniCenu(stavka)"
-                  :disabled="!isMobile"
-                  style="width: 100%">
+                <label class="polje-labela">Artikal</label>
+                <select :name="'artikal_id[]'" x-model="stavka.artikal_id" @change="popuniCenu(stavka)" :disabled="!isMobile" style="width: 100%">
                  <option value="">— odaberi artikal —</option>
-                  <template x-for="a in artikliOpcije" :key="a.id">
+                  <template x-for="a in filtriraniArtikli" :key="a.id">
                    <option :value="a.id" x-text="a.naziv"></option>
                  </template>
                </select>
              </div>
-              <div class="forma-grid-2" style="gap: 10px">
+              <div style="display:grid;grid-template-columns:1fr 1fr;gap:10px;">
                <div>
-                  <label
-                    style="
-                      font-size: 12px;
-                      color: var(--tekst-sporedni);
-                      display: block;
-                      margin-bottom: 4px;
-                    ">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="prekoracenje(i) ? 'color:#dc2626' : 'color:var(--tekst-sporedni)'"
-                    x-text="'Na stanju: ' + dostupnaKolicina(i)"
-                    style="font-size: 11px; margin-top: 3px"></div>
-                  <div
-                    x-show="prekoracenje(i)"
-                    style="font-size: 11px; color: #dc2626; margin-top: 1px">
-                    Prekoračena količina
-                  </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="prekoracenje(i) ? 'color:#dc2626' : 'color:var(--tekst-sporedni)'"
+                    x-text="'Na stanju: ' + dostupnaKolicina(i)" style="font-size: 11px; margin-top: 3px;"></div>
                </div>
                <div>
-                  <label
-                    style="
-                      font-size: 12px;
-                      color: var(--tekst-sporedni);
-                      display: block;
-                      margin-bottom: 4px;
-                    ">Cena/kom (din)</label>
-                  <input
-                    type="number"
-                    :name="'cena_po_komadu[]'"
-                    x-model="stavka.cena"
-                    min="0"
-                    step="0.01"
-                    :disabled="!isMobile"
-                    style="width: 100%" />
+                  <label class="polje-labela">Cena/kom (din)</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="
-                  text-align: right;
-                  font-size: 14px;
-                  font-weight: 500;
-                  color: var(--tekst-glavni);
-                ">
-                Ukupno: <span x-text="fmtDin(ukupnoStavke(stavka)) + ' din'"></span>
+              <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
-          style="
-            text-align: right;
-            font-size: 15px;
-            font-weight: 600;
-            color: var(--tekst-glavni);
-            padding: 8px 4px;
-          ">
+        <div style="text-align: right; font-size: 15px; font-weight: 600; color: var(--tekst-glavni); padding: 8px 4px;">
          Ukupno: <span x-text="fmtDin(ukupnoSvega()) + ' din'"></span>
        </div>
      </div>
@@ -410,14 +195,10 @@
    <!-- 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="submit"
-        class="btn-primarno"
-        :disabled="imaPrekoracenja()"
-        :style="imaPrekoracenja() ? 'opacity:0.4;cursor:not-allowed;' : ''">
+      <button type="submit" class="btn-primarno" :disabled="imaPrekoracenja()" :style="imaPrekoracenja() ? 'opacity:0.4;cursor:not-allowed;' : ''">
        Sačuvaj prodaju
      </button>
    </div>
  </form>
 </div>
-{{end}}
+{{end}}