@{
	ViewData["Title"] = "Оформление банковской карты";
}

<div class="text-center">
	<h2 class="display-4">Оформление банковской карты</h2>
</div>
<form method="post">
	<div class="row mb-2">
		<div class="col-4">Номер счёта:</div>
		<div class="col-8">
			<select id="account" name="accountId" class="form-control" asp-items="@(new SelectList( @ViewBag.Accounts, "Id", "FullName"))"></select>
		</div>
	</div>
	<div class="row mb-2">
		<div class="col-4">Номер карты:</div>
		<div class="col-8">
			<input type="text" id="cardnumber" class="form-control" name="cardnumber" required />
		</div>
	</div>
	<div class="row mb-2">
		<div class="col-4">Период:</div>
		<div class="col-8">
			<input type="date" id="period" class="form-control" name="period" required />
		</div>
	</div>
	<div class="row mb-2">
		<div class="col-4">Баланс:</div>
		<div class="col-8">
			<input type="number" id="balance" class="form-control" name="balance" value=0 required min=0 />
		</div>
	</div>
	<div class="row mb-2">
		<div class="col-8"></div>
		<div class="col-4">
			<input type="submit" value="Создать" class="form-control" class="btn btn-dark" />
		</div>
	</div>
</form>

<script>
	function createNum(len) {
		chrs = '0123456789';
		var str = '';
		for (var i = 0; i < len; i++) {
			var pos = Math.floor(Math.random() * chrs.length);
			str += chrs.substring(pos, pos + 1);
		}
		return str;
	}

	document.getElementById("cardnumber").value = createNum(16);
	let year = new Date();
	year.setFullYear(year.getFullYear() + 5)
	document.getElementById("period").valueAsDate = new Date(year);
</script>