/* ========================================================= pages_browse.jsx — Landing, Hotels list, Hotel detail ========================================================= */ /* ---------------- landing ---------------- */ function LandingPage(){ const { hotels } = useStore(); const featured = [...hotels].sort((a,b)=>b.depositRatio-a.depositRatio).slice(0,3); return (
{/* hero */}
보증금으로 안심하는 호텔 예약

예약금을 호텔이 아니라,
약속에 맡기세요.

호텔이 회원님의 예약금만큼 보증금을 함께 맡겨 둡니다. 문제가 생기면 복잡한 절차 없이 곧바로 전액을 돌려받을 수 있어요.

{/* how it works */}
신뢰 메커니즘

보증금이 곧 신뢰 지표입니다

호텔이 더 많은 보증금을 예치할수록, 호텔은 약속을 지킬 이유가 커집니다. 그래서 보증금 비율이 높은 호텔이 상단에 노출됩니다.

{[ ["1","예약금 맡기기","회원님이 예약금을 맡기면, 호텔도 그 비율만큼 보증금을 함께 맡겨 둡니다.","coins"], ["2","이용 & 체크인","호텔 도착 후 직접 체크인을 누르고, 이용을 마치면 체크아웃을 눌러 마무리합니다.","key"], ["3","자동 정산 / 보상","정상 완료 시 호텔로 정산되고, 문제 신고 시 예약금+보증금 전액이 즉시 회원님께 환급됩니다.","shieldCheck"], ].map(([n,t,d,ic])=>(
0{n}
{t}
{d}
))}
{/* featured trusted hotels */}

신뢰 호텔 추천

보증금 비율 상위
navigate("/hotels")} style={{cursor:"pointer"}}>전체 보기
{featured.map(h=> )} {featured.length===0 && (
아직 등록된 호텔이 없습니다
호텔 관리자로 접속해 첫 호텔을 등록하면 여기에 노출됩니다.
)}
{/* dispute reassurance band */}
분쟁 즉시 집행

고객센터를 기다릴 필요가
없습니다.

호텔 귀책으로 문제가 발생하면 "문제 발생 신고" 한 번으로 예약금과 호텔 보증금 전액이 회원님 지갑으로 즉시 이체됩니다. 중개자도, 대기시간도 없습니다.

복잡한 승인 절차 없음 거래 내역 확인 가능 예약금+보증금 전액
{/* demo disclaimer */}
본 페이지는 실제 서비스가 아닌 디자인 시연용 데모입니다. 호텔 정보·가격·후기·거래 내역은 모두 가상의 예시이며, 실제 결제나 블록체인 거래는 이루어지지 않습니다.
); } /* ---------------- hotels list ---------------- */ function HotelsPage(){ const { hotels } = useStore(); const [sort, setSort] = useState("deposit"); const [maxPrice, setMaxPrice] = useState(0.15); const [minRatio, setMinRatio] = useState(0); let list = hotels.filter(h=> { const p=hotelPrice(h); return (p==null || p<=maxPrice) && h.depositRatio>=minRatio; }); list = [...list].sort((a,b)=>{ if(sort==="deposit") return b.depositRatio-a.depositRatio; if(sort==="price") return (hotelPrice(a)??1e9)-(hotelPrice(b)??1e9); return 0; }); return (
신뢰 호텔

호텔 둘러보기

보증금 비율이 높은 호텔이 위쪽에 노출됩니다. 마음에 드는 호텔을 눌러 자세히 살펴보세요.

{/* filters */} {/* results */}
{list.length}개 호텔 보증금 비율순 정렬
{list.map(h=> )}
{hotels.length===0 ? (
아직 등록된 호텔이 없습니다
호텔 관리자로 접속해 호텔을 등록하면 여기에 표시됩니다.
) : list.length===0 &&
조건에 맞는 호텔이 없습니다.
}
); } /* ---------------- hotel detail ---------------- */ function HotelDetailPage({ id }){ const hotel = getHotel(id); const rooms = hotel ? hotel.rooms.filter(r => r.isAvailable !== false) : []; const firstListable = rooms.findIndex(roomListable); const [roomIdx, setRoomIdx] = useState(firstListable>=0?firstListable:0); if(!hotel) return
호텔을 찾을 수 없습니다. navigate("/hotels")} style={{cursor:"pointer"}}>호텔 둘러보기
; const t = trustTier(hotel.depositRatio); const selectable = rooms[roomIdx] && roomListable(rooms[roomIdx]) ? roomIdx : (firstListable>=0?firstListable:roomIdx); const room = rooms[selectable] || rooms[0]; const anyAvailable = firstListable>=0; const price = room ? +(room.price).toFixed(4) : 0; const isNew = !hotel.reviews; return (
{/* gallery */}
{/* left: info */}
{isNew ? 신규 등록 : <>· 후기 {hotel.reviews}}

{hotel.name}

{hotel.city}{hotel.area&&hotel.area!==hotel.city?" · "+hotel.area:""}

{hotel.tagline}

{hotel.desc}

{/* trust spotlight */}
{t.label} 호텔
이 호텔은 예약금의 {hotel.depositRatio}%를 보증금으로 함께 맡겨 둡니다.
{/* rooms */}
객실 선택
{rooms.map((r,i)=>{ const p = +(r.price).toFixed(4); const on = i===selectable; const listable = roomListable(r); const booked = roomBookedCount(r); return ( ); })}
{/* right: booking summary */}
); } Object.assign(window, { LandingPage, HotelsPage, HotelDetailPage });