Add daily report calendar to the header

arr_web/static/index.html

@@ -121,22 +121,38 @@
             </div>
           </section>
 
-          <article class="metric-card">
+          <article class="metric-card arrival-metric">
             <span>ARRIVAL DATE</span>
             <strong id="metric-arrival">—</strong>
             <small id="metric-arrival-note">当前查看日期</small>
             <small id="metric-current-version" hidden>当前有效日报仍保留</small>
           </article>
-          <article class="metric-card">
-            <span>处理耗时</span>
-            <strong id="metric-duration">—</strong>
-            <small id="metric-duration-note">从提交至完成</small>
-          </article>
           <article class="metric-card accent-card">
             <span>NO. OF ROOM</span>
             <strong id="metric-rooms">—</strong>
             <small id="metric-rooms-note">保留记录的售出房数</small>
           </article>
+
+          <section class="panel report-calendar" id="report-calendar" aria-label="报表日历" aria-describedby="report-calendar-help">
+            <header class="report-calendar-heading">
+              <h2 id="report-calendar-title">报表</h2>
+              <button id="report-calendar-current" type="button">本月</button>
+            </header>
+            <div class="report-calendar-navigation">
+              <button id="report-calendar-previous" type="button" aria-label="上一个月">‹</button>
+              <strong id="report-calendar-month"></strong>
+              <button id="report-calendar-next" type="button" aria-label="下一个月">›</button>
+            </div>
+            <div class="report-calendar-weekdays" id="report-calendar-weekdays" aria-hidden="true"></div>
+            <div class="report-calendar-days" id="report-calendar-days" role="group" aria-label="选择日期查看日报"></div>
+            <div class="report-calendar-legend" aria-label="日报生成状态">
+              <span><b aria-hidden="true">✓</b><span id="report-calendar-legend-generated">已生成</span></span>
+              <span><b aria-hidden="true">—</b><span id="report-calendar-legend-empty">未生成</span></span>
+            </div>
+            <p class="report-calendar-status" id="report-calendar-status" role="status" aria-live="polite">正在读取本月报表状态…</p>
+            <p class="report-calendar-help" id="report-calendar-help">选择日期查看日报；不会自动下载或处理。</p>
+            <button class="report-calendar-retry" id="report-calendar-retry" type="button" hidden>重新读取</button>
+          </section>
         </section>
 
         <section class="panel arr-download-pending" id="arr-download-pending" aria-labelledby="arr-download-pending-title" hidden>