feat: strengthen design skill and refresh all showcases
Some checks failed
ci / build (push) Has been cancelled
Some checks failed
ci / build (push) Has been cancelled
This commit is contained in:
Yun Chan
parent
69e5cc1efd
commit
e09d4efb1c
257 changed files with 8196 additions and 2374 deletions
|
|
@ -3,10 +3,10 @@
|
|||
<head>
|
||||
<meta charset="utf-8" />
|
||||
<meta name="viewport" content="width=device-width, initial-scale=1, viewport-fit=cover" />
|
||||
<title>청온 케어 · 프리미엄 주거·오피스 전문 위생 케어 & 관제 콘솔</title>
|
||||
<title>청온 케어 · 프리미엄 주거·오피스 위생 케어 안내</title>
|
||||
<meta
|
||||
name="description"
|
||||
content="임상 수준의 6단계 위생 프로토콜과 100% 정찰제 견적. 독일 카처 4.0bar 고온스팀과 에코서트 인증 천연 세제. 실시간 견적 신청 및 관제 콘솔 지원."
|
||||
content="위생 케어 절차, 예상 견적, 운영 정보의 표시 방식을 소개합니다. 가격과 접수 정보는 예시이며 실제 신청은 진행되지 않습니다."
|
||||
/>
|
||||
<meta property="og:title" content="청온 케어 · 프리미엄 위생 케어" />
|
||||
<meta property="og:description" content="공간의 숨결을 되돌리는 6단계 프로토콜과 투명한 정찰제 견적." />
|
||||
|
|
@ -24,7 +24,8 @@
|
|||
rel="stylesheet"
|
||||
href="https://fonts.googleapis.com/css2?family=JetBrains+Mono:wght@400;500;700&display=swap"
|
||||
/>
|
||||
<link rel="stylesheet" href="./styles/main.css?v=1" />
|
||||
<link rel="stylesheet" href="./styles/fonts.css?v=20260912all" />
|
||||
<link rel="stylesheet" href="./styles/main.css?v=20260912all" />
|
||||
<link
|
||||
rel="icon"
|
||||
href="data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 32 32'%3E%3Crect width='32' height='32' rx='8' fill='%230D9488'/%3E%3Cpath d='M9 16.5l5 5 9-10' stroke='%23ffffff' stroke-width='2.5' stroke-linecap='round' stroke-linejoin='round' fill='none'/%3E%3C/svg%3E"
|
||||
|
|
@ -56,7 +57,7 @@
|
|||
</button>
|
||||
<button type="button" class="mode-btn" id="btnModeAdmin" title="단축키: Alt + A">
|
||||
<span class="badge-dot" aria-hidden="true"></span>
|
||||
관리자 콘솔
|
||||
운영 현황
|
||||
</button>
|
||||
</div>
|
||||
<a href="#calculator" class="btn client-only-btn">
|
||||
|
|
@ -76,43 +77,38 @@
|
|||
<div class="wrap hero-grid">
|
||||
<div class="hero-content">
|
||||
<div class="eyebrow">
|
||||
<span>임상 수준 위생 프로토콜</span>
|
||||
<span>현장 검수 절차 예시</span>
|
||||
</div>
|
||||
<h1 id="heroHeading" class="hero-title">
|
||||
보이지 않는 미세 오염까지,<br />
|
||||
<em>공간의 숨결</em>을 되돌립니다
|
||||
보이지 않는 오염까지,<br />
|
||||
<em>공간을 새롭게</em> 돌봅니다
|
||||
</h1>
|
||||
<p class="hero-desc">
|
||||
단순한 미화가 아닙니다. 독일 카처 4.0bar 고온 스팀과 에코서트(ECOCERT) 인증 친환경 세제로 새집증후군, 미세 분진, 알레르기 유발 물질을 근본적으로 제거합니다.
|
||||
공간 유형과 선택 항목을 바탕으로 케어 범위와 예상 금액을 살펴볼 수 있습니다.
|
||||
</p>
|
||||
<div class="hero-ctas">
|
||||
<a href="#calculator" class="btn-primary">
|
||||
실시간 정찰제 견적 계산하기
|
||||
항목별 예상 견적 보기
|
||||
<span class="btn-icon-circle" aria-hidden="true">↗</span>
|
||||
</a>
|
||||
<div class="hero-trust">
|
||||
<span class="hero-trust-stars">★★★★★</span>
|
||||
<span>누적 케어 4,820세대 · 만족도 99.4%</span>
|
||||
<span>선택 항목별 예상 금액을 확인하세요</span>
|
||||
</div>
|
||||
</div>
|
||||
<p class="demo-notice" role="note">안내: 이 페이지의 서비스·가격·운영 현황은 예시입니다. 입력 정보는 저장·전송되지 않으며 실제 견적이나 신청으로 이어지지 않습니다.</p>
|
||||
</div>
|
||||
|
||||
<div class="hero-visual">
|
||||
<div class="bezel-outer">
|
||||
<div class="hero-frame">
|
||||
<img
|
||||
src="./assets/clean-hero.webp"
|
||||
alt="정밀 입주 케어가 완료된 미니멀한 프리미엄 주거 거실 전경"
|
||||
width="1200"
|
||||
height="900"
|
||||
loading="eager"
|
||||
/>
|
||||
</div>
|
||||
</div>
|
||||
<div class="hero-stat-floating">
|
||||
<span class="stat-val">32 Point</span>
|
||||
<span class="stat-label">마스터 클리너<br />정밀 검수 체크리스트</span>
|
||||
</div>
|
||||
<figure class="hero-frame">
|
||||
<img
|
||||
src="./assets/clean-hero.webp"
|
||||
alt="정돈된 주거 공간의 거실 전경"
|
||||
width="1200"
|
||||
height="900"
|
||||
loading="eager"
|
||||
/>
|
||||
<figcaption>주거 공간 케어 예시 · 현장에서는 32개 검수 항목을 확인하는 흐름을 표시합니다.</figcaption>
|
||||
</figure>
|
||||
</div>
|
||||
</div>
|
||||
</section>
|
||||
|
|
@ -121,8 +117,9 @@
|
|||
<section class="calc-section" id="calculator" aria-labelledby="calcHeading">
|
||||
<div class="wrap">
|
||||
<div class="section-head">
|
||||
<h2 id="calcHeading" class="section-title">투명한 정찰제 실시간 견적 산정</h2>
|
||||
<p class="section-sub">추가금 없는 명확한 기준. 공간 면적과 맞춤 옵션을 선택하시면 즉시 예상 금액이 산출됩니다.</p>
|
||||
<p class="eyebrow">견적 작업표</p>
|
||||
<h2 id="calcHeading" class="section-title">항목별 예상 견적</h2>
|
||||
<p class="section-sub">공간 면적과 선택 항목을 기준으로 예상 금액의 구성 방식을 확인합니다.</p>
|
||||
</div>
|
||||
|
||||
<div class="calc-grid">
|
||||
|
|
@ -153,6 +150,7 @@
|
|||
<input
|
||||
type="range"
|
||||
id="pyeongSlider"
|
||||
name="spaceSize"
|
||||
class="range-input"
|
||||
min="12"
|
||||
max="75"
|
||||
|
|
@ -167,11 +165,11 @@
|
|||
<div class="addon-grid">
|
||||
<label class="addon-label">
|
||||
<input type="checkbox" name="addon" value="steam" data-price="45000" checked />
|
||||
<span>160℃ 고온 살균 스팀 (+45,000원)</span>
|
||||
<span>고온 스팀 작업 기록 (+45,000원)</span>
|
||||
</label>
|
||||
<label class="addon-label">
|
||||
<input type="checkbox" name="addon" value="phytoncide" data-price="35000" checked />
|
||||
<span>편백 피톤치드 훈증 (+35,000원)</span>
|
||||
<span>향·마감 작업 기록 (+35,000원)</span>
|
||||
</label>
|
||||
<label class="addon-label">
|
||||
<input type="checkbox" name="addon" value="aircon" data-price="80000" />
|
||||
|
|
@ -187,30 +185,36 @@
|
|||
<!-- 예약 정보 입력 -->
|
||||
<div class="form-group" style="margin-top: 1.5rem;">
|
||||
<span class="form-label">신청자 정보</span>
|
||||
<div style="display: grid; grid-template-columns: repeat(auto-fit, minmax(130px, 1fr)); gap: 0.75rem;">
|
||||
<div style="display: grid; grid-template-columns: repeat(auto-fit, minmax(130px, 1fr)); gap: 0.75rem;">
|
||||
<label class="sr-only" for="clientName">신청자 성함</label>
|
||||
<input
|
||||
type="text"
|
||||
id="clientName"
|
||||
name="clientName"
|
||||
autocomplete="name"
|
||||
placeholder="성함 / 고객명"
|
||||
style="width: 100%; min-width: 0; padding: 10px; border: 1px solid var(--line); border-radius: var(--radius-sm); font-size: var(--step--1);"
|
||||
value="이서연"
|
||||
required
|
||||
/>
|
||||
<label class="sr-only" for="clientPhone">신청자 연락처</label>
|
||||
<input
|
||||
type="tel"
|
||||
id="clientPhone"
|
||||
name="clientPhone"
|
||||
autocomplete="tel"
|
||||
placeholder="연락처 (010-0000-0000)"
|
||||
style="width: 100%; min-width: 0; padding: 10px; border: 1px solid var(--line); border-radius: var(--radius-sm); font-size: var(--step--1);"
|
||||
value="010-4821-9930"
|
||||
required
|
||||
/>
|
||||
</div>
|
||||
<label class="sr-only" for="clientAddress">케어 현장 주소</label>
|
||||
<input
|
||||
type="text"
|
||||
id="clientAddress"
|
||||
name="clientAddress"
|
||||
autocomplete="off"
|
||||
placeholder="케어 현장 주소 (예: 서울시 마포구 공덕동 120)"
|
||||
style="width: 100%; min-width: 0; margin-top: 0.5rem; padding: 10px; border: 1px solid var(--line); border-radius: var(--radius-sm); font-size: var(--step--1);"
|
||||
value="서울시 성동구 성수동2가 아크로포레스트 102동"
|
||||
required
|
||||
/>
|
||||
</div>
|
||||
|
|
@ -219,7 +223,7 @@
|
|||
|
||||
<!-- 요약 및 접수 CTA -->
|
||||
<div class="calc-summary">
|
||||
<h3 class="summary-title">실시간 견적 명세서</h3>
|
||||
<h3 class="summary-title">예상 견적 명세</h3>
|
||||
<div class="summary-row">
|
||||
<span>선택 공간</span>
|
||||
<span id="sumSpaceType" class="mono">주거 입주/이사</span>
|
||||
|
|
@ -242,10 +246,10 @@
|
|||
</div>
|
||||
|
||||
<button type="button" class="calc-submit" id="btnSubmitQuote">
|
||||
이 견적으로 신청 접수하기
|
||||
예상 견적 보기
|
||||
</button>
|
||||
<p style="font-size: 12px; color: var(--ink-inverse-muted); margin-top: 10px; text-align: center;">
|
||||
✓ 접수 즉시 배차 팀장이 연락 후 사전 현장 조율을 진행합니다.
|
||||
<p style="font-size: 12px; color: var(--ink-muted); margin-top: 10px; text-align: center;">
|
||||
선택 항목에 따른 예상 금액을 확인할 수 있습니다. 실제 견적·신청은 진행되지 않습니다.
|
||||
</p>
|
||||
</div>
|
||||
</div>
|
||||
|
|
@ -257,11 +261,11 @@
|
|||
<div class="wrap">
|
||||
<div class="section-head" style="display: flex; justify-content: space-between; align-items: flex-end; flex-wrap: wrap; gap: 12px;">
|
||||
<div>
|
||||
<h2 id="protoHeading" class="section-title">임상 수준의 6단계 청온 케어 프로토콜</h2>
|
||||
<p class="section-sub">표면만 닦는 청소가 아닌, 미세 분진과 세균 번식의 원인을 제거하는 체계적인 과정입니다.</p>
|
||||
<h2 id="protoHeading" class="section-title">6단계 현장 검수 절차 예시</h2>
|
||||
<p class="section-sub">작업 순서와 확인 항목을 기록하는 방식의 예시입니다. 결과나 성능을 보증하지 않습니다.</p>
|
||||
</div>
|
||||
<a href="./protocol/index.html" class="action-btn" style="text-decoration: none; padding: 10px 20px; font-size: 14px; background: var(--surface-card); color: var(--accent); border: 1px solid var(--accent);">
|
||||
나인원한남 ATP 측정 리포트 보기 →
|
||||
검수 절차 예시 보기 →
|
||||
</a>
|
||||
</div>
|
||||
|
||||
|
|
@ -269,37 +273,37 @@
|
|||
<div class="protocol-card">
|
||||
<div class="protocol-num">STEP 01</div>
|
||||
<h3>건식 초미세 집진</h3>
|
||||
<p>H14 헤파 필터 흡진기로 벽면, 천장 몰딩, 바닥의 시공 미세분진 및 부유 입자를 99.97% 1차 포집합니다.</p>
|
||||
<p>벽면, 천장 몰딩, 바닥의 시공 잔여물을 확인하고 흡진 작업 여부를 기록합니다.</p>
|
||||
</div>
|
||||
|
||||
<div class="protocol-card">
|
||||
<div class="protocol-num">STEP 02</div>
|
||||
<h3>160℃ 고온 스팀 살균</h3>
|
||||
<p>배수구, 욕실 타일 틈새, 주방 후드 기름때를 화학 세제 없이 4.0bar 고온 증기로 녹여 살균합니다.</p>
|
||||
<h3>스팀 장비 설정 확인</h3>
|
||||
<p>배수구, 욕실 타일 틈새, 주방 후드처럼 확인이 필요한 면과 장비 설정을 작업표에 기록합니다.</p>
|
||||
</div>
|
||||
|
||||
<div class="protocol-card">
|
||||
<div class="protocol-num">STEP 03</div>
|
||||
<h3>약알칼리 친환경 분해</h3>
|
||||
<p>에코서트(ECOCERT) 인증 천연 식물성 세정제를 도포하여 자재 손상 없이 찌든 때를 안전하게 중화합니다.</p>
|
||||
<h3>표면별 세정 확인</h3>
|
||||
<p>표면 재질과 사용 제품 정보를 작업표에 기록하고, 적용 전후 상태를 함께 확인합니다.</p>
|
||||
</div>
|
||||
|
||||
<div class="protocol-card">
|
||||
<div class="protocol-num">STEP 04</div>
|
||||
<h3>서랍·후드 전면 탈거 세척</h3>
|
||||
<p>보이지 않는 싱크대 걸레받이, 전등갓, 수납장 서랍 레일을 전면 탈거하여 내측 분진을 완벽 제거합니다.</p>
|
||||
<p>필요한 분리 작업의 범위와 접근 가능한 안쪽 면을 확인 항목으로 남깁니다.</p>
|
||||
</div>
|
||||
|
||||
<div class="protocol-card">
|
||||
<div class="protocol-num">STEP 05</div>
|
||||
<h3>편백 피톤치드 연무 훈증</h3>
|
||||
<p>순수 제주 편백 오일 연무로 벽지 속 새집증후군 원인 물질(포름알데히드, VOCs)을 중화하고 탈취합니다.</p>
|
||||
<h3>환기와 마감 확인</h3>
|
||||
<p>환기와 마감 상태를 확인하고, 사용한 향·마감 제품이 있다면 작업표에 표시합니다.</p>
|
||||
</div>
|
||||
|
||||
<div class="protocol-card">
|
||||
<div class="protocol-num">STEP 06</div>
|
||||
<h3>32개 항목 마스터 검수</h3>
|
||||
<p>현장 팀장과 고객이 함께 32개 체크리스트를 1:1 대조하고, 미흡 지점 발생 시 즉시 재케어 후 인도합니다.</p>
|
||||
<p>현장 담당자와 의뢰자가 검수 항목을 함께 확인하는 흐름을 예시로 표시합니다.</p>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
|
|
@ -309,27 +313,27 @@
|
|||
<section class="equipment-section" id="equipment" aria-labelledby="equipHeading">
|
||||
<div class="wrap">
|
||||
<div class="section-head">
|
||||
<h2 id="equipHeading" class="section-title">전문 위생 장비 및 검수 스펙</h2>
|
||||
<p class="section-sub">가정용 장비가 아닌 독일 카처 정품 산업용 위생 기기를 전 현장에 투입합니다.</p>
|
||||
<h2 id="equipHeading" class="section-title">작업 장비와 검수 기록</h2>
|
||||
<p class="section-sub">현장에서 확인할 장비·필터·제품·마감 항목을 작업표에 표시하는 예시입니다.</p>
|
||||
</div>
|
||||
|
||||
<div class="equip-grid">
|
||||
<div class="equip-specs">
|
||||
<div class="spec-item">
|
||||
<span class="spec-key">고온 스팀 압력</span>
|
||||
<span class="spec-val">Kärcher SG 4/4 (4.0 bar · 160℃)</span>
|
||||
<span class="spec-key">장비 기록</span>
|
||||
<span class="spec-val">사용 장비와 설정값을 작업표에 표시</span>
|
||||
</div>
|
||||
<div class="spec-item">
|
||||
<span class="spec-key">미세먼지 집진 등급</span>
|
||||
<span class="spec-val">HEPA H14 (0.3㎛ 99.995% 포집)</span>
|
||||
<span class="spec-key">필터 확인</span>
|
||||
<span class="spec-val">필터 종류와 교체 상태를 현장에서 확인</span>
|
||||
</div>
|
||||
<div class="spec-item">
|
||||
<span class="spec-key">사용 세제 인증</span>
|
||||
<span class="spec-val">ECOCERT 100% 생분해 식물성</span>
|
||||
<span class="spec-key">사용 제품</span>
|
||||
<span class="spec-val">제품명과 적용 표면을 작업표에 기록</span>
|
||||
</div>
|
||||
<div class="spec-item">
|
||||
<span class="spec-key">포름알데히드 저감</span>
|
||||
<span class="spec-val">한국화학융합시험연구원 인증 94.2%</span>
|
||||
<span class="spec-key">마감 확인</span>
|
||||
<span class="spec-val">환기·표면 상태를 검수 항목으로 확인</span>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
|
|
@ -341,8 +345,8 @@
|
|||
height="600"
|
||||
loading="lazy"
|
||||
/>
|
||||
<span class="ba-badge before">정밀 장비 규격</span>
|
||||
<span class="ba-badge after">QC 완결 보증</span>
|
||||
<span class="ba-badge before">작업 장비 예시</span>
|
||||
<span class="ba-badge after">검수 항목 확인</span>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
|
|
@ -350,16 +354,17 @@
|
|||
</div>
|
||||
|
||||
<!-- ===================================================================
|
||||
2. 관리자 관제 콘솔 모드 (Admin Dashboard Mockup)
|
||||
2. 운영 현황 보기
|
||||
=================================================================== -->
|
||||
<section class="admin-view wrap" aria-label="청온 케어 관리자 콘솔">
|
||||
<section class="admin-view wrap" aria-label="청온 케어 운영 현황">
|
||||
<div class="admin-header">
|
||||
<div>
|
||||
<div class="eyebrow" style="margin-bottom: 4px;">배차 관제 콘솔</div>
|
||||
<h2 style="font-size: var(--step-2); font-weight: 800;">실시간 배차 및 현장 관제 현황</h2>
|
||||
<div class="eyebrow" style="margin-bottom: 4px;">운영 현황</div>
|
||||
<h2 style="font-size: var(--step-2); font-weight: 800;">오늘의 케어 현황</h2>
|
||||
<p class="demo-notice" role="note">아래 접수·배차 정보는 운영 화면 예시입니다. 실제 고객 정보나 접수 내역이 아닙니다.</p>
|
||||
</div>
|
||||
<button type="button" class="btn-primary" id="btnOpenQcModal">
|
||||
32개 현장 검수표 열기
|
||||
32개 검수 항목 보기
|
||||
</button>
|
||||
</div>
|
||||
|
||||
|
|
@ -386,7 +391,7 @@
|
|||
<!-- 실시간 접수 및 배차 원장 테이블 -->
|
||||
<div class="admin-table-card">
|
||||
<div class="table-header">
|
||||
<span class="table-title">실시간 예약 및 케어 원장 (Live Ledger)</span>
|
||||
<span class="table-title">접수·배차 현황</span>
|
||||
<div class="table-filter-tabs">
|
||||
<button class="filter-tab is-active" data-filter="all">전체</button>
|
||||
<button class="filter-tab" data-filter="new">신규접수</button>
|
||||
|
|
@ -399,14 +404,14 @@
|
|||
<table class="admin-table">
|
||||
<thead>
|
||||
<tr>
|
||||
<th>접수번호</th>
|
||||
<th>고객명 / 연락처</th>
|
||||
<th>공간 / 면적</th>
|
||||
<th>현장 주소</th>
|
||||
<th>견적액</th>
|
||||
<th>배정 팀장</th>
|
||||
<th>상태</th>
|
||||
<th>조치</th>
|
||||
<th scope="col">접수번호</th>
|
||||
<th scope="col">고객명 / 연락처</th>
|
||||
<th scope="col">공간 / 면적</th>
|
||||
<th scope="col">현장 주소</th>
|
||||
<th scope="col">견적액</th>
|
||||
<th scope="col">배정 팀장</th>
|
||||
<th scope="col">상태</th>
|
||||
<th scope="col">조치</th>
|
||||
</tr>
|
||||
</thead>
|
||||
<tbody id="adminTableBody">
|
||||
|
|
@ -418,7 +423,7 @@
|
|||
<td class="mono" style="font-weight:700;">432,000원</td>
|
||||
<td>김정온 마스터</td>
|
||||
<td><span class="status-pill new">신규 접수</span></td>
|
||||
<td><button class="action-btn" onclick="alert('배차 확인 알림톡이 고객님께 전송되었습니다.');">배차 확정</button></td>
|
||||
<td><button class="action-btn" onclick="alert('배차 상태를 확인했습니다. 이 화면의 접수 정보는 예시이며 실제 알림은 전송되지 않습니다.');">배차 상태 보기</button></td>
|
||||
</tr>
|
||||
<tr>
|
||||
<td class="mono">#CO-2026-0818</td>
|
||||
|
|
@ -428,7 +433,7 @@
|
|||
<td class="mono" style="font-weight:700;">520,000원</td>
|
||||
<td>박준호 팀장 (2팀)</td>
|
||||
<td><span class="status-pill progress">스팀 케어 중</span></td>
|
||||
<td><button class="action-btn" onclick="document.getElementById('qcModal').showModal();">실시간 검수</button></td>
|
||||
<td><button class="action-btn" onclick="document.getElementById('qcModal').showModal();">검수 항목 보기</button></td>
|
||||
</tr>
|
||||
<tr>
|
||||
<td class="mono">#CO-2026-0817</td>
|
||||
|
|
@ -438,7 +443,7 @@
|
|||
<td class="mono" style="font-weight:700;">841,000원</td>
|
||||
<td>최수진 닥터 (1팀)</td>
|
||||
<td><span class="status-pill done">검수 승인 완료</span></td>
|
||||
<td><button class="action-btn" onclick="alert('완료 검수 리포트가 PDF로 발행되었습니다.');">리포트 다운</button></td>
|
||||
<td><button class="action-btn" onclick="alert('검수 리포트 내용을 확인했습니다. 실제 발행은 진행되지 않습니다.');">리포트 보기</button></td>
|
||||
</tr>
|
||||
</tbody>
|
||||
</table>
|
||||
|
|
@ -458,23 +463,22 @@
|
|||
<li class="qc-item"><input type="checkbox" checked /> <span>02. 창틀 상하좌우 틈새 시멘트 가루 및 찌든때 제거</span></li>
|
||||
<li class="qc-item"><input type="checkbox" checked /> <span>03. 싱크대 하부 걸레받이 전면 탈거 및 분진 집진</span></li>
|
||||
<li class="qc-item"><input type="checkbox" checked /> <span>04. 가스레인지/인덕션 상판 및 후드 필터 기름때 고온 스팀 분해</span></li>
|
||||
<li class="qc-item"><input type="checkbox" checked /> <span>05. 욕실 벽타일 메지 및 배수구 트랩 고온 살균 세척</span></li>
|
||||
<li class="qc-item"><input type="checkbox" checked /> <span>05. 욕실 벽타일 메지 및 배수구 트랩 스팀 작업 확인</span></li>
|
||||
<li class="qc-item"><input type="checkbox" checked /> <span>06. 수납장 모든 서랍 완전 탈거 후 레일 틈새 분진 청소</span></li>
|
||||
<li class="qc-item"><input type="checkbox" checked /> <span>07. 베란다 및 다용도실 바닥 타일 약알칼리 세정</span></li>
|
||||
<li class="qc-item"><input type="checkbox" /> <span>08. 전 실 편백 피톤치드 훈증 및 공기질 측정기 수치 확인</span></li>
|
||||
<li class="qc-item"><input type="checkbox" checked /> <span>07. 베란다 및 다용도실 바닥 타일 세정 작업 확인</span></li>
|
||||
<li class="qc-item"><input type="checkbox" /> <span>08. 전 실 환기와 마감 상태 확인</span></li>
|
||||
</ul>
|
||||
<div style="display: flex; justify-content: flex-end; gap: 8px;">
|
||||
<button type="button" class="action-btn" onclick="document.getElementById('qcModal').close();">닫기</button>
|
||||
<button type="button" class="btn-primary" style="padding: 6px 14px; font-size: 13px;" onclick="alert('검수 승인이 완료되었습니다.'); document.getElementById('qcModal').close();">최종 검수 서명 승인</button>
|
||||
<button type="button" class="btn-primary" style="padding: 6px 14px; font-size: 13px;" onclick="alert('검수 항목을 확인했습니다. 이 화면에서 실제 승인 처리는 진행되지 않습니다.'); document.getElementById('qcModal').close();">검수 항목 확인</button>
|
||||
</div>
|
||||
</dialog>
|
||||
|
||||
<!-- 푸터 (.site-foot SSOT) -->
|
||||
<footer class="site-foot">
|
||||
<div class="wrap foot-inner">
|
||||
<p>청온 케어 · 서울 마포구 마포대로 109 청온랩 4층</p>
|
||||
<p class="muted">연중무휴 08:00 – 20:00 (사전 예약제)</p>
|
||||
<p class="muted">care@cheongon.kr</p>
|
||||
<p>청온 케어 · 위생 케어 안내</p>
|
||||
<p class="muted">이 페이지의 가격·접수 정보는 예시이며 입력 정보는 저장·전송되지 않습니다.</p>
|
||||
</div>
|
||||
</footer>
|
||||
|
||||
|
|
@ -569,9 +573,9 @@
|
|||
let submissionCount = 6;
|
||||
|
||||
btnSubmit.addEventListener("click", () => {
|
||||
const name = document.getElementById("clientName").value || "고객님";
|
||||
const phone = document.getElementById("clientPhone").value || "010-0000-0000";
|
||||
const address = document.getElementById("clientAddress").value || "서울시 현장 주소";
|
||||
const name = document.getElementById("clientName").value || "이름 미입력";
|
||||
const phone = document.getElementById("clientPhone").value || "입력 없음";
|
||||
const address = document.getElementById("clientAddress").value || "입력 없음";
|
||||
const pyeong = pyeongSlider.value;
|
||||
const totalStr = sumTotal.textContent;
|
||||
|
||||
|
|
@ -593,7 +597,7 @@
|
|||
`;
|
||||
tableBody.insertBefore(newRow, tableBody.firstChild);
|
||||
|
||||
alert(`[청온 케어] ${name}님의 견적(${totalStr}) 신청이 성공적으로 접수되었습니다.\n관리자 콘솔에 실시간 등록되었습니다.`);
|
||||
alert(`${name}님의 예상 견적은 ${totalStr}입니다.\n실제 견적·신청은 진행되지 않았으며 입력 정보는 저장하거나 전송하지 않습니다.`);
|
||||
});
|
||||
|
||||
// 모달 열기
|
||||
|
|
|
|||
Loading…
Add table
Add a link
Reference in a new issue