v1.3.5 — 日期+日历同步右对齐

- panel-header-right 包裹日期和按钮，靠右排列不分散
v1.3.4 — 日历同步按钮紧挨日期输入框
2026-06-04 15:14:52 +08:00 · 2026-06-04 15:12:36 +08:00 · 2026-06-04 13:53:18 +08:00 · 2026-06-04 13:38:50 +08:00
4 changed files with 258 additions and 38 deletions
--- a/app.py
+++ b/app.py
@@ -308,6 +308,23 @@ def api_calendar_sync():
    return jsonify({'ok': True, 'data': events})


+@app.route('/api/calendar-sync-all', methods=['GET'])
+@login_required
+def api_calendar_sync_all():
+    """批量查询过去15天~未来15天的钉钉日程，按日期分组返回"""
+    import json as _json
+    from datetime import datetime, timedelta
+    today = datetime.now().replace(hour=0, minute=0, second=0, microsecond=0)
+    results = []
+    for delta in range(-15, 16):
+        d = today + timedelta(days=delta)
+        ds = d.strftime('%Y-%m-%d')
+        events = _fetch_dingtalk_events(ds)
+        if events:
+            results.append({'date': ds, 'events': events})
+    return jsonify({'ok': True, 'data': results})
+
+
 # ── 启动 ──────────────────────────────────────────────

 if __name__ == '__main__':
