@page
@model RestaurantWeb2.Pages.DataModel
<!DOCTYPE html>
<html><head><meta charset="utf-8"/><title>@Model.Table</title>
<style>
*{box-sizing:border-box;margin:0;padding:0;}
body{font-family:Arial,sans-serif;background:#fff;color:#222;}
nav{border-bottom:1px solid #ddd;padding:10px 24px;display:flex;gap:4px;align-items:center;}
nav a{color:#222;text-decoration:none;padding:5px 12px;border-radius:3px;font-size:14px;}
nav a:hover{background:#f0f0f0;}
nav a.active{font-weight:bold;border-bottom:2px solid #333;}
nav .right{margin-left:auto;font-size:12px;color:#999;}

.wrap{padding:24px;max-width:960px;}
h1{font-size:20px;margin-bottom:16px;font-weight:bold;}
table{width:100%;border-collapse:collapse;font-size:13px;}
th{background:#f8f8f8;border:1px solid #e0e0e0;padding:8px 10px;text-align:left;font-weight:bold;}
td{border:1px solid #e0e0e0;padding:7px 10px;}
tr:hover td{background:#fafafa;}
input[type=text],input[type=number],input[type=date],input{padding:5px 8px;border:1px solid #ccc;border-radius:3px;font-size:13px;}
.btn{padding:5px 12px;border:1px solid #ccc;border-radius:3px;cursor:pointer;font-size:12px;text-decoration:none;display:inline-block;background:#fff;color:#333;box-shadow:none;}
.btn:hover{background:#f5f5f5;}
.btn-primary{background:#333;color:#fff;border-color:#333;}
.btn-primary:hover{background:#555;}
.btn-danger{color:#c0392b;border-color:#e0c0c0;}
.btn-danger:hover{background:#fff0f0;}
.toolbar{display:flex;gap:8px;align-items:center;margin-bottom:14px;}
.form-box{border:1px solid #e0e0e0;padding:16px;border-radius:4px;max-width:400px;margin-bottom:20px;background:#fafafa;}
.form-box label{display:block;font-size:11px;color:#888;margin-bottom:2px;text-transform:uppercase;}
.form-box input{width:100%;margin-bottom:10px;}
.form-title{font-size:14px;font-weight:bold;margin-bottom:12px;}
.ok{color:#27ae60;margin-bottom:10px;font-size:13px;}
.er{color:#c0392b;margin-bottom:10px;font-size:13px;}
</style></head><body>
<nav>
    <a href="/data?table=Персонал" class="@(Model.Table=="Персонал"?"active":"")">Персонал</a>
    <a href="/data?table=Блюда" class="@(Model.Table=="Блюда"?"active":"")">Блюда</a>
    <a href="/data?table=Склад" class="@(Model.Table=="Склад"?"active":"")">Склад</a>
    <a href="/data?table=Заказы" class="@(Model.Table=="Заказы"?"active":"")">Заказы</a>
    <span class="right">@Model.Role</span>
</nav>
<div class="wrap">
<h1>@Model.Table</h1>

@if(Model.Msg != "") { <div class="@(Model.IsErr?"er":"ok")">@Model.Msg</div> }

@if(Model.ShowForm && Model.Role != "waiter") {
<div class="form-box">
<div class="form-title">@(Model.EditId>0?"Редактировать запись":"Новая запись")</div>
<form method="post">
<input type="hidden" name="table" value="@Model.Table"/>
<input type="hidden" name="editId" value="@Model.EditId"/>
@for(int i=1;i<Model.Cols.Count;i++){
    <label>@Model.Cols[i]</label>
    <input name="f@(i)" value="@(i-1<Model.Vals.Count?Model.Vals[i-1]:"")"/>
}
<div style="display:flex;gap:8px;margin-top:4px;">
<button type="submit" class="btn btn-primary">Сохранить</button>
<a href="/data?table=@Model.Table" class="btn">Отмена</a>
</div>
</form>
</div>
}

<div class="toolbar">
@if(Model.Role != "waiter"){
    <a href="/data?table=@Model.Table&action=add" class="btn btn-primary">+ Добавить</a>
}
<form method="get" style="display:flex;gap:6px;margin:0;">
<input type="hidden" name="table" value="@Model.Table"/>
<input name="search" value="@Model.Search" placeholder="Поиск..." style="width:180px;"/>
<button type="submit" class="btn">Найти</button>
@if(!string.IsNullOrEmpty(Model.Search)){<a href="/data?table=@Model.Table" class="btn">✕</a>}
</form>
</div>

<table>
<tr>@foreach(var c in Model.Cols){<th>@c</th>}
@if(Model.Role!="waiter"){<th style="width:80px;">Действия</th>}</tr>
@foreach(var row in Model.Rows){
<tr>@foreach(var cell in row){<td>@cell</td>}
@if(Model.Role!="waiter"){
<td>
<a href="/data?table=@Model.Table&action=edit&id=@row[0]" class="btn" style="margin-right:4px;">Редактировать</a>
@if(Model.Role=="admin"){
<a href="/data?table=@Model.Table&action=delete&id=@row[0]" class="btn btn-danger" onclick="return confirm('Удалить?')">Удалить</a>
}
</td>
}
</tr>
}
</table>
</div>
</body></html>
