@using Contracts.ViewModels

@model List<DetailViewModel>

@{
	ViewData["Title"] = "CreateProduct";
}
<div class="text-center">
	<h2 class="display-4">Создание изделия</h2>
</div>
<form method="post">
	<div class="row">
		<div class="col-4">Название:</div>
		<div class="col-8"><input type="text" name="title" id="title" /></div>
	</div>
    <div class="container">
        <div>Details</div>
        <div class="table-responsive-lg">
            <table id="detailsTable" class="display">
                <thead>
                    <tr>
                        <th>Выбор</th>
                        <th>Название</th>
                    </tr>
                </thead>
                <tbody>
                    @foreach (var detail in Model)
                    {
                        <tr>
                            <td>
                                <input type="checkbox" name="details" value="@detail.Id" />
                            </td>
                            <td>@detail.Name</td>
                            <td>
                                <input type="number" name="count" value="0" min="0" class="form-control" />
                            </td>
                        </tr>
                    }
                </tbody>
            </table>
        </div>
    </div>
    <div class="row">
        <div class="col-4">Сумма:</div>
        <div class="col-8"><input type="text" id="sum" name="sum" readonly /></div>
    </div>
    <div class="row">
        <div class="col-8"></div>
        <div class="col-4"><input type="submit" value="Сохранить" class="btn btn-primary" /></div>
    </div>
</form>

<script src="https://code.jquery.com/jquery-3.6.0.min.js"></script>
<script src="https://cdn.datatables.net/1.11.3/js/jquery.dataTables.js"></script>
<script>
    $(document).ready(function () {
        $('#detailsTable').DataTable();
    });
</script>