feat(frontend): add weather icons and redesign calendar header
Backend changes: - Add LOCATION configuration option to Settings - Add /api/system/config endpoint to expose public config - Implement location priority: config > geolocation > default Frontend changes: - Install and integrate weather-icons npm package (Erik Flowers) - Redesign calendar header with date/time on left, weather/location on right - Display weather icon using CSS classes instead of SVG components - Fetch location from backend API on component mount - Use configured location name (from .env) instead of geocoded result Layout: - Left: month/year + current time - Right: city name + weather description + weather icon
This commit is contained in:
@@ -62,7 +62,7 @@ const {
|
||||
} = useKnowledgeView()
|
||||
|
||||
// --- Client time & weather ---
|
||||
const { clientTime, weatherIcon, weatherSummary, formatClientDate, formatClientClock } = useClientTime()
|
||||
const { clientTime, city, weatherIcon, weatherSummary, formatClientDate, formatClientClock } = useClientTime()
|
||||
|
||||
// --- Daily digest & reminders ---
|
||||
const { dailyDigest, digestLoading, activeReminder, reminderVisible, loadDailyDigest, handleSnooze, handleDismiss } = useDailyDigest()
|
||||
@@ -228,11 +228,17 @@ function renderMarkdown(content: string) {
|
||||
<div v-else class="jarvis-sidebar-scroll">
|
||||
<div class="jarvis-panel jarvis-date-panel">
|
||||
<div class="jarvis-date-row">
|
||||
<div class="jarvis-date-num">{{ clientTime.getDate().toString().padStart(2, '0') }}</div>
|
||||
<div class="jarvis-date-meta">
|
||||
<div class="jarvis-month">{{ clientTime.toLocaleString('zh-CN', { month: 'long' }) }} / {{ clientTime.getFullYear() }}</div>
|
||||
<div class="jarvis-month">{{ clientTime.toLocaleString('zh-CN', { month: 'long' }) }} {{ clientTime.getFullYear() }}</div>
|
||||
<div class="jarvis-time">{{ clientTime.toLocaleTimeString('zh-CN', { hour12: false }) }}</div>
|
||||
</div>
|
||||
<div class="jarvis-location">
|
||||
<div class="location-info">
|
||||
<span class="location-name">{{ city }}</span>
|
||||
<span class="location-weather-text">{{ weatherSummary }}</span>
|
||||
</div>
|
||||
<i :class="['wi', weatherIcon, 'location-icon']"></i>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<div class="jarvis-calendar">
|
||||
@@ -564,7 +570,7 @@ function renderMarkdown(content: string) {
|
||||
<div class="runtime-meta-item">
|
||||
<span class="runtime-meta-key">WEATHER</span>
|
||||
<span class="runtime-meta-value weather-inline">
|
||||
<component :is="weatherIcon" :size="14" class="weather-icon" />
|
||||
<i :class="['wi', weatherIcon]"></i>
|
||||
<span>{{ weatherSummary }}</span>
|
||||
</span>
|
||||
</div>
|
||||
|
||||
Reference in New Issue
Block a user