--- a/static/app.js
+++ b/static/app.js
@@ -365,42 +365,94 @@
  /* ── 日历同步 ── */

  window.syncCalendar = function() {
-    var date = document.getElementById('check-date').value;
+    var overlay = document.getElementById('sync-modal-overlay');
+    var loading = document.getElementById('sync-loading');
+    var resultsEl = document.getElementById('sync-results');
+    var summary = document.getElementById('sync-summary');
+    var list = document.getElementById('sync-list');
    var btn = document.querySelector('.btn-cal-sync');
+    if (!overlay) return;
+
+    // 打开弹窗，显示加载中
+    overlay.style.display = 'flex';
+    loading.style.display = 'block';
+    resultsEl.style.display = 'none';
    if (btn) { btn.style.opacity = '0.5'; btn.disabled = true; }
-    fetch('/api/calendar-sync?date=' + encodeURIComponent(date))
+
+    fetch('/api/calendar-sync-all')
      .then(function(r){ return r.json(); })
      .then(function(res){
+        loading.style.display = 'none';
+        resultsEl.style.display = 'block';
        if (btn) { btn.style.opacity = '1'; btn.disabled = false; }
-        if (!res.ok) { showToast(res.error || '同步失败', 'error'); return; }
-        var events = res.data || [];
-        if (events.length === 0) { showToast('今日无日程', 'info'); return; }
-        var added = 0;
-        events.forEach(function(e) {
-          var text = '【' + e.time + '】' + e.summary;
-          if (e.location) text += ' @' + e.location;
-          var existing = document.querySelectorAll('#morning-list input[type="text"]');
-          var already = false;
-          existing.forEach(function(inp){ if (inp.value.indexOf(e.summary) >= 0) already = true; });
-          if (already) return;
-          var count = document.querySelectorAll('#morning-list .item-row').length;
-          if (count >= 3) return;
-          addMorningRow(text);
-          added++;
-        });
-        if (added > 0) {
-          showToast('已同步 ' + added + ' 条日程', 'info');
-          triggerAutoSave();
-        } else {
-          showToast('日程已存在或已满', 'info');
+        if (!res.ok) { summary.innerHTML = '<span style="color:var(--danger)">同步失败: ' + (res.error || '未知错误') + '</span>'; return; }
+        var data = res.data || [];
+        if (data.length === 0) {
+          summary.innerHTML = '未查询到任何日程';
+          return;
        }
+        // 统计
+        var totalDays = data.length;
+        var totalEvents = 0;
+        data.forEach(function(d){ totalEvents += d.events.length; });
+        summary.innerHTML = '同步完成！共 <b>' + totalDays + '</b> 天有日程，合计 <b>' + totalEvents + '</b> 个会议';
+
+        // 渲染结果列表
+        var html = '';
+        data.forEach(function(day) {
+          html += '<div class="sync-day">';
+          html += '<div class="sync-day-header"><span>' + day.date + '</span></div>';
+          day.events.forEach(function(e) {
+            var timeStr = e.time ? ' (' + e.time + ')' : '';
+            html += '<div class="sync-event">' +
+              '<span class="sync-event-icon">📌</span>' +
+              '<span class="sync-event-text">' + esc(e.summary) + '<span class="sync-event-time">' + esc(timeStr) + '</span></span>' +
+            '</div>';
+          });
+          html += '</div>';
+        });
+        list.innerHTML = html;
+
+        // 自动填充今天到选中日期的日程
+        autoFillTodayEvents(data);
      })
      .catch(function(){
+        loading.style.display = 'none';
+        resultsEl.style.display = 'block';
+        summary.innerHTML = '<span style="color:var(--danger)">网络错误，请重试</span>';
        if (btn) { btn.style.opacity = '1'; btn.disabled = false; }
-        showToast('同步失败', 'error');
      });
  };

+  function autoFillTodayEvents(data) {
+    var todayDate = document.getElementById('check-date').value;
+    var added = 0;
+    data.forEach(function(day) {
+      if (day.date !== todayDate) return;
+      day.events.forEach(function(e) {
+        var text = e.time ? '【' + e.time + '】' + e.summary : e.summary;
+        if (e.location) text += ' @' + e.location;
+        var existing = document.querySelectorAll('#morning-list input[type="text"]');
+        var already = false;
+        existing.forEach(function(inp){ if (inp.value.indexOf(e.summary) >= 0) already = true; });
+        if (already) return;
+        var count = document.querySelectorAll('#morning-list .item-row').length;
+        if (count >= 3) return;
+        addMorningRow(text);
+        added++;
+      });
+    });
+    if (added > 0) {
+      showToast('已自动填充 ' + added + ' 条今日日程', 'info');
+      triggerAutoSave();
+    }
+  }
+
+  window.closeSyncModal = function() {
+    var overlay = document.getElementById('sync-modal-overlay');
+    if (overlay) overlay.style.display = 'none';
+  };
+
  window.addMorning = function() {
    var count = document.querySelectorAll('#morning-list .item-row').length;
    if (count >= 3) { showToast('最多 3 条立志', 'error'); return; }
--- a/static/style.css
+++ b/static/style.css
@@ -428,6 +428,12 @@ body {
  letter-spacing: -0.3px;
 }

+.panel-header-right {
+  display: flex;
+  align-items: center;
+  gap: 6px;
+}
+
 .check-date-input {
  padding: 8px 14px;
  border: 1.5px solid var(--border);
@@ -537,22 +543,26 @@ body {

 /* 日历同步按钮 */
 .btn-cal-sync {
-  display: flex;
+  display: inline-flex;
  align-items: center;
-  justify-content: center;
-  width: 28px;
-  height: 28px;
-  border: none;
-  background: transparent;
-  color: var(--text-muted);
-  border-radius: 6px;
+  gap: 5px;
+  padding: 6px 12px;
+  border: 1.5px solid var(--border);
+  background: var(--card);
+  color: var(--text-dim);
+  border-radius: var(--radius-sm);
+  font-size: 12px;
+  font-weight: 500;
  cursor: pointer;
  transition: all 0.2s;
  flex-shrink: 0;
+  font-family: inherit;
+  margin-left: 6px;
 }
 .btn-cal-sync:hover {
-  background: var(--success-light);
-  color: var(--success);
+  border-color: var(--primary);
+  color: var(--primary);
+  background: var(--primary-light);
 }

 /* 编辑模式下才显示的元素 */
@@ -1081,6 +1091,124 @@ body {
 .toast.error   { background: var(--danger);   color: #FFF; }
 .toast.info    { background: var(--primary);  color: #FFF; }

+/* ═══════════════════════════════════════════
+   Sync Modal
+   ═══════════════════════════════════════════ */
+
+.sync-modal-overlay {
+  position: fixed;
+  inset: 0;
+  background: rgba(0,0,0,0.4);
+  display: flex;
+  align-items: center;
+  justify-content: center;
+  z-index: 9998;
+  backdrop-filter: blur(2px);
+}
+.sync-modal {
+  background: var(--card);
+  border-radius: var(--radius);
+  width: 90%;
+  max-width: 560px;
+  max-height: 80vh;
+  display: flex;
+  flex-direction: column;
+  box-shadow: 0 8px 40px rgba(0,0,0,0.15);
+  overflow: hidden;
+}
+.sync-modal-header {
+  display: flex;
+  align-items: center;
+  justify-content: space-between;
+  padding: 16px 20px;
+  border-bottom: 1px solid var(--border);
+  flex-shrink: 0;
+}
+.sync-modal-header h3 {
+  font-size: 16px;
+  font-weight: 700;
+  margin: 0;
+}
+.sync-modal-close {
+  background: none;
+  border: none;
+  font-size: 22px;
+  color: var(--text-muted);
+  cursor: pointer;
+  padding: 0 4px;
+  line-height: 1;
+}
+.sync-modal-loading {
+  padding: 40px 20px;
+  text-align: center;
+  color: var(--text-dim);
+  font-size: 14px;
+}
+.sync-spinner {
+  width: 36px;
+  height: 36px;
+  border: 3px solid var(--border);
+  border-top-color: var(--primary);
+  border-radius: 50%;
+  animation: spin 0.8s linear infinite;
+  margin: 0 auto 14px;
+}
+@keyframes spin { to { transform: rotate(360deg); } }
+.sync-modal-results {
+  padding: 16px 20px;
+  overflow-y: auto;
+  flex: 1;
+}
+.sync-summary {
+  font-size: 14px;
+  color: var(--text);
+  margin-bottom: 14px;
+  padding: 10px 14px;
+  background: var(--primary-light);
+  border-radius: var(--radius-sm);
+}
+.sync-list {
+  display: flex;
+  flex-direction: column;
+  gap: 10px;
+}
+.sync-day {
+  border: 1px solid var(--border);
+  border-radius: var(--radius-sm);
+  overflow: hidden;
+}
+.sync-day-header {
+  background: var(--bg);
+  padding: 6px 12px;
+  font-size: 12px;
+  font-weight: 600;
+  color: var(--text-dim);
+  border-bottom: 1px solid var(--border);
+}
+.sync-event {
+  display: flex;
+  align-items: center;
+  gap: 8px;
+  padding: 8px 12px;
+  font-size: 13px;
+  color: var(--text);
+}
+.sync-event + .sync-event { border-top: 1px solid var(--bg); }
+.sync-event-icon { flex-shrink: 0; }
+.sync-event-text { flex: 1; }
+.sync-event-time { font-size: 11px; color: var(--text-muted); margin-left: 6px; }
+.sync-modal-footer {
+  padding: 12px 20px;
+  border-top: 1px solid var(--border);
+  display: flex;
+  justify-content: flex-end;
+  flex-shrink: 0;
+}
+.sync-modal-footer .btn-wish-save {
+  width: auto;
+  padding: 8px 24px;
+}
+
 /* ═══════════════════════════════════════════
   Wishes — 四象限
   ═══════════════════════════════════════════ */
--- a/templates/index.html
+++ b/templates/index.html
@@ -13,6 +13,27 @@

 <div id="toast" class="toast"></div>

+<!-- 日历同步弹窗 -->
+<div class="sync-modal-overlay" id="sync-modal-overlay" style="display:none">
+  <div class="sync-modal">
+    <div class="sync-modal-header">
+      <h3>📅 日历同步</h3>
+      <button class="sync-modal-close" onclick="closeSyncModal()">&times;</button>
+    </div>
+    <div class="sync-modal-loading" id="sync-loading">
+      <div class="sync-spinner"></div>
+      <p>正在从钉钉同步过去15天~未来15天日程…</p>
+    </div>
+    <div class="sync-modal-results" id="sync-results" style="display:none">
+      <div class="sync-summary" id="sync-summary"></div>
+      <div class="sync-list" id="sync-list"></div>
+    </div>
+    <div class="sync-modal-footer">
+      <button class="btn-wish-save" onclick="closeSyncModal()">关闭</button>
+    </div>
+  </div>
+</div>
+
 <div class="app-layout">

  <!-- ═══ 左侧边栏 ═══ -->
@@ -104,7 +125,12 @@
    <section class="panel active" id="panel-daily">
      <div class="panel-header">
        <h2>每日打卡</h2>
-        <input type="date" id="check-date" class="check-date-input" onchange="loadCheckin()">
+        <div class="panel-header-right">
+          <input type="date" id="check-date" class="check-date-input" onchange="loadCheckin()">
+          <button class="btn-cal-sync" onclick="syncCalendar()" title="同步钉钉日历">
+            <svg class="icon-sm"><use href="#icon-calendar"/></svg> 日历同步
+          </button>
+        </div>
      </div>
      <div class="daily-grid">
        <div class="card card-morning">
@@ -113,9 +139,6 @@
              <svg class="icon-h2"><use href="#icon-sun"/></svg>
              <h3>早间立志</h3>
            </div>
-            <button class="btn-cal-sync" onclick="syncCalendar()" title="同步钉钉日历">
-              <svg class="icon-sm"><use href="#icon-calendar"/></svg>
-            </button>
            <button class="btn-edit-toggle" onclick="toggleEditMode(this)" title="编辑">
              <svg class="icon-sm"><use href="#icon-pencil"/></svg>
            </button>
Author	SHA1	Message	Date
mac	046f144896	v1.3.5 — 日期+日历同步右对齐 - panel-header-right 包裹日期和按钮，靠右排列不分散	2026-06-04 15:14:52 +08:00
mac	ba592c07b7	v1.3.4 — 日历同步按钮紧挨日期输入框	2026-06-04 15:12:36 +08:00
mac	105d62f8db	v1.3.3 — 日历同步按钮移到每日打卡标题后 - 从早间立志卡片头移到面板header - 改为文字按钮样式：📅 日历同步	2026-06-04 13:53:18 +08:00
mac	c3dba63870	v1.3.2 — 日历同步批量查询+弹窗结果展示 - /api/calendar-sync-all 批量查询过去15天~未来15天 - 弹窗展示：加载动画 → 统计摘要 → 按日期分组日程列表 - 自动填充今日日程到早间立志 - 批量查询约需10秒，首次查询后同步写入缓存	2026-06-04 13:38:50 +08:00