ui: show calendar first.

This commit is contained in:
2025-11-11 14:59:22 +08:00
parent cd3b4df88d
commit c8b789afe3
2 changed files with 283 additions and 272 deletions

View File

@@ -44,51 +44,54 @@
<!-- 主应用容器 -->
<div class="container" id="mainContainer" style="display: none;">
<header>
<div class="user-info">
<span id="userDisplay">未登录</span>
<button id="logoutBtn" class="btn-logout">退出</button>
</div>
<h1>任务日历</h1>
<!-- 日历放在顶部 -->
<div class="calendar" id="calendar"></div>
<!-- 控制元素移到底部 -->
<div class="bottom-section">
<div class="controls">
<button id="prevMonth" class="btn-nav"></button>
<span id="currentMonth" class="month-display"></span>
<button id="nextMonth" class="btn-nav"></button>
<button id="todayBtn" class="btn-today">今天</button>
</div>
</header>
<div class="legend">
<div class="legend-item">
<span class="mark completed"></span>
<span>任务已完成</span>
</div>
<div class="legend-item">
<span class="mark partial"></span>
<span>部分未完成</span>
</div>
<div class="legend-item">
<span class="mark none"></span>
<span>未标记</span>
</div>
</div>
<div class="calendar" id="calendar"></div>
<div class="legend">
<div class="legend-item">
<span class="mark completed"></span>
<span>任务已完成</span>
</div>
<div class="legend-item">
<span class="mark partial"></span>
<span>部分未完成</span>
</div>
<div class="legend-item">
<span class="mark none"></span>
<span>未标记</span>
</div>
</div>
<div class="instructions">
<p>💡 点击日期可切换标记状态:未标记 → 已完成 → 部分完成 → 未标记</p>
<p>📌 选择服务器后,数据会自动加载和保存</p>
</div>
<div class="instructions">
<p>💡 点击日期可切换标记状态:未标记 → 已完成 → 部分完成 → 未标记</p>
<p>📌 选择服务器后,数据会自动加载和保存</p>
</div>
<div class="server-section">
<label for="serverInput">API服务器地址</label>
<div class="server-input-group">
<input type="text" id="serverInput" placeholder="例如http://localhost:3000" />
<button id="addServerBtn" class="btn-add">添加</button>
<select id="serverSelect" class="server-select">
<option value="">选择服务器</option>
</select>
<button id="removeServerBtn" class="btn-remove">删除</button>
<div class="server-section">
<label for="serverInput">API服务器地址</label>
<div class="server-input-group">
<input type="text" id="serverInput" placeholder="例如http://localhost:3000" />
<button id="addServerBtn" class="btn-add">添加</button>
<select id="serverSelect" class="server-select">
<option value="">选择服务器</option>
</select>
<button id="removeServerBtn" class="btn-remove">删除</button>
</div>
</div>
<!-- 用户信息移到最后 -->
<div class="user-info">
<span id="userDisplay">未登录</span>
<button id="logoutBtn" class="btn-logout">退出</button>
</div>
</div>
</div>