@model WarehouseCalendarViewModel
|
<!DOCTYPE html>
|
<html lang="zh-CN">
|
<head>
|
<meta charset="UTF-8" />
|
<meta name="viewport" content="width=device-width, initial-scale=1" />
|
<title>仓库操作计划 - Board</title>
|
<style>
|
html, body {
|
margin: 0;
|
padding: 0;
|
width: 100%;
|
height: 100%;
|
background-color: #f0f2f5 !important;
|
font-family: "PingFang SC", "Microsoft YaHei", sans-serif;
|
overflow: hidden;
|
}
|
.shell { width: 100% !important; max-width: 100% !important; margin: 0 !important; padding: 10px; box-sizing: border-box; }
|
.cal-nav-row { display: flex; align-items: center; gap: 20px; margin-bottom: 10px; padding-left: 10px; }
|
.cal-title { margin: 0; font-size: 24px; font-weight: bold; color: #000; }
|
.cal-nav-btn { text-decoration: none; color: #1890ff; font-weight: bold; font-size: 20px; padding: 5px 15px; background: #fff; border: 1px solid #d9d9d9; border-radius: 4px; }
|
.cal-table-wrap { width: 100%; background: #fff !important; border-radius: 4px; box-shadow: 0 4px 10px rgba(0,0,0,0.1); overflow: hidden; }
|
.cal-table { table-layout: fixed; width: 100%; border-collapse: collapse; background: #fff !important; }
|
thead th { background: #fafafa !important; color: #555; padding: 12px 0; font-size: 16px; border: 1px solid #f0f0f0; }
|
.cal-cell { height: 13vh; vertical-align: top; border: 1px solid #f0f0f0 !important; padding: 0 !important; background: #fff !important; }
|
.cal-cell--today { background-color: #e6f7ff !important; }
|
.cal-daynum { font-size: 14px; font-weight: bold; color: #999; padding: 4px 6px; display: block; }
|
.cal-plans { margin: 0; padding: 0 2px; list-style: none; }
|
.cal-plan { margin-bottom: 2px; border-radius: 2px; padding: 2px 4px; display: block; overflow: hidden; }
|
.cal-plan--active { background-color: #1890ff !important; color: #fff !important; }
|
.cal-plan--over { background-color: #52c41a !important; color: #fff !important; }
|
.cal-plan-fields { display: flex; flex-wrap: nowrap; align-items: center; font-size: 13px; line-height: 1.2; }
|
.cal-field { flex-shrink: 0; margin-right: 8px; white-space: nowrap; }
|
.cal-event-text { font-weight: 900; }
|
.cal-to-text { font-weight: 900; }
|
.cal-note { font-weight: 400; opacity: 0.9; }
|
</style>
|
</head>
|
<body class="page-home">
|
<div class="shell">
|
<div class="cal-nav-row">
|
<a class="cal-nav-btn" href="@(Model.BasePath + "/warehouse-calendar?year=" + Model.PrevYear + "&month=" + Model.PrevMonth)"><</a>
|
<a class="cal-nav-btn" href="@(Model.BasePath + "/warehouse-calendar?year=" + Model.NextYear + "&month=" + Model.NextMonth)">></a>
|
<h2 class="cal-title">@Model.MonthTitle 仓库操作计划看板</h2>
|
</div>
|
|
<div class="cal-table-wrap">
|
<table class="cal-table">
|
<thead>
|
<tr>
|
@foreach (var w in Model.WeekdayLabels)
|
{
|
<th>@w</th>
|
}
|
</tr>
|
</thead>
|
<tbody>
|
@foreach (var row in Model.Rows)
|
{
|
<tr>
|
@foreach (var cell in row)
|
{
|
<td class="cal-cell@(cell.IsToday ? " cal-cell--today" : "")">
|
@if (cell.Day is not null)
|
{
|
<span class="cal-daynum">@cell.Day</span>
|
<ul class="cal-plans">
|
@foreach (var p in cell.Plans)
|
{
|
var st = (p.Event_status ?? "").Trim().ToLowerInvariant();
|
var isOver = st == "over" || (string.IsNullOrEmpty(st) && !string.IsNullOrEmpty(Model.TodayKey) && string.CompareOrdinal(cell.DateKey ?? "", Model.TodayKey) < 0);
|
<li class="cal-plan@(isOver ? " cal-plan--over" : " cal-plan--active")">
|
<div class="cal-plan-fields">
|
<span class="cal-field cal-event-text">
|
@{
|
var es = p.Eventstr ?? "";
|
var val = es.Length > 5 ? es[^5..] : es;
|
}
|
@val
|
</span>
|
@if (!string.IsNullOrEmpty(p.Event_to))
|
{
|
<span class="cal-field cal-to-text">@((p.Event_to ?? "").Length >= 3 ? (p.Event_to ?? "")[..3] : (p.Event_to ?? ""))</span>
|
}
|
<span class="cal-field cal-note">@((p.Note_a ?? "") + " " + (p.Note_b ?? ""))</span>
|
</div>
|
</li>
|
}
|
</ul>
|
}
|
</td>
|
}
|
</tr>
|
}
|
</tbody>
|
</table>
|
</div>
|
</div>
|
</body>
|
</html>
|
|