@page
@model Admin.Pages.Crypto.CurationModel
@{
    ViewData["Title"] = "큐레이션";
}

<div class="container-fluid">
    <h3>@ViewData["Title"]</h3>
    <hr />

    <partial name="_StatusMessage" />

    <div class="row g-2 align-items-end mt-2">
        <div class="col">
            Total : @Model.Total
        </div>
        <div class="col text-end">
            <button type="submit" id="btnSave" class="btn btn-success" form="fAdminWrite">저장</button>
        </div>
    </div>

    <div class="table-responsive">
        <form id="fAdminWrite" method="post" accept-charset="utf-8" autocomplete="off"></form>

        <table class="table table-striped table-bordered table-hover mt-3">
            <caption>
                <ul>
                    <li>코인 순서는 숫자가 낮을수록 먼저 노출됩니다. (음수 허용)</li>
                    <li>선별된 코인은 메인 페이지에 노출됩니다.</li>
                </ul>
            </caption>
            <colgroup>
                <col style="width: 5%;" />
                <col style="width: 8%;max-width: 128px;" />
                <col style="width: 10%;" />
                <col />
                <col />
                <col style="width: 10%;" />
                <col style="width: 10%;" />
                <col style="width: 10%;" />
            </colgroup>
            <thead>
                <tr>
                    <th>No</th>
                    <th>로고</th>
                    <th>심볼</th>
                    <th>한글명</th>
                    <th>영문명</th>
                    <th>사용</th>
                    <th>선별</th>
                    <th>순서</th>
                </tr>
            </thead>
            <tbody>
                @if (Model.List == null || Model.List.Count <= 0)
                {
                    <tr>
                        <td colspan="8">No Data.</td>
                    </tr>
                }
                else
                {
                    @foreach (var row in Model.List)
                    {
                        var index = row.Index;

                        <tr class="@(row.IsFeatured ? "table-warning" : "")">
                            <td>
                                @row.Num
                                <input type="hidden" name="request[@index].CoinID" form="fAdminWrite" value="@row.ID" />
                            </td>
                            <td>
                                @if (!string.IsNullOrEmpty(row.LogoImage))
                                {
                                    <img src="@row.LogoImage" alt="@row.Symbol" style="width:64px;height:64px;object-fit:contain;" />
                                } 
                                else
                                {
                                    <text>-</text>    
                                }
                            </td>
                            <td>@row.Symbol</td>
                            <td>@row.KorName</td>
                            <td>@row.EngName</td>
                            <td>@row.IsActive</td>
                            <td>
                                <div class="form-check d-flex justify-content-center">
                                    <input class="form-check-input" type="checkbox" id="request_@(index)_IsFeatured" name="request[@index].IsFeatured" checked="@row.IsFeatured" form="fAdminWrite" value="true" />
                                </div>
                            </td>
                            <td>
                                <input type="number" name="request[@index].DisplayOrder" class="form-control text-center" min="-999" max="999" form="fAdminWrite" value="@row.DisplayOrder" />
                            </td>
                        </tr>
                    }
                }
            </tbody>
        </table>
    </div>
</div>

@section Scripts {
    <script>
        $(function() {
            $(document).on("click", "#btnSave", function() {
                if (confirm("저장 하시겠습니까?")) {
                    let form = document.getElementById("fAdminWrite");
                    if (form.checkValidity()) {
                        form.submit();
                    } else {
                        form.reportValidity();
                    }
                }
                return false;
            });
        });
    </script>
}