87 lines
3.7 KiB
Plaintext
87 lines
3.7 KiB
Plaintext
@using OneForMe.Services
|
|
@inject LocalizationService Localizer
|
|
|
|
@{
|
|
ViewData["Title"] = Localizer["CreateOrder"];
|
|
}
|
|
|
|
<div class="container mt-5">
|
|
<div class="row justify-content-center">
|
|
<div class="col-md-8">
|
|
<div class="card shadow">
|
|
<div class="card-body p-5">
|
|
<h2 class="mb-4">@Localizer["CreateNewOrder"]</h2>
|
|
|
|
<form method="post" id="createOrderForm">
|
|
<div class="mb-3">
|
|
<label for="Name" class="form-label">@Localizer["OrderName"]</label>
|
|
<input type="text" class="form-control" id="Name" name="Name" placeholder="e.g., Pizza Party" required>
|
|
<small class="text-muted">@Localizer["GiveOrderName"]</small>
|
|
</div>
|
|
|
|
<hr>
|
|
|
|
<h5 class="mb-3">@Localizer["MenuItems"]</h5>
|
|
<p class="text-muted">@Localizer["AddItemsThatPeopleCanOrder"]</p>
|
|
|
|
<div id="itemsContainer">
|
|
<div class="item-row mb-3">
|
|
<div class="row">
|
|
<div class="col-md-8">
|
|
<input type="text" class="form-control" placeholder="@Localizer["EnterItemName"]" name="itemNames[]">
|
|
</div>
|
|
<div class="col-md-4">
|
|
<div class="input-group">
|
|
<span class="input-group-text">$</span>
|
|
<input type="number" class="form-control" placeholder="@Localizer["Price"]" name="itemPrices[]" step="0.01" min="0">
|
|
</div>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
|
|
<button type="button" class="btn btn-secondary mb-3" id="addItemBtn">+ @Localizer["AddMenuItem"]</button>
|
|
|
|
<hr>
|
|
|
|
<div class="d-flex gap-2">
|
|
<button type="submit" class="btn btn-primary">@Localizer["CreateOrder"]</button>
|
|
<a href="/Home/Dashboard" class="btn btn-secondary">@Localizer["Cancel"]</a>
|
|
</div>
|
|
</form>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
|
|
<script>
|
|
document.getElementById('addItemBtn').addEventListener('click', function() {
|
|
const container = document.getElementById('itemsContainer');
|
|
const newRow = document.createElement('div');
|
|
newRow.className = 'item-row mb-3';
|
|
newRow.innerHTML = `
|
|
<div class="row">
|
|
<div class="col-md-8">
|
|
<input type="text" class="form-control" placeholder="@Localizer["ItemName"]" name="itemNames[]">
|
|
</div>
|
|
<div class="col-md-4">
|
|
<div class="input-group">
|
|
<span class="input-group-text">$</span>
|
|
<input type="number" class="form-control" placeholder="@Localizer["Price"]" name="itemPrices[]" step="0.01" min="0">
|
|
<button type="button" class="btn btn-outline-danger" onclick="this.closest('.item-row').remove()">@Localizer["Remove"]</button>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
`;
|
|
container.appendChild(newRow);
|
|
});
|
|
|
|
// Add first item row on page load
|
|
document.addEventListener('DOMContentLoaded', function() {
|
|
const container = document.getElementById('itemsContainer');
|
|
if (container.children.length === 0) {
|
|
document.getElementById('addItemBtn').click();
|
|
}
|
|
});
|
|
</script> |