feat: add inspection_expiry/has_etc/tire_type fields, icons in schedule view, and WebSocket real-time sync

Co-authored-by: h <57948770+h@users.noreply.github.com>
Agent-Logs-Url: https://github.com/h/CarReservation/sessions/6d0f25ae-6db4-4937-ae2b-6674456a5ca1

frontend/src/components/ScheduleView.jsx

@@ -2,6 +2,7 @@ import { useState, useEffect, useRef, useCallback } from 'react';
 import { format, addDays, startOfWeek, parseISO, differenceInDays, isSameDay } from 'date-fns';
 import { ja } from 'date-fns/locale';
 import { api } from '../api.js';
+import { isInspectionExpirySoon } from '../utils/carUtils.js';
 import ReservationModal from './ReservationModal.jsx';
 import styles from './ScheduleView.module.css';
 
@@ -35,7 +36,7 @@ function dateToStr(date) {
   return format(date, 'yyyy-MM-dd');
 }
 
-export default function ScheduleView() {
+export default function ScheduleView({ reloadKey = 0 }) {
   const [cars, setCars] = useState([]);
   const [reservations, setReservations] = useState([]);
   const [loading, setLoading] = useState(true);
@@ -85,7 +86,7 @@ export default function ScheduleView() {
 
   useEffect(() => {
     loadData();
-  }, [loadData]);
+  }, [loadData, reloadKey]);
 
   // --- Navigation ---
   const prevWeek = () => setViewStart((d) => addDays(d, -7));
@@ -443,6 +444,13 @@ export default function ScheduleView() {
                 >
                   <span className={styles.carDot} style={{ background: color.border }} />
                   <span className={styles.carName}>{car.name}</span>
+                  <span className={styles.carIcons}>
+                    {car.has_etc ? <span title="ETC あり">🛣️</span> : null}
+                    {car.tire_type === 'スタットレス' ? <span title="スタットレスタイヤ">❄️</span> : null}
+                    {isInspectionExpirySoon(car.inspection_expiry) ? (
+                      <span title={`車検満了日: ${car.inspection_expiry}（まもなく期限切れ）`}>⚠️</span>
+                    ) : null}
+                  </span>
                 </div>
 
                 {/* Day cells */}