Servis: prijem-fokusirana forma, kanban tabla i arhiva

Novi nalog svodi se na prijem (Avans/kapara + Napomena); status/datumi/garancija
i procene/cena rada vidljivi samo u izmeni. Stranica Servis postaje kanban tabla
sa 5 aktivnih kolona (Primljeno → ... → Završeno), mobilni vertikalno. Preuzeti
nalozi izdvojeni u arhivu (GET /servis/arhiva, servis_arhiva.html).

cmd/ntech/main.go

@@ -336,6 +336,7 @@ func main() {
 		r.With(doz("klijent.izmeni")).Post("/klijenti/izmeni/{id}", h.SacuvajIzmenuKlijenta)
 		r.With(doz("klijent.obrisi")).Post("/klijenti/obrisi/{id}", h.ObrisiKlijenta)
 		r.With(ntechmw.RequireDozvola(h.DozvoleRepo.ImaDozvolu, "servis.pregled")).Get("/servis", h.Servis)
+		r.With(ntechmw.RequireDozvola(h.DozvoleRepo.ImaDozvolu, "servis.pregled")).Get("/servis/arhiva", h.ArhivaServisa)
 		r.Get("/servis/novi", h.NoviNalog)
 		r.With(doz("servis.dodaj")).Post("/servis/novi", h.SacuvajNalog)
 		r.Get("/servis/izmeni/{id}", h.IzmeniNalog)

internal/handler/kes.go

@@ -36,7 +36,7 @@ var saSidebar = []string{
 	"podsetnici", "podsetnik_forma",
 	"profil_tema",
 	"prodaja", "prodaja_detalji", "prodaja_forma",
-	"servis", "servis_forma", "servis_detalji",
+	"servis", "servis_arhiva", "servis_forma", "servis_detalji",
 }
 
 // standalone su šabloni bez base layouta

internal/handler/servis.go

@@ -88,6 +88,35 @@ func (h *Handler) Servis(w http.ResponseWriter, r *http.Request) {
 	h.renderujTemplate(w, "servis", podaci)
 }
 
+// ArhivaServisa prikazuje preuzete naloge — oni napuštaju kanban tablu i ovde se
+// pretražuju, da tabla ostane pregledna i pokazuje samo aktivan rad
+func (h *Handler) ArhivaServisa(w http.ResponseWriter, r *http.Request) {
+	podesavanja, err := sqlite.DohvatiSvaPodesavanja(r.Context(), h.DB)
+	if err != nil {
+		http.Error(w, "Greška pri učitavanju podešavanja", http.StatusInternalServerError)
+		return
+	}
+
+	pretraga := r.URL.Query().Get("pretraga")
+	nalozi, err := h.ServisRepo.Lista(r.Context(), pretraga, model.StatusPreuzeto)
+	if err != nil {
+		http.Error(w, "Greška pri učitavanju naloga", http.StatusInternalServerError)
+		return
+	}
+
+	ps := h.popuniPodaciStranice(r, podesavanja)
+	ps.Stranica = "servis"
+	ps.NaslovStranice = "Arhiva servisa"
+	podaci := PodaciServisa{
+		PodaciStranice: ps,
+		Nalozi:         nalozi,
+		Pretraga:       pretraga,
+		SviStatusi:     model.SviStatusi,
+	}
+
+	h.renderujTemplate(w, "servis_arhiva", podaci)
+}
+
 // NoviNalog generiše broj naloga i prikazuje praznu formu za unos
 func (h *Handler) NoviNalog(w http.ResponseWriter, r *http.Request) {
 	podesavanja, err := sqlite.DohvatiSvaPodesavanja(r.Context(), h.DB)

web/static/css/main.css

@@ -1227,6 +1227,49 @@ select {
 .pod-kartice      { display: none; flex-direction: column; gap: 12px; }
 .stavke-kartice   { display: none; flex-direction: column; gap: 10px; }
 
+/* === servis kanban tabla === */
+.servis-kanban {
+    display: flex;
+    gap: 12px;
+    overflow-x: auto;
+    padding-bottom: 10px;
+    align-items: flex-start;
+}
+.kanban-kolona {
+    flex: 0 0 250px;
+    display: flex;
+    flex-direction: column;
+    gap: 10px;
+    background: var(--pozadina-hover);
+    border: 0.5px solid var(--ivica);
+    border-radius: 12px;
+    padding: 10px;
+}
+.kanban-naslov {
+    display: flex;
+    align-items: center;
+    padding: 2px 2px 8px;
+    border-bottom: 0.5px solid var(--ivica);
+}
+.kanban-kartice {
+    display: flex;
+    flex-direction: column;
+    gap: 10px;
+    min-height: 16px;
+}
+/* kartica naloga u koloni — nasleđuje .kartica, dodaje kompaktan padding i hover */
+.kanban-karta {
+    display: block;
+    text-decoration: none;
+    padding: 12px;
+    cursor: pointer;
+    transition: transform 0.1s ease, box-shadow 0.1s ease;
+}
+.kanban-karta:hover {
+    transform: translateY(-1px);
+    box-shadow: 0 2px 10px rgba(0, 0, 0, 0.12);
+}
+
 @media (max-width: 768px) {
     .nabavke-tabela     { display: none; } .nabavke-kartice  { display: flex; }
     .dobavljaci-tabela  { display: none; } .dobavljaci-kartice { display: flex; }
@@ -1237,6 +1280,10 @@ select {
     .pod-tabela         { display: none; } .pod-kartice      { display: flex; }
     .stavke-tabela-wrapper { display: none; } .stavke-kartice { display: flex; }
     .forma-grid-4       { grid-template-columns: 1fr 1fr !important; }
+
+    /* kanban: na telefonu kolone idu vertikalno (jedna ispod druge), bez scrola */
+    .servis-kanban { flex-direction: column; overflow-x: visible; }
+    .kanban-kolona { flex: 1 1 auto; width: 100%; }
 }
 
 /* podešavanja — raspored pozadine */

web/templates/stranice/servis.html

@@ -29,126 +29,49 @@
             <input type="text" name="pretraga" value="{{.Pretraga}}"
                 placeholder="Pretraži po broju naloga ili uređaju..."
                 style="flex:1;min-width:160px;">
-            <select name="status" style="min-width:160px;">
+            <button type="submit" class="btn-primarno" style="flex-shrink:0;">Traži</button>
-                <option value="">— svi statusi —</option>
+            <a href="/servis/arhiva" class="btn-sekundarno" style="white-space:nowrap;flex-shrink:0;">Arhiva</a>
-                {{range .SviStatusi}}
-                <option value="{{.}}" {{if eq . $.FilterStatus}}selected{{end}}>{{.}}</option>
-                {{end}}
-            </select>
             <a href="/servis/novi" class="btn-primarno" style="white-space:nowrap;flex-shrink:0;">+ Novi nalog</a>
         </div>
-        <div>
-            <button type="submit" class="btn-primarno">Traži</button>
-        </div>
     </form>
 
-    <!-- desktop tabela -->
+    <!-- kanban tabla: kolona po statusu; nalog je kartica u koloni svog statusa.
-    <div class="kartica servis-tabela animiraj" style="padding:0;overflow:hidden;">
+         Klik na karticu otvara detalj naloga. Horizontalni scroll na užim ekranima. -->
-        <div style="overflow-x:auto;">
+    {{if .Nalozi}}
-            <table class="tabela">
+    <div class="servis-kanban animiraj">
-                <thead>
+        {{range $status := .SviStatusi}}
-                    <tr style="border-bottom:0.5px solid var(--ivica);">
+        {{if ne $status "Preuzeto"}}
-                        <th style="padding:12px 16px;text-align:left;font-size:12px;font-weight:500;color:var(--tekst-sporedni);">Broj naloga</th>
+        <div class="kanban-kolona">
-                        <th style="padding:12px 16px;text-align:left;font-size:12px;font-weight:500;color:var(--tekst-sporedni);">Klijent</th>
+            <div class="kanban-naslov">
-                        <th style="padding:12px 16px;text-align:left;font-size:12px;font-weight:500;color:var(--tekst-sporedni);">Uređaj</th>
+                {{template "status-badge" $status}}
-                        <th style="padding:12px 16px;text-align:left;font-size:12px;font-weight:500;color:var(--tekst-sporedni);">Status</th>
+            </div>
-                        <th style="padding:12px 16px;text-align:left;font-size:12px;font-weight:500;color:var(--tekst-sporedni);">Datum prijema</th>
+            <div class="kanban-kartice">
-                        <th style="padding:12px 16px;text-align:center;font-size:12px;font-weight:500;color:var(--tekst-sporedni);">Akcije</th>
+                {{range $.Nalozi}}
-                    </tr>
+                {{if eq .Status $status}}
-                </thead>
+                <a href="/servis/{{.ID}}" class="kartica kanban-karta">
-                <tbody>
+                    <div style="font-size:14px;font-weight:500;color:var(--sb-akcent);font-family:monospace;">
-                    {{range .Nalozi}}
-                    <tr class="animiraj red-tabele">
-                        <td style="padding:12px 16px;">
-                            <a href="/servis/{{.ID}}"
-                                style="font-size:14px;font-weight:500;color:var(--sb-akcent);text-decoration:none;font-family:monospace;">
-                                {{.BrojNaloga}}
-                            </a>
-                        </td>
-                        <td style="padding:12px 16px;font-size:13px;color:var(--tekst-sporedni);">
-                            {{if .KlijentNaziv}}{{.KlijentNaziv}}{{else}}—{{end}}
-                        </td>
-                        <td style="padding:12px 16px;font-size:14px;color:var(--tekst-glavni);">{{.Uredjaj}}</td>
-                        <td style="padding:12px 16px;">
-                            {{template "status-badge" .Status}}
-                        </td>
-                        <td style="padding:12px 16px;font-size:13px;color:var(--tekst-sporedni);">
-                            {{.DatumPrijema.Format "02.01.2006."}}
-                        </td>
-                        <td style="padding:12px 16px;text-align:center;">
-                            <div style="display:flex;align-items:center;justify-content:center;gap:8px;">
-                                <a href="/servis/izmeni/{{.ID}}" class="btn-primarno-malo">
-                                    Izmeni
-                                </a>
-                                {{if index $.Dozvole "servis.obrisi"}}
-                                <form method="POST" action="/servis/obrisi/{{.ID}}" style="display:inline;">
-                                    <button type="submit" class="btn-obrisi-malo"
-                                        data-potvrda="Da li ste sigurni da želite da obrišete nalog {{.BrojNaloga}}?">
-                                        Obriši
-                                    </button>
-                                </form>
-                                {{end}}
-                            </div>
-                        </td>
-                    </tr>
-                    {{else}}
-                    <tr>
-                        <td colspan="6" style="padding:32px;text-align:center;font-size:14px;color:var(--tekst-sporedni);">
-                            {{if or $.Pretraga $.FilterStatus}}Za datu pretragu nema servisnih naloga u bazi.{{else}}Nema servisnih naloga. <a href="/servis/novi" style="color:var(--sb-akcent);">Dodaj prvi nalog.</a>{{end}}
-                        </td>
-                    </tr>
-                    {{end}}
-                </tbody>
-            </table>
-        </div>
-    </div>
-
-    <!-- mobilne kartice -->
-    <div class="servis-kartice">
-        {{range .Nalozi}}
-        <div class="kartica servis-kartica animiraj">
-            <div class="red-izmedju" style="align-items:flex-start;gap:12px;margin-bottom:10px;">
-                <div>
-                    <a href="/servis/{{.ID}}"
-                        style="font-size:15px;font-weight:500;color:var(--sb-akcent);text-decoration:none;font-family:monospace;">
                         {{.BrojNaloga}}
-                    </a>
+                    </div>
-                    <div style="font-size:13px;color:var(--tekst-glavni);margin-top:2px;">{{.Uredjaj}}</div>
+                    <div style="font-size:13px;color:var(--tekst-glavni);margin-top:4px;">{{.Uredjaj}}</div>
-                </div>
+                    {{if .KlijentNaziv}}
-                <div style="display:flex;gap:8px;flex-shrink:0;align-items:center;">
+                    <div style="font-size:12px;color:var(--tekst-sporedni);margin-top:4px;">{{.KlijentNaziv}}</div>
-                    {{template "status-badge" .Status}}
+                    {{end}}
-                </div>
+                    <div style="font-size:11px;color:var(--tekst-sporedni);margin-top:6px;">
-            </div>
+                        {{.DatumPrijema.Format "02.01.2006."}}
-            <div style="display:flex;flex-direction:column;gap:6px;margin-bottom:10px;">
+                    </div>
-                {{if .KlijentNaziv}}
-                <div class="pomocni-tekst">
-                    <span style="color:var(--tekst-glavni);font-weight:500;">Klijent:</span> {{.KlijentNaziv}}
-                </div>
-                {{end}}
-                <div style="font-size:12px;color:var(--tekst-sporedni);">
-                    Primljeno: {{.DatumPrijema.Format "02.01.2006."}}
-                </div>
-            </div>
-            <div style="display:flex;gap:8px;">
-                <a href="/servis/izmeni/{{.ID}}" class="btn-primarno-malo">
-                    Izmeni
                 </a>
-                {{if index $.Dozvole "servis.obrisi"}}
+                {{end}}
-                <form method="POST" action="/servis/obrisi/{{.ID}}" style="display:inline;">
-                    <button type="submit" class="btn-obrisi-malo"
-                        data-potvrda="Da li ste sigurni da želite da obrišete nalog {{.BrojNaloga}}?">
-                        Obriši
-                    </button>
-                </form>
                 {{end}}
             </div>
         </div>
-        {{else}}
+        {{end}}
-        <div style="padding:32px;text-align:center;font-size:14px;color:var(--tekst-sporedni);">
-            {{if or $.Pretraga $.FilterStatus}}Za datu pretragu nema servisnih naloga u bazi.{{else}}Nema servisnih naloga. <a href="/servis/novi" style="color:var(--sb-akcent);">Dodaj prvi nalog.</a>{{end}}
-        </div>
         {{end}}
     </div>
+    {{else}}
+    <div class="kartica animiraj" style="padding:32px;text-align:center;font-size:14px;color:var(--tekst-sporedni);">
+        {{if .Pretraga}}Za datu pretragu nema servisnih naloga u bazi.{{else}}Nema servisnih naloga. <a href="/servis/novi" style="color:var(--sb-akcent);">Dodaj prvi nalog.</a>{{end}}
+    </div>
+    {{end}}
 
 </div>
 {{end}}

web/templates/stranice/servis_arhiva.html

@@ -0,0 +1,107 @@
+{{template "base" .}}
+
+{{define "naslov"}}Arhiva servisa — NTech{{end}}
+
+{{define "status-badge"}}
+{{if eq . "Primljeno"}}<span class="status-badge status-primljeno">{{.}}</span>
+{{else if eq . "U dijagnostici"}}<span class="status-badge status-dijagnostika">{{.}}</span>
+{{else if eq . "Čeka delove"}}<span class="status-badge status-ceka">{{.}}</span>
+{{else if eq . "U popravci"}}<span class="status-badge status-popravka">{{.}}</span>
+{{else if eq . "Završeno"}}<span class="status-badge status-zavrseno">{{.}}</span>
+{{else if eq . "Preuzeto"}}<span class="status-badge status-preuzeto">{{.}}</span>
+{{else}}<span class="status-badge status-primljeno">{{.}}</span>
+{{end}}
+{{end}}
+
+{{define "sadrzaj"}}
+<div class="kolona" style="gap:16px;">
+
+    <!-- gornja traka: pretraga + povratak na kanban tablu -->
+    <form method="GET" action="/servis/arhiva" class="kolona" style="gap:8px;">
+        <div style="display:flex;gap:8px;flex-wrap:wrap;align-items:center;">
+            <input type="text" name="pretraga" value="{{.Pretraga}}"
+                placeholder="Pretraži preuzete naloge po broju ili uređaju..."
+                style="flex:1;min-width:160px;">
+            <button type="submit" class="btn-primarno" style="flex-shrink:0;">Traži</button>
+            <a href="/servis" class="btn-sekundarno" style="white-space:nowrap;flex-shrink:0;">← Tabla</a>
+        </div>
+    </form>
+
+    <!-- desktop tabela -->
+    <div class="kartica servis-tabela animiraj" style="padding:0;overflow:hidden;">
+        <div style="overflow-x:auto;">
+            <table class="tabela">
+                <thead>
+                    <tr style="border-bottom:0.5px solid var(--ivica);">
+                        <th style="padding:12px 16px;text-align:left;font-size:12px;font-weight:500;color:var(--tekst-sporedni);">Broj naloga</th>
+                        <th style="padding:12px 16px;text-align:left;font-size:12px;font-weight:500;color:var(--tekst-sporedni);">Klijent</th>
+                        <th style="padding:12px 16px;text-align:left;font-size:12px;font-weight:500;color:var(--tekst-sporedni);">Uređaj</th>
+                        <th style="padding:12px 16px;text-align:left;font-size:12px;font-weight:500;color:var(--tekst-sporedni);">Primljeno</th>
+                        <th style="padding:12px 16px;text-align:left;font-size:12px;font-weight:500;color:var(--tekst-sporedni);">Završeno</th>
+                        <th style="padding:12px 16px;text-align:center;font-size:12px;font-weight:500;color:var(--tekst-sporedni);">Akcije</th>
+                    </tr>
+                </thead>
+                <tbody>
+                    {{range .Nalozi}}
+                    <tr class="animiraj red-tabele">
+                        <td style="padding:12px 16px;">
+                            <a href="/servis/{{.ID}}"
+                                style="font-size:14px;font-weight:500;color:var(--sb-akcent);text-decoration:none;font-family:monospace;">
+                                {{.BrojNaloga}}
+                            </a>
+                        </td>
+                        <td style="padding:12px 16px;font-size:13px;color:var(--tekst-sporedni);">
+                            {{if .KlijentNaziv}}{{.KlijentNaziv}}{{else}}—{{end}}
+                        </td>
+                        <td style="padding:12px 16px;font-size:14px;color:var(--tekst-glavni);">{{.Uredjaj}}</td>
+                        <td style="padding:12px 16px;font-size:13px;color:var(--tekst-sporedni);">
+                            {{.DatumPrijema.Format "02.01.2006."}}
+                        </td>
+                        <td style="padding:12px 16px;font-size:13px;color:var(--tekst-sporedni);">
+                            {{if .DatumZavrsetka}}{{.DatumZavrsetka.Format "02.01.2006."}}{{else}}—{{end}}
+                        </td>
+                        <td style="padding:12px 16px;text-align:center;">
+                            <a href="/servis/{{.ID}}" class="btn-primarno-malo">Otvori</a>
+                        </td>
+                    </tr>
+                    {{else}}
+                    <tr>
+                        <td colspan="6" style="padding:32px;text-align:center;font-size:14px;color:var(--tekst-sporedni);">
+                            {{if .Pretraga}}Za datu pretragu nema preuzetih naloga u bazi.{{else}}Još nema preuzetih naloga u arhivi.{{end}}
+                        </td>
+                    </tr>
+                    {{end}}
+                </tbody>
+            </table>
+        </div>
+    </div>
+
+    <!-- mobilne kartice -->
+    <div class="servis-kartice">
+        {{range .Nalozi}}
+        <a href="/servis/{{.ID}}" class="kartica servis-kartica animiraj kartica-link">
+            <div class="red-izmedju" style="align-items:flex-start;gap:12px;margin-bottom:10px;">
+                <div>
+                    <div style="font-size:15px;font-weight:500;color:var(--sb-akcent);font-family:monospace;">{{.BrojNaloga}}</div>
+                    <div style="font-size:13px;color:var(--tekst-glavni);margin-top:2px;">{{.Uredjaj}}</div>
+                </div>
+                <div style="flex-shrink:0;">{{template "status-badge" .Status}}</div>
+            </div>
+            {{if .KlijentNaziv}}
+            <div class="pomocni-tekst" style="margin-bottom:6px;">
+                <span style="color:var(--tekst-glavni);font-weight:500;">Klijent:</span> {{.KlijentNaziv}}
+            </div>
+            {{end}}
+            <div style="font-size:12px;color:var(--tekst-sporedni);">
+                Primljeno: {{.DatumPrijema.Format "02.01.2006."}}{{if .DatumZavrsetka}} · Završeno: {{.DatumZavrsetka.Format "02.01.2006."}}{{end}}
+            </div>
+        </a>
+        {{else}}
+        <div style="padding:32px;text-align:center;font-size:14px;color:var(--tekst-sporedni);">
+            {{if .Pretraga}}Za datu pretragu nema preuzetih naloga u bazi.{{else}}Još nema preuzetih naloga u arhivi.{{end}}
+        </div>
+        {{end}}
+    </div>
+
+</div>
+{{end}}

web/templates/stranice/servis_forma.html

@@ -244,6 +244,9 @@
         </div>
 
         <!-- ===================== KARTICA: STATUS I DATUMI ===================== -->
+        <!-- prikazuje se samo pri izmeni — pri prijemu (novom nalogu) status je
+             "Primljeno", a datumi i garancija se popunjavaju kasnije -->
+        {{if .Izmena}}
         <div class="kartica forma-kartica animiraj">
             <div class="sekcija-naslov">Status i datumi</div>
             <div class="kolona" style="gap:12px;">
@@ -290,10 +293,13 @@
                 </div>
             </div>
         </div>
+        {{end}}
 
         <!-- ===================== KARTICA: CENE I NAPOMENA ===================== -->
         <div class="kartica forma-kartica animiraj">
-            <div class="sekcija-naslov">Cene (din)</div>
+            <div class="sekcija-naslov">{{if .Izmena}}Cene (din){{else}}Avans i napomena{{end}}</div>
+            {{if .Izmena}}
+            <!-- procene i cena rada — popunjavaju se tek po dijagnostici/završetku -->
             <div class="forma-grid-4" style="display:grid;grid-template-columns:1fr 1fr 1fr 1fr;gap:12px;">
                 <div>
                     <label class="polje-labela">Procena od</label>
@@ -320,6 +326,17 @@
                         placeholder="0" style="width:100%;">
                 </div>
             </div>
+            {{else}}
+            <!-- novi nalog: pri prijemu se zna samo eventualni avans/kapara -->
+            <div class="forma-grid-2" style="display:grid;grid-template-columns:1fr 1fr;gap:12px;">
+                <div>
+                    <label class="polje-labela">Avans / kapara</label>
+                    <input type="number" name="avans" min="0" step="0.01"
+                        value="{{if .Nalog.Avans}}{{.Nalog.Avans}}{{end}}"
+                        placeholder="0" style="width:100%;">
+                </div>
+            </div>
+            {{end}}
             <div style="margin-top:16px;">
                 <label class="polje-labela">Napomena</label>
                 <textarea name="napomena" rows="2"