fix: [finance] 일일업무일지 기간 보기 Babel 파싱 에러 수정
- 삼항연산자+&& 중첩 구조를 독립 조건문으로 분리 - Object.assign 인라인 스타일을 변수로 분리
This commit is contained in:
김보곤
@@ -594,99 +594,101 @@ className="text-xs border border-gray-200 rounded" style={colorSelectStyle} titl
|
||||
</div>
|
||||
) : null}
|
||||
|
||||
{/* 기간 보기 모드 */}
|
||||
{viewMode === 'range' && (
|
||||
rangeLoading ? (
|
||||
<div className="text-center py-12 text-gray-400">
|
||||
<svg className="animate-spin mx-auto mb-2" width="32" height="32" viewBox="0 0 24 24" fill="none" stroke="currentColor" strokeWidth="2"><path d="M12 2v4M12 18v4M4.93 4.93l2.83 2.83M16.24 16.24l2.83 2.83M2 12h4M18 12h4M4.93 19.07l2.83-2.83M16.24 7.76l2.83-2.83"/></svg>
|
||||
기간 조회 중...
|
||||
</div>
|
||||
) : rangeLogs.length > 0 && (
|
||||
<div className="mt-2">
|
||||
{rangeLogs.map(log => {
|
||||
const logDate = parseDate(log.log_date);
|
||||
const logDayName = DAYS[logDate.getDay()];
|
||||
const logTotal = log.items.length;
|
||||
const logCompleted = log.items.filter(it => it.is_completed).length;
|
||||
const logRate = logTotal > 0 ? ((logCompleted / logTotal) * 100).toFixed(0) : '0';
|
||||
const logRateColor = logRate >= 80 ? '#48bb78' : (logRate >= 50 ? '#ecc94b' : '#f56565');
|
||||
const logRateFill = { height: '100%', borderRadius: '4px', background: logRateColor, width: logRate + '%', transition: 'width 0.3s' };
|
||||
return (
|
||||
<div key={log.id} style={rangeCardStyle}>
|
||||
<div style={rangeDateHeader}>
|
||||
<div className="flex items-center gap-3">
|
||||
<span style={rangeDateText}>{log.log_date}</span>
|
||||
<span style={rangeDayBadge}>{logDayName}</span>
|
||||
</div>
|
||||
<button style={btnOutline} onClick={() => { setViewMode('single'); setCurrentDate(log.log_date); }}>
|
||||
편집
|
||||
</button>
|
||||
{/* 기간 보기 - 로딩 */}
|
||||
{viewMode === 'range' && rangeLoading && (
|
||||
<div className="text-center py-12 text-gray-400">
|
||||
<svg className="animate-spin mx-auto mb-2" width="32" height="32" viewBox="0 0 24 24" fill="none" stroke="currentColor" strokeWidth="2"><path d="M12 2v4M12 18v4M4.93 4.93l2.83 2.83M16.24 16.24l2.83 2.83M2 12h4M18 12h4M4.93 19.07l2.83-2.83M16.24 7.76l2.83-2.83"/></svg>
|
||||
기간 조회 중...
|
||||
</div>
|
||||
)}
|
||||
|
||||
{/* 기간 보기 - 결과 */}
|
||||
{viewMode === 'range' && !rangeLoading && rangeLogs.length > 0 && (
|
||||
<div className="mt-2">
|
||||
{rangeLogs.map(log => {
|
||||
const logDate = parseDate(log.log_date);
|
||||
const logDayName = DAYS[logDate.getDay()];
|
||||
const logTotal = log.items.length;
|
||||
const logCompleted = log.items.filter(it => it.is_completed).length;
|
||||
const logRate = logTotal > 0 ? ((logCompleted / logTotal) * 100).toFixed(0) : '0';
|
||||
const logRateColor = logRate >= 80 ? '#48bb78' : (logRate >= 50 ? '#ecc94b' : '#f56565');
|
||||
const logRateFill = { height: '100%', borderRadius: '4px', background: logRateColor, width: logRate + '%', transition: 'width 0.3s' };
|
||||
const logRateText = { fontSize: '15px', color: logRateColor };
|
||||
return (
|
||||
<div key={log.id} style={rangeCardStyle}>
|
||||
<div style={rangeDateHeader}>
|
||||
<div className="flex items-center gap-3">
|
||||
<span style={rangeDateText}>{log.log_date}</span>
|
||||
<span style={rangeDayBadge}>{logDayName}</span>
|
||||
</div>
|
||||
<table style={tableStyle}>
|
||||
<colgroup>
|
||||
<col style={noCol} />
|
||||
<col style={catCol} />
|
||||
<col style={taskCol} />
|
||||
<col style={prioCol} />
|
||||
<col style={doneCol} />
|
||||
<col style={noteCol} />
|
||||
</colgroup>
|
||||
<thead>
|
||||
<tr>
|
||||
<th style={thStyle}>No.</th>
|
||||
<th style={thStyle}>구분</th>
|
||||
<th style={thStyle}>업무</th>
|
||||
<th style={thStyle}>우선순위</th>
|
||||
<th style={thStyle}>완료</th>
|
||||
<th style={thStyle}>비고</th>
|
||||
</tr>
|
||||
</thead>
|
||||
<tbody>
|
||||
{log.items.map((item, idx) => {
|
||||
const bgColor = getHighlightColor(item.highlight);
|
||||
const rowStyle = bgColor ? { background: bgColor } : {};
|
||||
return (
|
||||
<tr key={item.id} style={rowStyle}>
|
||||
<td style={tdCenter}>{idx + 1}</td>
|
||||
<td style={tdStyle}>{item.category}</td>
|
||||
<td style={tdStyle}>{item.task}</td>
|
||||
<td style={tdCenter}>{item.priority || '-'}</td>
|
||||
<td style={tdCenter}>{item.is_completed ? '\u2705' : '\u2B1C'}</td>
|
||||
<td style={tdStyle}>{item.note}</td>
|
||||
</tr>
|
||||
);
|
||||
})}
|
||||
{log.items.length === 0 && (
|
||||
<tr><td colSpan={6} className="text-center text-gray-400 py-4" style={tdCenter}>항목 없음</td></tr>
|
||||
)}
|
||||
</tbody>
|
||||
</table>
|
||||
{log.memo && (
|
||||
<div style={rangeMemoBlock}>
|
||||
<span className="font-semibold text-xs text-amber-700 mr-2">메모</span>
|
||||
{log.memo}
|
||||
</div>
|
||||
)}
|
||||
{log.reflection && (
|
||||
<div style={rangeReflBlock}>
|
||||
<span className="font-semibold text-xs text-green-700 mr-2">회고</span>
|
||||
{log.reflection}
|
||||
</div>
|
||||
)}
|
||||
<div style={rangeRateBox}>
|
||||
<span className="font-bold text-gray-600 text-sm">달성률</span>
|
||||
<div className="flex items-center gap-3" style={rateContainerStyle}>
|
||||
<div style={rateBar} className="flex-1">
|
||||
<div style={logRateFill}></div>
|
||||
</div>
|
||||
<span className="font-bold" style={Object.assign({}, {fontSize: '15px', color: logRateColor})}>{logRate}%</span>
|
||||
<button style={btnOutline} onClick={() => { setViewMode('single'); setCurrentDate(log.log_date); }}>
|
||||
편집
|
||||
</button>
|
||||
</div>
|
||||
<table style={tableStyle}>
|
||||
<colgroup>
|
||||
<col style={noCol} />
|
||||
<col style={catCol} />
|
||||
<col style={taskCol} />
|
||||
<col style={prioCol} />
|
||||
<col style={doneCol} />
|
||||
<col style={noteCol} />
|
||||
</colgroup>
|
||||
<thead>
|
||||
<tr>
|
||||
<th style={thStyle}>No.</th>
|
||||
<th style={thStyle}>구분</th>
|
||||
<th style={thStyle}>업무</th>
|
||||
<th style={thStyle}>우선순위</th>
|
||||
<th style={thStyle}>완료</th>
|
||||
<th style={thStyle}>비고</th>
|
||||
</tr>
|
||||
</thead>
|
||||
<tbody>
|
||||
{log.items.map((item, idx) => {
|
||||
const bgColor = getHighlightColor(item.highlight);
|
||||
const rowStyle = bgColor ? { background: bgColor } : {};
|
||||
return (
|
||||
<tr key={item.id} style={rowStyle}>
|
||||
<td style={tdCenter}>{idx + 1}</td>
|
||||
<td style={tdStyle}>{item.category}</td>
|
||||
<td style={tdStyle}>{item.task}</td>
|
||||
<td style={tdCenter}>{item.priority || '-'}</td>
|
||||
<td style={tdCenter}>{item.is_completed ? '\u2705' : '\u2B1C'}</td>
|
||||
<td style={tdStyle}>{item.note}</td>
|
||||
</tr>
|
||||
);
|
||||
})}
|
||||
{log.items.length === 0 && (
|
||||
<tr><td colSpan={6} className="text-center text-gray-400 py-4" style={tdCenter}>항목 없음</td></tr>
|
||||
)}
|
||||
</tbody>
|
||||
</table>
|
||||
{log.memo && (
|
||||
<div style={rangeMemoBlock}>
|
||||
<span className="font-semibold text-xs text-amber-700 mr-2">메모</span>
|
||||
{log.memo}
|
||||
</div>
|
||||
)}
|
||||
{log.reflection && (
|
||||
<div style={rangeReflBlock}>
|
||||
<span className="font-semibold text-xs text-green-700 mr-2">회고</span>
|
||||
{log.reflection}
|
||||
</div>
|
||||
)}
|
||||
<div style={rangeRateBox}>
|
||||
<span className="font-bold text-gray-600 text-sm">달성률</span>
|
||||
<div className="flex items-center gap-3" style={rateContainerStyle}>
|
||||
<div style={rateBar} className="flex-1">
|
||||
<div style={logRateFill}></div>
|
||||
</div>
|
||||
<span className="font-bold" style={logRateText}>{logRate}%</span>
|
||||
</div>
|
||||
</div>
|
||||
);
|
||||
})}
|
||||
</div>
|
||||
)
|
||||
</div>
|
||||
);
|
||||
})}
|
||||
</div>
|
||||
)}
|
||||
|
||||
{/* 하단 액션 (단건 모드에서만) */}
|
||||
|
||||
Reference in New Issue
Block a user