Web4ai/o2o-site-AEO
5
0
Fork 0
Code Issues Pull Requests Actions Packages Projects Releases Wiki Activity
5e2def200b
o2o-site-AEO/solution/site/scripts/mockup/build5/booking/index.html
Mina Choi 872d00f3c4 [feat] solution: 미니 블로그·이용후기·예약요청 추가, /s/stay 목업·발행 사이트 UI 다수 수정 
인앱 미니 블로그(AI 자동 포스트, 이메일 승인)·이용후기(즉시 게시)·예약 요청(메일 발송)을
새로 붙였고, 병행해서 /s/stay 목업과 발행 사이트 공통 렌더러(UnitsSection·FestivalSection·
LocalGuideSection·WeatherSection 등)의 UI 버그를 다수 고쳤다. 범위가 넓지만 한 주 분량
작업을 한 커밋으로 묶어 달라는 요청에 따라 하나로 묶는다.

- solution/backend: post/review/booking_request 라우터·서비스·CRUD 추가, 스케줄러에
  블로그 초안 생성(새벽 4:10)·발송(아침 9:00) cron 등록, 마이그레이션 4건 추가
- solution/frontend, admin/frontend: 생성된 API 클라이언트 갱신, 리뷰 모더레이션·
  블로그 글 관리 페이지 추가
- solution/site/src: 객실 상세+실시간예약(날짜선택·연락처 폼)을 모달로 통합, 축제·
  주변안내 카드 클릭 시 모달 전환, 후기 목록 카드 UI, 공용 Modal 컴포넌트 신설,
  날씨 문구 동기화 버그 수정(하늘줄·기온줄 한 타이머로), 시설·편의 가능/불가 아이콘
  색상 하이라이트, 헤더 메뉴 순서를 실제 섹션 순서에 맞춤, 하단 탭바 아이콘 정렬 버그
  (line-height) 수정, 추천일정 점선 연결+데스크톱 자동펼침/모바일 축소, 채널 라벨에
  크롤링 원문("NOL")이 새던 것을 bookingLabel() 로 교체
- solution/site/scripts/mockup: /s/stay 패치 스크립트·주입 CSS·JS 다수 수정, stay4~6
  빌드 스크립트 추가(다른 세션 작업)

테스트: solution/site `npx tsc --noEmit` 통과, `npx vitest run` 93 passed,
solution/backend `pytest tests/test_booking_request.py` 6 passed(로컬 DB 대상).
예약 요청 메일은 실제 발송까지 확인(place 66894a1b 소유자 이메일 누락을 DB에서 보정).
2026-09-18 09:03:18 +09:00

207 lines
22 KiB
HTML
Raw Blame History

