feat:홈택스 기간 버튼 선택 상태 표시 추가
This commit is contained in:
@@ -338,6 +338,7 @@ className="flex items-center gap-2 px-3 py-1.5 bg-blue-100 text-blue-700 rounded
|
||||
const [dataSource, setDataSource] = useState('local'); // 'local': 로컬 DB, 'api': 바로빌 API
|
||||
const [syncing, setSyncing] = useState(false); // 동기화 중 여부
|
||||
const [lastSyncAt, setLastSyncAt] = useState({ sales: null, purchase: null }); // 마지막 동기화 시간
|
||||
const [selectedPeriod, setSelectedPeriod] = useState(null); // 선택된 기간 버튼 ('q1', 'q2', 'q3', 'q4', 'h1', 'h2', 'year')
|
||||
|
||||
// 진단 관련 상태
|
||||
const [showDiagnoseModal, setShowDiagnoseModal] = useState(false);
|
||||
@@ -657,6 +658,7 @@ className="flex items-center gap-2 px-3 py-1.5 bg-blue-100 text-blue-700 rounded
|
||||
const lastDay = new Date(year, startMonth + 3, 0);
|
||||
setDateFrom(formatKoreanDate(firstDay));
|
||||
setDateTo(formatKoreanDate(lastDay));
|
||||
setSelectedPeriod('q' + quarter);
|
||||
};
|
||||
|
||||
// 기(반기) 계산 (1기: 1-6월, 2기: 7-12월)
|
||||
@@ -668,6 +670,7 @@ className="flex items-center gap-2 px-3 py-1.5 bg-blue-100 text-blue-700 rounded
|
||||
const lastDay = new Date(year, startMonth + 6, 0);
|
||||
setDateFrom(formatKoreanDate(firstDay));
|
||||
setDateTo(formatKoreanDate(lastDay));
|
||||
setSelectedPeriod('h' + half);
|
||||
};
|
||||
|
||||
// 1년 계산
|
||||
@@ -678,6 +681,7 @@ className="flex items-center gap-2 px-3 py-1.5 bg-blue-100 text-blue-700 rounded
|
||||
const lastDay = new Date(year, 11, 31);
|
||||
setDateFrom(formatKoreanDate(firstDay));
|
||||
setDateTo(formatKoreanDate(lastDay));
|
||||
setSelectedPeriod('year');
|
||||
};
|
||||
|
||||
// 거래처 필터링
|
||||
@@ -749,26 +753,47 @@ className="px-3 py-2 text-sm border border-[#ced4da] rounded bg-white focus:bord
|
||||
<input
|
||||
type="date"
|
||||
value={dateFrom}
|
||||
onChange={(e) => setDateFrom(e.target.value)}
|
||||
onChange={(e) => { setDateFrom(e.target.value); setSelectedPeriod(null); }}
|
||||
className="px-3 py-2 text-sm border border-[#ced4da] rounded bg-white focus:border-[#86b7fe] focus:ring-2 focus:ring-[#86b7fe]/25 outline-none"
|
||||
/>
|
||||
<span className="text-[#6c757d] px-1">~</span>
|
||||
<input
|
||||
type="date"
|
||||
value={dateTo}
|
||||
onChange={(e) => setDateTo(e.target.value)}
|
||||
onChange={(e) => { setDateTo(e.target.value); setSelectedPeriod(null); }}
|
||||
className="px-3 py-2 text-sm border border-[#ced4da] rounded bg-white focus:border-[#86b7fe] focus:ring-2 focus:ring-[#86b7fe]/25 outline-none"
|
||||
/>
|
||||
</div>
|
||||
{/* 분기/기/년 버튼 그룹 */}
|
||||
<div className="flex items-center">
|
||||
<button onClick={() => handleQuarter(1)} className="px-3 py-2 text-xs border border-[#ced4da] bg-white hover:bg-[#e9ecef] transition-colors rounded-l">1분기</button>
|
||||
<button onClick={() => handleQuarter(2)} className="px-3 py-2 text-xs border-t border-b border-[#ced4da] bg-white hover:bg-[#e9ecef] transition-colors">2분기</button>
|
||||
<button onClick={() => handleQuarter(3)} className="px-3 py-2 text-xs border-t border-b border-[#ced4da] bg-white hover:bg-[#e9ecef] transition-colors">3분기</button>
|
||||
<button onClick={() => handleQuarter(4)} className="px-3 py-2 text-xs border border-[#ced4da] bg-white hover:bg-[#e9ecef] transition-colors">4분기</button>
|
||||
<button onClick={() => handleHalf(1)} className="px-3 py-2 text-xs border-t border-b border-r border-[#ced4da] bg-white hover:bg-[#e9ecef] transition-colors">1기</button>
|
||||
<button onClick={() => handleHalf(2)} className="px-3 py-2 text-xs border-t border-b border-r border-[#ced4da] bg-white hover:bg-[#e9ecef] transition-colors">2기</button>
|
||||
<button onClick={handleYear} className="px-3 py-2 text-xs border border-[#ced4da] bg-white hover:bg-[#e9ecef] transition-colors rounded-r">1년</button>
|
||||
<button
|
||||
onClick={() => handleQuarter(1)}
|
||||
className={`px-3 py-2 text-xs border border-[#ced4da] transition-colors rounded-l ${selectedPeriod === 'q1' ? 'bg-[#0d6efd] text-white border-[#0d6efd]' : 'bg-white hover:bg-[#e9ecef]'}`}
|
||||
>1분기</button>
|
||||
<button
|
||||
onClick={() => handleQuarter(2)}
|
||||
className={`px-3 py-2 text-xs border-t border-b border-[#ced4da] transition-colors ${selectedPeriod === 'q2' ? 'bg-[#0d6efd] text-white border-[#0d6efd]' : 'bg-white hover:bg-[#e9ecef]'}`}
|
||||
>2분기</button>
|
||||
<button
|
||||
onClick={() => handleQuarter(3)}
|
||||
className={`px-3 py-2 text-xs border-t border-b border-[#ced4da] transition-colors ${selectedPeriod === 'q3' ? 'bg-[#0d6efd] text-white border-[#0d6efd]' : 'bg-white hover:bg-[#e9ecef]'}`}
|
||||
>3분기</button>
|
||||
<button
|
||||
onClick={() => handleQuarter(4)}
|
||||
className={`px-3 py-2 text-xs border border-[#ced4da] transition-colors ${selectedPeriod === 'q4' ? 'bg-[#0d6efd] text-white border-[#0d6efd]' : 'bg-white hover:bg-[#e9ecef]'}`}
|
||||
>4분기</button>
|
||||
<button
|
||||
onClick={() => handleHalf(1)}
|
||||
className={`px-3 py-2 text-xs border-t border-b border-r border-[#ced4da] transition-colors ${selectedPeriod === 'h1' ? 'bg-[#0d6efd] text-white border-[#0d6efd]' : 'bg-white hover:bg-[#e9ecef]'}`}
|
||||
>1기</button>
|
||||
<button
|
||||
onClick={() => handleHalf(2)}
|
||||
className={`px-3 py-2 text-xs border-t border-b border-r border-[#ced4da] transition-colors ${selectedPeriod === 'h2' ? 'bg-[#0d6efd] text-white border-[#0d6efd]' : 'bg-white hover:bg-[#e9ecef]'}`}
|
||||
>2기</button>
|
||||
<button
|
||||
onClick={handleYear}
|
||||
className={`px-3 py-2 text-xs border border-[#ced4da] transition-colors rounded-r ${selectedPeriod === 'year' ? 'bg-[#0d6efd] text-white border-[#0d6efd]' : 'bg-white hover:bg-[#e9ecef]'}`}
|
||||
>1년</button>
|
||||
</div>
|
||||
{/* 검색 버튼 */}
|
||||
<button
|
||||
|
||||
Reference in New Issue
Block a user