Aberwyn/Aberwyn/Views/FoodMenu/Calculator.cshtml

@model Aberwyn.Models.DoughPlan
@{
    var plans = ViewBag.Plans as List<Aberwyn.Models.DoughPlan>;
}
<div class="card border-info mb-4">
    <div class="card-header">🍕 Pizzakalkylator</div>
    <div class="card-body">
        <form id="calcForm" class="grid grid-cols-1 md:grid-cols-4 gap-3">
            <div>
                <label>Antal pizzor</label>
                <input id="antal" type="number" class="form-control" value="8" />
            </div>
            <div>
                <label>Vikt per pizza (g)</label>
                <input id="vikt" type="number" class="form-control" value="220" />
            </div>
            <div>
                <label>Datum</label>
                <input id="datum" type="date" class="form-control" value="@DateTime.Today.ToString("yyyy-MM-dd")" />
            </div>
            <div>
                <label>Namn på tillfälle</label>
                <input id="namn" class="form-control" value="Planering" />
            </div>
        </form>
        <button type="button" class="btn btn-success mt-3" id="saveBtn">💾 Spara</button>

        <hr />

        <h5>Resultat</h5>
        <div class="completed-orders-grid">
            <div class="completed-order-box">
                <strong>Totalt deg</strong>
                <span id="totalDeg"></span> g
            </div>
            <div class="completed-order-box">
                <strong>Mjöl</strong>
                <span id="mjol"></span> g
            </div>
            <div class="completed-order-box">
                <strong>Vatten</strong>
                <span id="vatten"></span> g
            </div>
            <div class="completed-order-box">
                <strong>Olja</strong>
                <span id="olja"></span> g
            </div>
            <div class="completed-order-box">
                <strong>Salt</strong>
                <span id="salt"></span> g
            </div>
            <div class="completed-order-box">
                <strong>Jäst</strong>
                <span id="jast"></span> g
            </div>
        </div>
    </div>
</div>

@if (plans?.Any() == true)
{
    <div class="card border-success">
        <div class="card-header">📋 Sparade planer</div>
        <div class="card-body">
            <div class="completed-orders-grid">
                @foreach (var p in plans)
                {
                    <div class="completed-order-box">
                        <strong>@p.Namn (@p.Datum.ToString("yyyy-MM-dd"))</strong>
                        <span>🍕 @p.AntalPizzor st × @p.ViktPerPizza:F1 g</span>
                        <hr style="margin:6px 0;" />
                        <span><b>Totalt:</b> @p.TotalDeg:F1 g</span>
                        <span>Mjöl: @p.Mjol:F1 g</span>
                        <span>Vatten: @p.Vatten:F1 g</span>
                        <span>Olja: @p.Olja:F1 g</span>
                        <span>Salt: @p.Salt:F1 g</span>
                        <span>Jäst: @p.Jast:F1 g</span>
                    </div>
                }
            </div>
        </div>
    </div>
}
<link rel="stylesheet" href="~/css/pizzacalculator.css" />

<script>
    function round1(x) {
        return Math.round(x * 10) / 10;
    }

    function calc() {
        let antal = parseFloat(document.getElementById("antal").value) || 0;
        let vikt = parseFloat(document.getElementById("vikt").value) || 0;
        let total = antal * vikt;
        let mjol = total * (100.0 / 162.0);
        let vatten = mjol * 0.52;
        let olja = mjol * 0.075;
        let salt = mjol * 0.02;
        let jast = mjol * 0.005;

        document.getElementById("totalDeg").innerText = round1(total);
        document.getElementById("mjol").innerText = round1(mjol);
        document.getElementById("vatten").innerText = round1(vatten);
        document.getElementById("olja").innerText = round1(olja);
        document.getElementById("salt").innerText = round1(salt);
        document.getElementById("jast").innerText = round1(jast);

        return { antal, vikt, total, mjol, vatten, olja, salt, jast };
    }

    ["antal","vikt"].forEach(id => {
        document.getElementById(id).addEventListener("input", calc);
    });

    calc();

    document.getElementById("saveBtn").addEventListener("click", function () {
        let values = calc();
        let data = {
            AntalPizzor: values.antal,
            ViktPerPizza: values.vikt,
            TotalDeg: values.total,
            Mjol: values.mjol,
            Vatten: values.vatten,
            Olja: values.olja,
            Salt: values.salt,
            Jast: values.jast,
            Datum: document.getElementById("datum").value,
            Namn: document.getElementById("namn").value
        };

        fetch('@Url.Action("SaveDoughPlan", "FoodMenu")', {
            method: 'POST',
            headers: { 'Content-Type': 'application/json' },
            body: JSON.stringify(data)
        }).then(r => r.json()).then(res => {
            if (res.success) {
                location.reload(); // 🔄 Ladda om sidan så listan uppdateras
            } else {
                alert("❌ Kunde inte spara");
            }
        });
    });
</script>