diff --git a/src/components/screens/ChallengeScreen.jsx b/src/components/screens/ChallengeScreen.jsx index b60a78a..2ae1ceb 100644 --- a/src/components/screens/ChallengeScreen.jsx +++ b/src/components/screens/ChallengeScreen.jsx @@ -273,7 +273,7 @@ function ChallengeCard({ }) { const [showModal, setShowModal] = useState(false); const [selectedType, setSelectedType] = useState(null); - // 남은시간 계산 및 실시간 갱신 (진행중 + 참여가능) + // ✅ 남은시간 계산 및 실시간 갱신 (진행중 + 참여가능) const [remainingTime, setRemainingTime] = useState(''); const [isExpired, setIsExpired] = useState(false); @@ -312,7 +312,7 @@ function ChallengeCard({ const minutes = Math.floor((diff / (1000 * 60)) % 60); const seconds = Math.floor((diff / 1000) % 60); - // 형식: “3일 4시간 22분 18초” + // ✅ 형식: “3일 4시간 22분 18초” setRemainingTime(`${days}일 ${hours}시간 ${minutes}분 ${seconds}초`); setIsExpired(false); }; diff --git a/src/components/screens/PointExchangeScreen.jsx b/src/components/screens/PointExchangeScreen.jsx index 4cab4a8..4a2c2cf 100644 --- a/src/components/screens/PointExchangeScreen.jsx +++ b/src/components/screens/PointExchangeScreen.jsx @@ -30,10 +30,6 @@ import { convertVoucherToGifticon, formatDate } from '../../util/pointApi'; export default function PointExchangeScreen({ onNavigate }) { const dispatch = useDispatch(); - const [showPhoneModal, setShowPhoneModal] = useState(false); - const [phoneNumber, setPhoneNumber] = useState(''); - const [phoneError, setPhoneError] = useState(false); - // Redux로 포인트샵 데이터 가져오기 const { data: shopData, loading: isLoading, error } = usePointShop(); const { spendPoint, loading: isSpending } = useSpendPoint(); @@ -59,34 +55,6 @@ export default function PointExchangeScreen({ onNavigate }) { const [showTransferModal, setShowTransferModal] = useState(false); const [savedAccounts, setSavedAccounts] = useState([]); - const handleGifticonConfirm = () => { - // 구매 확인 모달 닫고 → 전화번호 입력 모달로 이동 - setShowConfirmModal(false); - setShowPhoneModal(true); - }; - - const handlePhoneSubmit = async () => { - if (!phoneNumber.trim()) { - setPhoneError(true); - return; - } - setPhoneError(false); - setShowPhoneModal(false); - - try { - await spendPoint({ - point: selectedGifticon.voucherId, // voucher_id 전달 - type: 'VOUCHER', - }); - setShowSuccessModal(true); - dispatch(fetchPointShop()); - dispatch(fetchUsedPointLogs()); - } catch (error) { - console.error('포인트 사용 실패:', error); - alert('구매에 실패했습니다: ' + (error.message || '알 수 없는 오류')); - } - }; - // 컴포넌트 마운트 시 포인트샵 데이터 가져오기 useEffect(() => { dispatch(fetchPointShop()); @@ -204,7 +172,7 @@ export default function PointExchangeScreen({ onNavigate }) { console.error('포인트전환 실패:', error); alert( '포인트전환 신청에 실패했습니다: ' + - (error.message || '알 수 없는 오류') + (error.message || '알 수 없는 오류') ); } }; @@ -262,20 +230,22 @@ export default function PointExchangeScreen({ onNavigate }) {
@@ -435,10 +407,11 @@ export default function PointExchangeScreen({ onNavigate }) { ) } disabled={!canAfford} - className={`w-full py-2.5 px-3 rounded-lg text-sm font-bold transition-all ${canAfford + className={`w-full py-2.5 px-3 rounded-lg text-sm font-bold transition-all ${ + canAfford ? 'bg-[#4CAF50] text-white hover:bg-[#45a049] shadow-sm' : 'bg-gray-100 text-gray-400 cursor-not-allowed' - }`} + }`} > {canAfford ? '구매하기' @@ -682,7 +655,7 @@ export default function PointExchangeScreen({ onNavigate }) {

) : usedLogs && - usedLogs.filter((item) => item.pointAmount < 0).length > 0 ? ( + usedLogs.filter((item) => item.pointAmount < 0).length > 0 ? (
{usedLogs .filter((item) => item.pointAmount < 0) // 사용(음수)만 필터링 @@ -706,12 +679,13 @@ export default function PointExchangeScreen({ onNavigate }) {
{isVoucher ? ( @@ -821,93 +795,17 @@ export default function PointExchangeScreen({ onNavigate }) { 취소 - -
- - - )} - - - {/* 전화번호 입력 모달 */} - - {showPhoneModal && ( - setShowPhoneModal(false)} - > - e.stopPropagation()} - className="bg-white rounded-3xl p-6 max-w-sm w-full text-center" - > - - - - -

수령자 정보 입력

-

- 기프티콘을 받을 휴대폰 번호를 입력해주세요 📱 -

- - setPhoneNumber(e.target.value)} - placeholder="010-1234-5678" - className={`w-full border rounded-xl px-3 py-2 text-center text-gray-700 focus:outline-none focus:ring-2 ${phoneError - ? 'border-red-400 focus:ring-red-300' - : 'border-gray-300 focus:ring-[#4CAF50]' - }`} - /> - {phoneError && ( -

- 번호를 입력해주세요. -

- )} - -

- ※ 입력된 번호는 저장되지 않습니다. -

- -
- -
)}
- {/* 포인트전환 확인 모달 */} {showTransferModal && ( @@ -926,8 +824,8 @@ export default function PointExchangeScreen({ onNavigate }) { className='bg-white rounded-3xl p-6 max-w-sm w-full' >
-
- +
+

포인트전환 신청 확인 @@ -967,7 +865,7 @@ export default function PointExchangeScreen({ onNavigate }) { {Math.ceil( parseInt(transferAmount || 0) * - 1.05 + 1.05 ).toLocaleString()} P @@ -976,7 +874,7 @@ export default function PointExchangeScreen({ onNavigate }) { 입금 예정액 - + {parseInt( transferAmount || 0 ).toLocaleString()} @@ -997,7 +895,7 @@ export default function PointExchangeScreen({ onNavigate }) { @@ -1014,7 +912,7 @@ export default function PointExchangeScreen({ onNavigate }) { initial={{ opacity: 0 }} animate={{ opacity: 1 }} exit={{ opacity: 0 }} - className="fixed inset-0 bg-black bg-opacity-50 flex items-center justify-center z-50 p-4" + className='fixed inset-0 bg-black bg-opacity-50 flex items-center justify-center z-50 p-4' onClick={() => setShowSuccessModal(false)} > e.stopPropagation()} - className="bg-white rounded-3xl p-6 max-w-sm w-full text-center" + className='bg-white rounded-3xl p-6 max-w-sm w-full text-center' > - + - -

신청 완료!

- - {/* {activeTab === 'gifticon' && ( -
-

- 기프티콘을 받을 번호를 입력해주세요 📱 -

- console.log('입력값:', e.target.value)} - /> -

- ※ 입력한 번호는 저장되지 않습니다. -

-
- )} */} - - -

+

+ 신청 완료! +

+

{activeTab === 'gifticon' - ? '번호 입력 후 해당 번호로 기프티콘이 발송됩니다. ( 영업일 기준 1~3일 내 )' - : '포인트전환 신청이 완료되었습니다. 영업일 기준 1~3일 내 입금됩니다.'} + ? '구매가 완료되었습니다. 등록하신 번호로 기프티콘이 발송되었습니다.' + : '포인트전환 신청이 완료되었습니다. 영업일 기준 1-3일 내 입금됩니다.'}

- @@ -1074,7 +952,6 @@ export default function PointExchangeScreen({ onNavigate }) {
)} -

); }