h/car
1
0
Fork 0
Code Issues Pull Requests Actions Packages Projects Releases Wiki Activity

Commit

Browse Source
This commit is contained in:
h
2026-04-06 15:36:51 +09:00
parent 1081ea1074
commit 2e9e100178
10 changed files with 216 additions and 20 deletions
Download Patch File Download Diff File Expand all files Collapse all files

7
frontend/src/api.js
View File

@@ -1,8 +1,13 @@
const API_BASE = (import.meta.env.VITE_API_BASE_URL ?? '') + '/api';
async function request(path, options = {}) {
const hasBody = options.body !== undefined;
const res = await fetch(`${API_BASE}${path}`, {
headers: { 'Content-Type': 'application/json' },
credentials: 'include',
headers: {
...(hasBody ? { 'Content-Type': 'application/json' } : {}),
...(options.headers ?? {}),
},
...options,
});
if (!res.ok) {

6
frontend/src/components/CarManagement.jsx
View File

@@ -169,7 +169,7 @@ export default function CarManagement({ reloadKey = 0 }) {
onChange={(e) => setNewCarTire(e.target.value)}
>
<option value="ノーマル">ノーマル</option>
<option value="スタットレス">スタットレス</option>
<option value="スタッドレス">スタッドレス</option>
</select>
</label>
<button type="submit" className={styles.btnPrimary} disabled={submitting || !newCarName.trim()}>
@@ -248,7 +248,7 @@ export default function CarManagement({ reloadKey = 0 }) {
onChange={(e) => setEditTire(e.target.value)}
>
<option value="ノーマル">ノーマル</option>
<option value="スタットレス">スタットレス</option>
<option value="スタッドレス">スタッドレス</option>
</select>
</td>
<td className={styles.actions}>
@@ -276,7 +276,7 @@ export default function CarManagement({ reloadKey = 0 }) {
: '-'}
</td>
<td>{car.has_etc ? <span className={styles.badgeEtc}>ETC</span> : 'なし'}</td>
<td>{car.tire_type === 'スタットレス' ? <span className={styles.badgeStudless}>スタッドレス</span> : 'ノーマル'}</td>
<td>{car.tire_type === 'スタッドレス' ? <span className={styles.badgeStudless}>スタッドレス</span> : 'ノーマル'}</td>
<td className={styles.actions}>
<button className={styles.btnEdit} onClick={() => startEdit(car)}>
編集

20
frontend/src/components/ScheduleView.jsx
View File

@@ -373,7 +373,6 @@ export default function ScheduleView({ reloadKey = 0 }) {
</div>
{error && <div className={styles.error}>エラー: {error}</div>}
{loading && <div className={styles.loading}>読み込み中...</div>}
{/* Grid */}
<div
@@ -383,6 +382,14 @@ export default function ScheduleView({ reloadKey = 0 }) {
// don't cancel on leave — handled by global events
}}
>
{loading && (
<div
className={styles.loadingOverlay}
style={{ height: HEADER_HEIGHT }}
>
読み込み中...
</div>
)}
<div
className={styles.grid}
style={{ width: LABEL_WIDTH + DAYS_SHOWN * CELL_WIDTH }}
@@ -448,10 +455,15 @@ export default function ScheduleView({ reloadKey = 0 }) {
<span className={styles.carBadges}>
{car.has_etc ? <span className={styles.badgeEtc}>ETC</span> : null}
{car.tire_type === 'スタッドレス' ? <span className={styles.badgeStudless}>スタッドレス</span> : null}
{isInspectionExpirySoon(car.inspection_expiry) ? (
<span className={styles.badgeWarn} title={`車検満了日: ${car.inspection_expiry}（まもなく期限切れ）`}>車検</span>
) : null}
</span>
{isInspectionExpirySoon(car.inspection_expiry) ? (
<span
className={`${styles.badgeWarn} ${styles.badgeWarnWide}`}
title={`車検満了日: ${car.inspection_expiry}（まもなく期限切れ）`}
>
⚠️ 車検
</span>
) : null}
</span>
</div>

39
frontend/src/components/ScheduleView.module.css
View File

@@ -74,6 +74,23 @@
font-size: 14px;
}
.loadingOverlay {
position: absolute;
top: 0;
left: 0;
right: 0;
z-index: 40;
display: flex;
align-items: center;
justify-content: center;
color: #4b5563;
font-size: 14px;
font-weight: 600;
background: rgba(255, 255, 255, 0.92);
border-bottom: 2px solid #d1d5db;
pointer-events: none;
}
/* Grid wrapper - scrollable */
.gridWrapper {
flex: 1;
@@ -157,9 +174,9 @@
.carLabel {
flex-shrink: 0;
display: flex;
align-items: center;
align-items: flex-start;
gap: 8px;
padding: 0 12px;
padding: 6px 12px;
border-right: 2px solid #d1d5db;
background: white;
position: sticky;
@@ -173,12 +190,13 @@
height: 10px;
border-radius: 50%;
flex-shrink: 0;
align-self: center;
}
.carLabelContent {
display: flex;
flex-direction: column;
gap: 3px;
gap: 2px;
min-width: 0;
flex: 1;
}
@@ -187,9 +205,11 @@
font-size: 13px;
font-weight: 600;
color: #374151;
white-space: nowrap;
overflow: hidden;
text-overflow: ellipsis;
width: 100%;
white-space: normal;
overflow-wrap: anywhere;
word-break: break-word;
line-height: 1.2;
}
.carBadges {
@@ -232,6 +252,13 @@
cursor: default;
}
.badgeWarnWide {
display: flex;
width: 108%;
justify-content: center;
box-sizing: border-box;
}
/* Cell area */
.cellArea {
display: flex;

9
frontend/src/components/TimelineView.jsx
View File

@@ -190,10 +190,17 @@ export default function TimelineView({ reloadKey = 0 }) {
</div>
{error && <div className={styles.error}>エラー: {error}</div>}
{loading && <div className={styles.loading}>読み込み中...</div>}
{/* Timeline grid */}
<div className={styles.gridWrapper} ref={gridRef}>
{loading && (
<div
className={styles.loadingOverlay}
style={{ height: HEADER_HEIGHT }}
>
読み込み中...
</div>
)}
<div className={styles.grid} style={{ width: totalWidth }}>
{/* Sticky header: month/day labels */}
<div className={styles.headerRow} style={{ height: HEADER_HEIGHT }}>

17
frontend/src/components/TimelineView.module.css
View File

@@ -81,6 +81,23 @@
font-size: 14px;
}
.loadingOverlay {
position: absolute;
top: 0;
left: 0;
right: 0;
z-index: 40;
display: flex;
align-items: center;
justify-content: center;
color: #4b5563;
font-size: 14px;
font-weight: 600;
background: rgba(255, 255, 255, 0.92);
border-bottom: 2px solid #d1d5db;
pointer-events: none;
}
/* Grid */
.gridWrapper {
flex: 1;

1
frontend/vite.config.js
View File

@@ -49,6 +49,7 @@ export default defineConfig({
plugins: [react(), wsProxyPlugin()],
server: {
port: 5173,
allowedHosts: ["car.33-4.party"],
proxy: {
'/api': {
target: backendOrigin,