motaju/ef_front
1
0
Fork 0
Code Issues Pull Requests Actions Packages Projects Releases Wiki Activity

3

Browse Source
This commit is contained in:
motaju
2025-09-09 07:31:48 +00:00
parent 94b34d5946
commit 2171d5e744
3 changed files with 129 additions and 50 deletions
Download Patch File Download Diff File Expand all files Collapse all files

43
app/components/CalenderSelector.tsx
View File

@@ -1,4 +1,3 @@
import DayRange from "./svgs/dayRange";
import OneMonth from "./svgs/oneMonth";
import Realtime from "./svgs/realtime";
import Arrow from "./svgs/arrow";
@@ -32,12 +31,13 @@ export default function CalenderSelector( {dateString, is_small, onRangeChange}:
}}
>
<div className="flex-shrink-0">
{selected === DateRangeEnum.DAY_RANGE && <DayRange color="#848484" width={is_small ? 16 : 20} height={is_small ? 16 : 20} />}
{selected === DateRangeEnum.ONE_MONTH&& <OneMonth color="#848484" width={is_small ? 16 : 20} height={is_small ? 16 : 20} />}
{selected === DateRangeEnum.ALL&& <Realtime color="#848484" width={is_small ? 16 : 20} height={is_small ? 16 : 20} />}
{selected === DateRangeEnum.ALL ? (
<Realtime color="#848484" width={is_small ? 16 : 20} height={is_small ? 16 : 20} />
) : (
<OneMonth color="#848484" width={is_small ? 16 : 20} height={is_small ? 16 : 20} />
)}
</div>
<div className={`flex-1 min-w-0 font-semibold ${is_small ? 'text-xs':'text-sm'}`}>
{selected === DateRangeEnum.DAY_RANGE && `${rangeStart.toISOString().split('T')[0]} ~ ${rangeEnd.toISOString().split('T')[0]}`}
{selected === DateRangeEnum.ONE_MONTH&& '최근 1개월'}
{selected === DateRangeEnum.ONE_WEEK&& '최근 1주일'}
{selected === DateRangeEnum.TWO_MONTHS&& '최근 2개월'}
@@ -165,38 +165,7 @@ export default function CalenderSelector( {dateString, is_small, onRangeChange}:
<OneMonth color={selected === DateRangeEnum.ONE_YEAR ? '#F94B37' : '#848484'} width={16} height={16} />
<span className="text-sm">최근 1년</span>
</button>
<div
className={`flex items-center gap-1 px-2 pr-0 h-[32px] rounded-md hover:bg-[#f6f6f6] text-left ${selected === DateRangeEnum.DAY_RANGE ? 'bg-[#FFF3F2] font-semibold' : ''}`}
onClick={() => {
// setSelected(DateRangeEnum.DAY_RANGE);
// setIsOpen(false);
}}
>
<DayRange color={selected === DateRangeEnum.DAY_RANGE ? '#F94B37' : '#848484'} width={16} height={16} />
<input
type="text"
value={rangeStart.toISOString().split('T')[0]}
onChange={(e) => setRangeStart(new Date(e.target.value))}
className="border-1 border-border-pale rounded-md p-0.5 text-xs w-[84px] text-center"
/>
<span className="mx-0">~</span>
<input
type="text"
value={rangeEnd.toISOString().split('T')[0]}
onChange={(e) => setRangeEnd(new Date(e.target.value))}
className="border-1 border-border-pale rounded-md p-0.5 text-xs w-[84px] text-center"
/>
<button className="text-xs text-[#848484] border-1 border-border-pale rounded-md p-0.5 px-1 hover:text-[#F94B37] hover:border-[#F94B37]"
onClick={() => {
setSelected(DateRangeEnum.DAY_RANGE);
onRangeChange?.(rangeStart, rangeEnd);
setIsOpen(false);
}}
>
선택
</button>
</div>
</div>
</div>
)}