Update quantity field to show sum of all inventory types

- Remove "količina" from Refill, Vakuum, and Otvoreno labels
- Move Količina field to end of form as "Ukupna količina" (Total quantity)
- Make Količina field read-only and calculate sum of all inventory types
- Update form submission to calculate total quantity automatically
- Update tests to reflect new label changes

🤖 Generated with [Claude Code](https://claude.ai/code)

Co-Authored-By: DaX <noreply@anthropic.com>
This commit is contained in:
DaX
2025-06-27 01:42:11 +02:00
parent fa59df4c3d
commit 06025623ff
2 changed files with 37 additions and 21 deletions

View File

@@ -29,9 +29,10 @@ describe('UI Features Tests', () => {
expect(adminContent).toMatch(/type="number"[\s\S]*?name="refill"/);
expect(adminContent).toMatch(/type="number"[\s\S]*?name="vakum"/);
expect(adminContent).toMatch(/type="number"[\s\S]*?name="otvoreno"/);
expect(adminContent).toContain('Refill količina');
expect(adminContent).toContain('Vakuum količina');
expect(adminContent).toContain('Otvoreno količina');
expect(adminContent).toContain('Refill');
expect(adminContent).toContain('Vakuum');
expect(adminContent).toContain('Otvoreno');
expect(adminContent).toContain('Ukupna količina');
});
it('should have number input for quantity', () => {

View File

@@ -421,9 +421,19 @@ function FilamentForm({
const handleSubmit = (e: React.FormEvent) => {
e.preventDefault();
// Calculate total quantity
const refillCount = parseInt(formData.refill) || (formData.refill?.toLowerCase() === 'da' ? 1 : 0);
const vakuumMatch = formData.vakum?.match(/^(\d+)\s*vakuum/);
const vakuumCount = vakuumMatch ? parseInt(vakuumMatch[1]) : (formData.vakum?.toLowerCase().includes('vakuum') ? 1 : 0);
const otvorenMatch = formData.otvoreno?.match(/^(\d+)\s*otvorena/);
const otvorenCount = otvorenMatch ? parseInt(otvorenMatch[1]) : (formData.otvoreno?.toLowerCase().includes('otvorena') ? 1 : 0);
const totalQuantity = refillCount + vakuumCount + otvorenCount;
onSave({
...filament,
...formData
...formData,
kolicina: totalQuantity.toString()
});
};
@@ -564,20 +574,6 @@ function FilamentForm({
</div>
</div>
<div>
<label className="block text-sm font-medium mb-1 text-gray-700 dark:text-gray-300">Količina</label>
<input
type="number"
name="kolicina"
value={formData.kolicina}
onChange={handleChange}
min="0"
step="1"
placeholder="0"
className="w-full px-3 py-2 border border-gray-300 dark:border-gray-600 rounded-md bg-white dark:bg-gray-700 text-gray-900 dark:text-gray-100 focus:outline-none focus:ring-2 focus:ring-blue-500"
/>
</div>
<div>
<label className="block text-sm font-medium mb-1 text-gray-700 dark:text-gray-300">Cena</label>
<input
@@ -592,7 +588,7 @@ function FilamentForm({
{/* Quantity inputs for refill, vakuum, and otvoreno */}
<div>
<label className="block text-sm font-medium mb-1 text-gray-700 dark:text-gray-300">Refill količina</label>
<label className="block text-sm font-medium mb-1 text-gray-700 dark:text-gray-300">Refill</label>
<input
type="number"
name="refill"
@@ -618,7 +614,7 @@ function FilamentForm({
</div>
<div>
<label className="block text-sm font-medium mb-1 text-gray-700 dark:text-gray-300">Vakuum količina</label>
<label className="block text-sm font-medium mb-1 text-gray-700 dark:text-gray-300">Vakuum</label>
<input
type="number"
name="vakum"
@@ -645,7 +641,7 @@ function FilamentForm({
</div>
<div>
<label className="block text-sm font-medium mb-1 text-gray-700 dark:text-gray-300">Otvoreno količina</label>
<label className="block text-sm font-medium mb-1 text-gray-700 dark:text-gray-300">Otvoreno</label>
<input
type="number"
name="otvoreno"
@@ -671,6 +667,25 @@ function FilamentForm({
/>
</div>
{/* Total quantity display */}
<div>
<label className="block text-sm font-medium mb-1 text-gray-700 dark:text-gray-300">Ukupna količina</label>
<input
type="number"
name="kolicina"
value={(() => {
const refillCount = parseInt(formData.refill) || (formData.refill?.toLowerCase() === 'da' ? 1 : 0);
const vakuumMatch = formData.vakum?.match(/^(\d+)\s*vakuum/);
const vakuumCount = vakuumMatch ? parseInt(vakuumMatch[1]) : (formData.vakum?.toLowerCase().includes('vakuum') ? 1 : 0);
const otvorenMatch = formData.otvoreno?.match(/^(\d+)\s*otvorena/);
const otvorenCount = otvorenMatch ? parseInt(otvorenMatch[1]) : (formData.otvoreno?.toLowerCase().includes('otvorena') ? 1 : 0);
return refillCount + vakuumCount + otvorenCount;
})()}
readOnly
className="w-full px-3 py-2 border border-gray-300 dark:border-gray-600 rounded-md bg-gray-100 dark:bg-gray-600 text-gray-900 dark:text-gray-100 cursor-not-allowed"
/>
</div>
<div className="md:col-span-2 flex justify-end gap-4 mt-4">
<button
type="button"