From 0c71ce66995ffff995ff1ddfdef486c417d1eb6f Mon Sep 17 00:00:00 2001
From: wasrusgen <vasrusgen@gmail.com>
Date: Sat, 30 May 2026 15:37:53 +0300
Subject: [PATCH] =?UTF-8?q?feat:=20e-signing=20UI=20in=20cabinet=20?=
 =?UTF-8?q?=E2=80=94=20doc=20review,=20consent=20checkbox,=20code,=20sign?=
 =?UTF-8?q?=20before=20payment?=
MIME-Version: 1.0
Content-Type: text/plain; charset=UTF-8
Content-Transfer-Encoding: 8bit

---
 docs/cabinet.html | 71 ++++++++++++++++++++++++++++++++++++++++++++++-
 1 file changed, 70 insertions(+), 1 deletion(-)

diff --git a/docs/cabinet.html b/docs/cabinet.html
index f49195d..ecf3f0b 100644
--- a/docs/cabinet.html
+++ b/docs/cabinet.html
@@ -173,6 +173,38 @@ body{font-family:'Inter',sans-serif;background:var(--bg);color:var(--text);displ
   <div class="hdr-r"><div class="elena-chip"><div class="elena-av">Е</div><div class="elena-nm">Елена</div><div class="elena-dot"></div></div></div>
 </header>
 <div class="pay-banner" id="payBanner"><span>💳 К оплате: <b id="payAmount"></b></span><button class="pay-btn" onclick="showPayModal()">Оплатить →</button></div>
+<div class="modal-bg" id="signModal">
+  <div class="modal" style="max-width:520px">
+    <div class="modal-h">Подписание договора</div>
+    <div class="modal-sub">Для продолжения подпишите документы простой электронной подписью</div>
+    <div style="background:var(--subtle);border:1.5px solid var(--border);border-radius:11px;padding:14px;margin-bottom:16px;font-size:13px;line-height:1.6">
+      Ознакомьтесь с документами:<br>
+      📄 <a href="#" onclick="viewDoc('offer');return false" style="color:var(--primary);font-weight:600">Договор-оферта на консультационные услуги</a><br>
+      📄 <a href="#" onclick="viewDoc('pep');return false" style="color:var(--primary);font-weight:600">Соглашение об использовании ПЭП</a>
+    </div>
+    <label style="display:flex;align-items:flex-start;gap:10px;margin-bottom:16px;cursor:pointer">
+      <input type="checkbox" id="signAgree" style="width:18px;height:18px;margin-top:2px;flex-shrink:0">
+      <span style="font-size:13px;line-height:1.5">Я ознакомлен и принимаю условия Договора-оферты и Соглашения об использовании простой электронной подписи</span>
+    </label>
+    <div id="signStep1">
+      <input id="signId" placeholder="Телефон или email" style="width:100%;border:1.5px solid var(--border);border-radius:10px;padding:11px 14px;font-size:14px;font-family:Inter;outline:none;margin-bottom:12px">
+      <button class="btn btn-p" style="width:100%;justify-content:center" onclick="signRequest()">Получить код подтверждения</button>
+    </div>
+    <div id="signStep2" style="display:none">
+      <div id="signCodeHint" style="font-size:12px;color:var(--primary);background:var(--light);border-radius:8px;padding:8px 12px;margin-bottom:12px"></div>
+      <input id="signCode" placeholder="Код из SMS/email" maxlength="4" style="width:100%;border:1.5px solid var(--border);border-radius:10px;padding:11px 14px;font-size:18px;font-family:Inter;outline:none;margin-bottom:12px;text-align:center;letter-spacing:8px">
+      <button class="btn btn-p" style="width:100%;justify-content:center" onclick="signConfirm()">✓ Подписать договор</button>
+    </div>
+    <button class="modal-close" onclick="document.getElementById('signModal').classList.remove('show')">Отмена</button>
+  </div>
+</div>
+<div class="modal-bg" id="docModal">
+  <div class="modal" style="max-width:720px;max-height:80vh;display:flex;flex-direction:column">
+    <div class="modal-h" id="docTitle" style="flex-shrink:0">Документ</div>
+    <div id="docText" style="flex:1;overflow-y:auto;font-size:12.5px;line-height:1.6;white-space:pre-wrap;color:#374151;margin:12px 0;padding-right:8px"></div>
+    <button class="btn btn-p" style="flex-shrink:0;justify-content:center" onclick="document.getElementById('docModal').classList.remove('show')">Закрыть</button>
+  </div>
+</div>
 <div class="modal-bg" id="payModal">
   <div class="modal">
     <div class="modal-h">Оплата консалтинга</div>
@@ -369,10 +401,47 @@ function checkPayment(){
     document.getElementById("payAmount").textContent=money(left);
     document.getElementById("modalAmount").textContent=money(left);
     document.getElementById("payBanner").classList.add("show");
+    const btn=document.querySelector("#payBanner .pay-btn");
+    if(btn)btn.textContent=state.signed?"Оплатить →":"Подписать и оплатить →";
     window.__payLeft=left;
   }else document.getElementById("payBanner").classList.remove("show");
 }