<!DOCTYPE HTML>
<html lang="ko">
<head>
<meta charset="utf-8" />
<meta name="viewport" content="width=device-width, initial-scale=1, viewport-fit=cover" />
<title>이용안내 및 예약 · 스테이,머뭄</title>
<meta name="description" content="객실 안내와 요금, 이용 규정, 자주 묻는 질문, 다녀오신 이야기." />
<link rel="canonical" href="https://web4ai.o2osolution.ai/s/stay5/booking" />
<meta property="og:title" content="이용안내 및 예약 · 스테이,머뭄" />
<meta property="og:description" content="객실 안내와 요금, 이용 규정, 자주 묻는 질문, 다녀오신 이야기." />
<meta property="og:type" content="website" />
<meta property="og:url" content="https://web4ai.o2osolution.ai/s/stay5/booking" />
<meta property="og:image" content="https://web4ai.o2osolution.ai/s/stay/img/mirror/aa69a633f8e3a631.jpg" />
<meta name="theme-color" content="#ffffff" />
<link rel="preconnect" href="https://cdn.jsdelivr.net" />
<link rel="preconnect" href="https://fonts.gstatic.com" crossorigin />
<link rel="stylesheet" href="https://fonts.googleapis.com/css2?family=Gowun+Batang:wght@400;700&family=Gugi&display=swap" />
<link rel="stylesheet" href="/s/stay5/assets/css/main.css" />
<link rel="stylesheet" href="/s/stay5/assets/css/meomoom.css" />
<noscript><link rel="stylesheet" href="/s/stay5/assets/css/noscript.css" /></noscript>
</head>
<body class="is-preload">
<header id="topbar">
<a class="brand" href="/s/stay5">스테이,머뭄</a>
<nav><a href="/s/stay5">소개</a><a href="/s/stay5/gunsan">군산</a><a href="/s/stay5/booking" class="on">예약·후기</a></nav>
</header>
<div id="wrapper" class="divided">
<section class="cover mid">
<img class="bg" src="/s/stay/img/h-05.jpg" alt="문 사이로 보이는 흰 앤티크 침대와 검은 서랍장" />
<div class="veil"></div>
<div class="inner">
<p class="kicker">스테이,머뭄</p>
<h1 class="serif">이용안내 및 예약</h1>
<p class="lead">방문 전 확인이 필요한 운영 규정과 시설 안내입니다.</p>
</div>
</section>
<section class="wrapper style1 align-center" id="a">
<div class="inner"><p class="kicker">객실 안내</p><h2 class="serif">A동</h2><p class="sectionlead">편안한 일본집에 와 있는 듯한 느낌의 공간입니다. 독립된 아담한 정원과 창고형 CAFÉ 공간이 있습니다.</p><img class="wideshot" src="/s/stay/img/mirror/6d0c447b6a0c32af.jpg" alt="소파와 탁자, 벽난로 조명이 있는 서까래 천장의 거실" loading="lazy" /><dl class="specs"><div><dt>기준 인원</dt><dd>2명</dd></div><div><dt>최대 인원</dt><dd>4명</dd></div><div><dt>침대</dt><dd>퀸 침대 1개</dd></div><div><dt>면적</dt><dd>52 m²</dd></div><div><dt>주중 요금</dt><dd>198,000원</dd></div><div><dt>요금</dt><dd>198,000 ~ 350,000원</dd></div></dl><ul class="chips wide"><li>욕조</li><li>개별 화장실</li><li>주방</li><li>다이닝룸</li><li>테라스</li><li>벽난로</li><li>OTT</li><li>어메니티</li><li>취사 가능</li></ul></div>
</section>
<section class="wrapper style1 align-center ivory" id="b">
<div class="inner"><p class="kicker">객실 안내</p><h2 class="serif">B동</h2><p class="sectionlead">아늑하고 깔끔한 현대식 모던 스타일 공간입니다. 독립된 아담한 정원과 창고형 CAFÉ 공간이 있습니다.</p><img class="wideshot" src="/s/stay/img/h-05.jpg" alt="문 사이로 보이는 흰 앤티크 침대와 검은 서랍장" loading="lazy" /><dl class="specs"><div><dt>기준 인원</dt><dd>2명</dd></div><div><dt>최대 인원</dt><dd>4명</dd></div><div><dt>침대</dt><dd>킹 침대 1개</dd></div><div><dt>주중 요금</dt><dd>198,000원</dd></div><div><dt>요금</dt><dd>198,000 ~ 350,000원</dd></div></dl><ul class="chips wide"><li>욕조</li><li>개별 화장실</li><li>주방</li><li>다이닝룸</li><li>테라스</li><li>벽난로</li><li>OTT</li><li>어메니티</li><li>취사 가능</li></ul></div>
</section>
<section class="wrapper style1 align-center" id="info">
<div class="inner"><h2 class="serif">이용안내 및 예약</h2><p class="sectionlead">방문 전 확인이 필요한 운영 규정과 시설 안내입니다.</p><dl class="specs"><div><dt>체크인 시간</dt><dd>15:00</dd></div><div><dt>체크아웃 시간</dt><dd>11:00</dd></div><div><dt>인원 추가 요금</dt><dd>20,000원</dd></div><div><dt>주차 가능</dt><dd>가능</dd></div><div><dt>와이파이</dt><dd>있음</dd></div><div><dt>취사 가능</dt><dd>가능</dd></div><div><dt>반려동물 동반</dt><dd>불가</dd></div><div><dt>흡연 가능</dt><dd>불가</dd></div><div><dt>바비큐 이용</dt><dd>불가</dd></div><div><dt>픽업 서비스</dt><dd>없음</dd></div></dl><p class="note cancel"><b>취소·환불 규정</b><br />입실 당일 취소와 노쇼(No Show)는 숙박요금의 100%가 부과되어 환불되지 않습니다. 그 이전 취소 수수료는 예약하신 채널의 취소 규정을 따릅니다.</p></div>
</section>
<section class="wrapper style1 align-center ivory" id="faq">
<div class="inner"><h2 class="serif">자주 묻는 질문</h2><p class="sectionlead">아래 답변은 모두 사업자가 확인한 내용입니다.</p><div class="faq"><details><summary>체크인과 체크아웃 시간은 언제인가요?</summary><p>체크인은 15:00부터이며, 체크아웃은 11:00까지입니다.</p></details><details><summary>객실 기준 인원과 최대 인원, 인원 추가 요금은 어떻게 되나요?</summary><p>A동과 B동 모두 기준 인원은 2명이며, 최대 4명까지 투숙하실 수 있습니다. 인원 추가 요금은 20,000원입니다.</p></details><details><summary>객실 내 취사가 가능한가요?</summary><p>주방에서 간단한 조리는 가능합니다. 다만 생선구이·고기구이·튀김처럼 냄새가 잘 빠지지 않는 조리는 하실 수 없고, 객실 안에서 직화로 굽는 방식도 허용되지 않습니다. 그릴·숯·전기 전열기구 등 개인 취사도구는 반입이 금지되어 있습니다.</p></details><details><summary>주차와 와이파이 이용이 가능한가요?</summary><p>네, 주차와 와이파이 모두 이용 가능합니다.</p></details><details><summary>반려동물 동반이나 실내 흡연이 가능한가요?</summary><p>반려동물 동반은 불가하며, 전 구역 흡연이 불가능합니다.</p></details><details><summary>A동과 B동은 무엇이 다른가요?</summary><p>A동은 편안한 일본집에 와 있는 듯한 느낌의 공간이고, B동은 아늑하고 깔끔한 현대식 모던 스타일 공간입니다. 두 동 모두 독립된 아담한 정원과 창고형 CAFÉ 공간이 딸려 있으며, 기준 2인 · 최대 4인으로 같습니다. 침대 구성 등 객실 안 자세한 사항은 예약 채널이나 전화로 확인해 주세요.</p></details><details><summary>객실 요금은 얼마인가요?</summary><p>A동과 B동 모두 198,000원 ~ 350,000원입니다. 날짜와 시즌에 따라 달라지므로 정확한 금액은 예약 채널에서 확인해 주세요. 기준 인원(2인)을 넘으면 1인당 20,000원이 더해집니다.</p></details><details><summary>예약 취소 및 환불 규정은 어떻게 되나요?</summary><p>입실 당일 취소와 노쇼(No Show)의 경우 숙박요금의 100%가 부과되어 환불되지 않습니다. 그 이전 취소 수수료는 예약하신 채널의 취소 규정을 따릅니다.</p></details><details><summary>스테이,머뭄은 어떤 숙소인가요?</summary><p>스테이,머뭄은 전북 군산시 절골길 18(신흥동)에 있는 독채 숙소입니다. A동은 일본식 가정집 느낌, B동은 현대식 모던 스타일로 두 동이 있고, 편안한 침구와 좋은 위치를 내세운 곳입니다.</p></details><details><summary>군산 독채 펜션을 찾는데, 여기도 독채인가요?</summary><p>네, 스테이,머뭄은 A동과 B동 모두 독채입니다. 동마다 독립된 정원과 창고형 카페 공간이 딸려 있고, 주방이 있어 취사도 가능합니다.</p></details><details><summary>위치가 어디인가요?</summary><p>스테이,머뭄은 전북 군산시 절골길 18(신흥동 63-18)에 있습니다. 바로 옆 13m 거리에 군산 신흥동 일본식가옥(히로쓰 가옥)이 있는 원도심 골목 안입니다. 문의는 0507-1497-0983입니다.</p></details><details><summary>예약은 어디서 하나요?</summary><p>스테이,머뭄은 네이버 플레이스에서 숙소 정보를 확인하실 수 있고, 전화 0507-1497-0983으로도 문의하실 수 있습니다. 입실 당일 취소와 노쇼는 숙박요금의 100%가 부과되니 일정을 확인하고 예약해 주세요.</p></details></div><details class="more"><summary>나머지 20개 보기</summary><div class="faq"><details><summary>커플 둘이 묵기 좋은 2인 독채인가요?</summary><p>네, 스테이,머뭄 A동과 B동 모두 기준 인원 2인의 독채입니다. 두 동을 각각 한 팀만 쓰고, 독립된 아담한 정원과 창고형 CAFÉ 공간이 딸려 있습니다.</p></details><details><summary>일본식 가옥 같은 숙소를 찾는데 여기가 맞나요?</summary><p>스테이,머뭄 A동이 일본식 가정집 느낌으로 꾸민 독채입니다. 디딤돌 마당과 독립된 정원, 창고형 카페 공간이 딸려 있습니다. B동은 같은 마당 안에 있는 현대식 모던 스타일 독채입니다.</p></details><details><summary>조용하고 프라이빗한 숙소인가요?</summary><p>스테이,머뭄은 A동·B동 두 동뿐인 독채 숙소라 다른 손님과 건물을 나눠 쓰지 않습니다. 두 동 모두 독립된 정원을 따로 두고 있고, 전 구역 금연입니다.</p></details><details><summary>차 없이 걸어서 근대문화거리까지 갈 수 있나요?</summary><p>스테이,머뭄에서 히로쓰 가옥은 13m, 초원사진관 248m, 군산 영화의 거리 318m, 군산근대미술관 708m, 옛 군산세관 728m, 근대건축관(구 조선은행 군산지점) 788m 거리입니다. 원도심 근대 건축물이 숙소를 중심으로 1km 안에 모여 있습니다. 주차도 가능합니다.</p></details><details><summary>이성당이나 근처 맛집까지 얼마나 되나요?</summary><p>스테이,머뭄에서 이성당까지는 455m입니다. 그 밖에 요리주점 도란 135m, 베이커리 물밀소 297m, 백년가게 국밥집 일흥옥 300m, 명월갈비 351m, 꽃게장 한주옥 430m로 모두 가까이 있습니다.</p></details><details><summary>마당이나 정원이 따로 있나요?</summary><p>네. A동과 B동 각각 독립된 아담한 정원과 창고형 CAFÉ 공간이 있습니다. A동에는 디딤돌 마당도 있습니다. 바다 전망은 아닙니다 — 마당과 거실에서 새소리를 들으며 쉬는 숙소입니다.</p></details><details><summary>선유도에 갈 건데 여기서 자도 될까요?</summary><p>네, 스테이,머뭄에서는 다리를 건너 고군산군도 선유도까지 차로 약 45분 걸립니다. 첫날은 군산 도심에서 저녁과 내항 밤 산책을, 이튿날 선유도와 장자도를 도는 1박 2일 코스를 추천 일정으로 안내하고 있습니다.</p></details><details><summary>1박 2일이면 어떻게 돌면 좋을까요?</summary><p>스테이,머뭄이 안내하는 1박 2일 코스는 첫날 오후 체크인 후 빈해원에서 저녁, 군산 내항 밤 산책으로 마무리하고, 이튿날 선유도와 장자도를 도는 일정입니다. 걷는 코스를 원하시면 채만식문학관·내항 부잔교·째보선창·초원사진관·이성당으로 이어지는 반나절 탁류길 코스도 있습니다.</p></details><details><summary>군산이 처음인데 어디부터 보면 좋을까요?</summary><p>스테이,머뭄은 처음 오신 손님께 반나절 개항장 골목 코스를 안내합니다. 군산근대역사박물관에서 시작해 초원사진관, 이성당, 경암동 철길마을 순으로 도는 일정으로, 걷는 거리가 가장 짧은 코스입니다.</p></details><details><summary>비 오는 날에는 뭘 하면 좋을까요?</summary><p>스테이,머뭄은 비 오는 날을 위한 실내 코스를 따로 안내합니다. 군산근대건축관에서 옛 은행 건물 전시를 보고, 한일옥에서 무국으로 몸을 데운 뒤, 째보선창 근처 카페에서 비가 그칠 때까지 앉아 있는 코스입니다. 숙소는 주방이 있어 취사도 가능합니다.</p></details><details><summary>바비큐나 고기를 구워 먹을 수 있나요?</summary><p>바비큐는 하실 수 없습니다. 화재 예방을 위해 객실 안에서 생선이나 고기를 굽는 직화 방식은 허용되지 않으며, 그릴·숯·전기 전열기구 등 개인적으로 준비해 오시는 취사도구도 반입이 금지되어 있습니다.</p></details><details><summary>픽업 서비스가 있나요?</summary><p>픽업 서비스는 지원하지 않습니다.</p></details><details><summary>건물이 오래된 집이라던데 언제 지어졌나요?</summary><p>1920년대에 지어진 적산가옥입니다. 백 년 된 고택을 리모델링해 2024년 5월 독채 펜션으로 문을 열었습니다. 바로 옆이 국가등록문화유산인 군산 신흥동 일본식 가옥(히로쓰 가옥)입니다.</p></details><details><summary>침구는 깨끗한가요?</summary><p>침구류는 매일 세탁하고 살균·건조합니다. 인테리어와 가구, 소품도 하나하나 준비해 두었습니다.</p></details><details><summary>미성년자끼리 이용할 수 있나요?</summary><p>숙박업소는 법적으로 청소년 혼숙이 금지되어 있습니다. 미성년자는 보호자를 동반하셔야 이용하실 수 있습니다.</p></details><details><summary>CCTV가 설치되어 있나요?</summary><p>고객님의 안전과 보안을 위해 대문 입구 쪽에 CCTV를 운영하고 있습니다. 객실 안에는 없습니다.</p></details><details><summary>벌레가 나오지는 않나요?</summary><p>정기적으로 방역하고 있습니다. 다만 자연과 함께하는 공간이라 가끔 벌레나 이물질이 들어올 수 있으며, 이 사유로는 환불이 어려운 점 양해 부탁드립니다.</p></details><details><summary>예약 인원보다 사람이 늘면 어떻게 하나요?</summary><p>미리 숙소로 연락 주세요. 기준 인원(2인)을 넘으면 1인당 20,000원이 추가됩니다. 최대 인원(4인)을 넘으면 입실이 불가능할 수 있고, 그 사유로는 환불을 받으실 수 없습니다.</p></details><details><summary>히로쓰 가옥 바로 옆이라던데 어떤 집인가요?</summary><p>스테이,머뭄은 1920년대에 지어진 집으로, 국가등록문화유산인 군산 신흥동 일본식 가옥(히로쓰 가옥) 후문 바로 옆 13m 거리에 있습니다. 사장님은 이 집이 히로쓰 가옥 관리인이 살던 집이라고 전합니다. 백 년 된 고택을 리모델링해 2024년 5월 독채 펜션으로 문을 열었습니다.</p></details><details><summary>주요 관광지까지 걸어서 얼마나 걸리나요?</summary><p>초원사진관, 이성당, 군산 시간여행마을 등 주요 관광명소가 걸어서 최대 8분 거리입니다. 차 없이 도보 여행이 가능합니다.</p></details></div></details></div>
</section>
<section class="wrapper style1 align-center" id="reviews">
<div class="inner">
<h2 class="serif">다녀오신 이야기</h2>
<p class="sectionlead">점수 대신 문장으로 남겨 주세요.</p>
<ul class="reviews" id="reviewlist"><li class="empty">불러오는 중…</li></ul>
<ul class="actions"><li><button type="button" id="reviewopen" class="button primary">후기 남기기</button></li></ul>
</div>
</section>
<div id="reviewsheet" hidden>
<div class="scrim"></div>
<div class="sheet" role="dialog" aria-modal="true" aria-label="후기 남기기">
<div class="sheethead">
<h3>후기 남기기</h3>
<button type="button" id="reviewclose" class="x" aria-label="닫기">&times;</button>
</div>
<form id="reviewform">
<label for="rv-body">후기</label>
<textarea id="rv-body" name="body" rows="5" maxlength="500"
placeholder="어떤 점이 좋았는지, 다음 손님이 알면 좋을 것을 적어 주세요"></textarea>
<p class="hint"><span id="reviewlen">0</span> / 500자 · 전화번호와 이메일은 적지 말아 주세요</p>
<label for="rv-nick">표시 이름 <em>(선택)</em></label>
<input id="rv-nick" name="nickname" maxlength="40" placeholder="비우면 '손님'으로 올라갑니다" />
<input type="text" name="company" tabindex="-1" autocomplete="off" aria-hidden="true" class="pot" />
<label class="check"><input type="checkbox" name="consent" required />
<span>남긴 글이 이 사이트에 공개되는 것에 동의합니다.</span></label>
<p class="hint" id="reviewstatus"></p>
<button type="submit" class="button primary fit">후기 보내기</button>
</form>
</div>
</div>
<section class="wrapper style1 invert align-center" id="book">
<div class="inner">
<h2 class="serif">실시간 예약</h2>
<p class="sectionlead">빈 방 확인과 결제는 아래 예약 창구에서 진행됩니다.
이 페이지에서는 요금과 이용 조건만 안내합니다.</p>
<ul class="actions stacked">
<li><a class="button primary fit" href="https://m.place.naver.com/place/1133638931/home" target="_blank" rel="noopener noreferrer">네이버 예약</a></li>
<li><a class="button fit ghost" href="tel:0507-1497-0983">0507-1497-0983</a></li>
</ul>
</div>
</section><section class="wrapper style1 align-center pad-s"><div class="inner"><div class="nextnav"><a class="nextcard" href="/s/stay5"><img src="/s/stay/img/mirror/ddc9f804f4ef83b5.jpg" alt="" loading="lazy" /><span><small>소개</small><b>스테이,머뭄 소개</b></span></a><a class="nextcard" href="/s/stay5/gunsan"><img src="/s/stay/img/mirror/f27b7440e2f1183f.jpg" alt="" loading="lazy" /><span><small>군산</small><b>군산 이야기</b></span></a></div></div></section>
<footer class="wrapper style1 invert align-center" id="footer">
<div class="inner">
<h2 class="serif">스테이,머뭄</h2>
<p class="addr">전북 군산시 절골길 18<br /><a href="tel:0507-1497-0983">0507-1497-0983</a></p>
<ul class="actions stacked">
<li><a href="https://m.place.naver.com/place/1133638931/home" class="button primary fit" target="_blank" rel="noopener noreferrer">네이버 예약</a></li>
<li><a href="tel:0507-1497-0983" class="button fit ghost">전화 걸기</a></li>
<li><a href="https://www.instagram.com/staymeomoom" class="button fit" target="_blank" rel="noopener noreferrer">인스타그램</a></li>
</ul>
<p class="tiny">상호 스테이,머뭄 · 전북 군산시 절골길 18 · 최종 업데이트 2026-09-17<br />
레이아웃은 <a href="https://html5up.net/story">Story by HTML5 UP</a>(CC BY 3.0)를 고쳐 썼습니다.<br />
AI O2O의 Web4Ai로 만든 시안입니다.</p>
</div>
</footer>
</div>
<div id="bookbar">
<span class="price"><b>198,000원</b><small>주중 1박 기준 · 2인</small></span>
<a class="button primary" href="https://m.place.naver.com/place/1133638931/home" target="_blank" rel="noopener noreferrer">예약하기</a>
</div>
<script src="/s/stay5/assets/js/jquery.min.js"></script>
<script src="/s/stay5/assets/js/jquery.scrollex.min.js"></script>
<script src="/s/stay5/assets/js/jquery.scrolly.min.js"></script>
<script src="/s/stay5/assets/js/browser.min.js"></script>
<script src="/s/stay5/assets/js/breakpoints.min.js"></script>
<script src="/s/stay5/assets/js/util.js"></script>
<script src="/s/stay5/assets/js/main.js"></script>
<script>
(function () {
var PLACE = "66894a1b-a331-43f1-942c-0ae064a704d6";
var list = document.getElementById('reviewlist');
var openBtn = document.getElementById('reviewopen');
var sheet = document.getElementById('reviewsheet');
var closeBtn = document.getElementById('reviewclose');
var form = document.getElementById('reviewform');
var status = document.getElementById('reviewstatus');
var count = document.getElementById('reviewcount');
var opened = Date.now();
function esc(s) { return String(s == null ? '' : s).replace(/[&<>"]/g, function (c) {
return {'&': '&amp;', '<': '&lt;', '>': '&gt;', '"': '&quot;'}[c]; }); }
function render(items) {
if (count) count.textContent = items.length ? items.length + '개' : '';
if (!items.length) {
list.innerHTML = '<p class="empty">아직 남겨진 후기가 없습니다. 첫 이야기를 들려주세요.</p>';
return;
}
list.innerHTML = items.map(function (r) {
var when = (r.publishedAt || '').slice(0, 10);
return '<li><p class="who"><b>' + esc(r.nickname || '손님') + '</b><time>' + esc(when) +
'</time></p><p class="body">' + esc(r.body) + '</p></li>';
}).join('');
}
function load() {
fetch('/v1/site/reviews?place_id=' + encodeURIComponent(PLACE))
.then(function (r) { return r.json(); })
.then(function (b) { render(Array.isArray(b.items) ? b.items : []); })
.catch(function () { render([]); });
}
function setOpen(on) {
sheet.hidden = !on;
document.body.style.overflow = on ? 'hidden' : '';
if (on) { opened = Date.now(); sheet.querySelector('textarea').focus(); }
}
openBtn.addEventListener('click', function () { setOpen(true); });
closeBtn.addEventListener('click', function () { setOpen(false); });
sheet.querySelector('.scrim').addEventListener('click', function () { setOpen(false); });
document.addEventListener('keydown', function (ev) {
if (ev.key === 'Escape' && !sheet.hidden) setOpen(false);
});
form.addEventListener('submit', function (ev) {
ev.preventDefault();
var data = new FormData(form);
status.textContent = '보내는 중…';
fetch('/v1/site/review', {
method: 'POST', headers: {'Content-Type': 'application/json'},
body: JSON.stringify({
place_id: PLACE,
body: String(data.get('body') || ''),
nickname: String(data.get('nickname') || '') || null,
consent: data.get('consent') === 'on',
company: String(data.get('company') || ''),
elapsed_ms: Date.now() - opened
})
}).then(function (r) { return r.json(); }).then(function (res) {
status.textContent = res.message || '';
if (res.success) { form.reset(); setOpen(false); load(); }
}).catch(function () {
status.textContent = '지금은 남기지 못했습니다. 잠시 뒤 다시 시도해 주세요.';
});
});
var area = form.querySelector('textarea');
var len = document.getElementById('reviewlen');
area.addEventListener('input', function () { len.textContent = area.value.length; });
load();
})();
</script>
</body>
</html>
Reference in New Issue View Git Blame Copy Permalink