-function showPayModal(){document.getElementById("payModal").classList.add("show")}
+function showPayModal(){
+  // Оплата только после подписания договора
+  if(!state.signed){document.getElementById("signModal").classList.add("show");return}
+  document.getElementById("payModal").classList.add("show");
+}
+async function viewDoc(doc){
+  const dm=document.getElementById("docModal");
+  document.getElementById("docTitle").textContent="Загрузка...";document.getElementById("docText").textContent="";dm.classList.add("show");
+  try{const r=await fetch(`${API}/api/legal/${doc}`);const d=await r.json();
+    document.getElementById("docTitle").textContent=doc==="offer"?"Договор-оферта":"Соглашение об использовании ПЭП";
+    document.getElementById("docText").textContent=d.text||d.error||"Документ недоступен";
+  }catch(e){document.getElementById("docText").textContent="Ошибка: "+e.message}
+}
+async function signRequest(){
+  if(!document.getElementById("signAgree").checked){alert("Поставьте отметку о согласии с условиями");return}
+  const id=document.getElementById("signId").value.trim();
+  if(!id){alert("Укажите телефон или email");return}
+  try{const r=await fetch(`${API}/api/sign/request`,{method:"POST",headers:{"Content-Type":"application/json"},body:JSON.stringify({token,identifier:id})});const d=await r.json();
+    if(d.error){alert("Ошибка: "+d.error);return}
+    document.getElementById("signStep1").style.display="none";
+    document.getElementById("signStep2").style.display="block";
+    document.getElementById("signCodeHint").textContent=d.demo_code?("ДЕМО-код: "+d.demo_code+" (в проде придёт по SMS/email)"):"Код отправлен на "+id;
+  }catch(e){alert("Ошибка: "+e.message)}
+}
+async function signConfirm(){
+  const code=document.getElementById("signCode").value.trim();
+  if(code.length<4){alert("Введите код");return}
+  try{const r=await fetch(`${API}/api/sign/confirm`,{method:"POST",headers:{"Content-Type":"application/json"},body:JSON.stringify({token,code,docs:["offer","pep"]})});const d=await r.json();
+    if(d.error){alert("Ошибка: "+d.error);return}
+    state.signed=true;
+    document.getElementById("signModal").classList.remove("show");
+    document.getElementById("signStep1").style.display="block";document.getElementById("signStep2").style.display="none";
+    alert("✓ Договор подписан\nПодписант: "+d.identifier);
+    document.getElementById("payModal").classList.add("show"); // сразу к оплате
+  }catch(e){alert("Ошибка: "+e.message)}
+}
 async function payVia(method){
   const amount=window.__payLeft||0;
   document.getElementById("payModal").classList.remove("show");