WebSVN – SmartDukaan – Diff – //trunk/profitmandi-fofo/src/main/webapp/WEB-INF/views/ftl/beat-journey.vm

   .img-x:hover{background:rgba(255,255,255,.3)}
   .modal-back.show{display:flex}
   .modal{background:#fff;border-radius:14px;max-width:780px;width:100%;padding:20px 22px;box-shadow:0 20px 60px rgba(10,20,50,.3);position:relative}
   .modal h3{margin:0 0 2px;font-size:17px;text-align:center}
   .modal > .desc{text-align:center}
-  .modal .x{position:absolute;top:14px;right:16px;cursor:pointer;color:var(--soft);font-size:22px;line-height:1;border:0;background:none}
+  .modal .x,.rh-panel .x{position:absolute;top:14px;right:16px;cursor:pointer;color:var(--soft);font-size:22px;line-height:1;border:0;background:none}
   /* journey totals bar */
   .jstats{display:flex;gap:9px;margin:12px 0 2px;flex-wrap:wrap}
   .js{flex:1;min-width:104px;background:#f8f9fc;border:1px solid var(--line2);border-radius:10px;padding:9px 10px;text-align:center}
   .js .jv{font-size:15.5px;font-weight:760;color:var(--ink);font-variant-numeric:tabular-nums}
   .js .jl{font-size:10px;color:var(--soft);text-transform:uppercase;letter-spacing:.04em;margin-top:3px;font-weight:600}
   .tlrow.left .tlremark{justify-content:flex-start}
   .tlremark .rk{max-width:100%;background:#fbfcfe;border:1px solid var(--line2);border-left:3px solid #c7d0e8;border-radius:8px;padding:7px 10px;font-size:11.5px;color:#4a5468;line-height:1.45;word-break:break-word}
   .tlrow.right .tlremark .rk{text-align:right}
   .tlrow.left .tlremark .rk{text-align:left}
   .tlremark .rkl{font-size:9px;text-transform:uppercase;letter-spacing:.05em;color:var(--soft);font-weight:700;margin-bottom:3px}
+  .tlremark .rkhist{display:inline-block;margin-top:6px;background:none;border:0;padding:0;color:var(--brand);font-size:10.5px;font-weight:700;cursor:pointer}
+  .tlremark .rkhist:hover{text-decoration:underline}
+  /* past-discussions drawer */
+  .rh-back{position:fixed;inset:0;background:rgba(15,22,40,.42);z-index:1200;display:none}
+  .rh-back.show{display:block}
+  .rh-panel{position:absolute;top:0;right:0;height:100%;width:min(400px,92vw);background:#fff;box-shadow:-8px 0 30px rgba(20,30,60,.18);display:flex;flex-direction:column;padding:18px 18px 14px;transform:translateX(100%);transition:transform .22s ease}
+  .rh-back.show .rh-panel{transform:translateX(0)}
+  .rh-panel h3{margin:0 0 2px;font-size:15px;color:var(--ink)}
+  .rh-panel .desc{margin:0;font-size:12px;color:var(--soft)}
+  .rh-list{flex:1;overflow-y:auto;margin-top:12px;display:flex;flex-direction:column;gap:9px}
+  .rhitem{background:#fbfcfe;border:1px solid var(--line2);border-left:3px solid #c7d0e8;border-radius:9px;padding:9px 11px}
+  .rhtop{display:flex;justify-content:space-between;align-items:center;gap:8px}
+  .rhdate{font-size:11px;font-weight:700;color:var(--muted);font-variant-numeric:tabular-nums}
+  .rhb{font-size:9px;font-weight:700;text-transform:uppercase;letter-spacing:.03em;padding:1px 6px;border-radius:5px;white-space:nowrap}
+  .rhb.ok{background:#e7f7ec;color:#1a7a3c}
+  .rhb.def{background:#fff4e6;color:#e8590c}
+  .rhexec{font-size:10px;color:var(--soft);font-weight:600;margin:3px 0 4px}
+  .rhtext{font-size:12px;color:#4a5468;line-height:1.45;word-break:break-word;white-space:pre-wrap}
+  .rhloading,.rhempty{color:var(--soft);font-size:12px;text-align:center;padding:24px 8px}
+  .rh-more{margin-top:10px;background:var(--brand);color:#fff;border:0;border-radius:8px;padding:9px;font-weight:650;font-size:12.5px;cursor:pointer;display:none}
+  .rh-more:disabled{opacity:.6;cursor:default}
   .tlcard .tm{flex:none;width:62px;display:flex;flex-direction:column;align-items:center;justify-content:center;color:#fff;font-weight:750;font-size:13px;padding:6px 4px;line-height:1.05}
   .tlcard .tm small{font-weight:600;font-size:8.5px;opacity:.9;text-transform:uppercase;letter-spacing:.04em;margin-top:3px}
   .tlcard .bd{padding:8px 11px;flex:1;min-width:0}
   .tlcard .bd .ti{font-size:12.5px;font-weight:700;color:var(--ink);line-height:1.25;word-break:break-word}
   .tlcard .bd .stt{display:inline-block;font-size:9.5px;font-weight:700;text-transform:uppercase;letter-spacing:.03em;padding:1px 6px;border-radius:5px;margin-top:5px;color:#fff}
 <div class="img-back" id="bj-img-back">
   <button class="img-x" id="bj-img-x" title="Close">&times;</button>
   <img id="bj-img" alt="Attachment">
 </div>
+<!-- past-discussions drawer — slides in from the right, above the journey modal -->
+<div class="rh-back" id="bj-rh-back" onclick="if(event.target===this)closeRemarkHistory()">
+  <div class="rh-panel" id="bj-rh-panel">
+    <button class="x" onclick="closeRemarkHistory()">&times;</button>
+    <h3 id="bj-rh-title"></h3>
+    <p class="desc" id="bj-rh-sub"></p>
+    <div class="rh-list" id="bj-rh-list"></div>
+    <button class="rh-more" id="bj-rh-more" onclick="bjLoadRemarkHistory()">Load more</button>
+  </div>
+</div>
 <script>
 var CTX = '${rc.contextPath}';
 var BASE = CTX + '/beat-journey';
 var LENS = 'today';
 var TODAY = '$today';
           '<span class="stt" style="background:'+s.c+'">'+s.l+'</span>'+
           (tt==='lead' ? '<span class="stt unplanned">Unplanned</span>' : '')+
           '<div class="mt">'+meta+'</div>'+extra+'</div>'+
       '</div>';
   // remark sits on the opposite half of the timeline (empty spacer when none)
+  var rk='';
+  if(!x._punch && x.remarks){
-  var rk=(!x._punch && x.remarks) ? '<div class="rk"><div class="rkl">Remark</div>'+esc(x.remarks)+'</div>' : '';
+    rk='<div class="rk"><div class="rkl">Remark</div>'+esc(x.remarks);
+    if(x.taskId && x.taskId>0){
+      // one big-string timeline -> global fn + primitive args (partner name escaped for the attribute)
+      rk+='<button type="button" class="rkhist" onclick="bjOpenRemarkHistory('+x.taskId+',\''+js(x.taskType||'')+'\',\''+js(tlTitle(x))+'\')">&#128220; Past discussions</button>';
+    }
+    rk+='</div>';
+  }
   var remark='<div class="tlremark">'+rk+'</div>';
   var halves = side==='left' ? (card+remark) : (remark+card);
   return '<div class="tlrow '+side+'">'+
       '<div class="node" style="background:'+s.c+'">'+s.ic+'</div>'+
       halves+'</div>';
 function closeModal(){ el('bj-modal-back').classList.remove('show'); }
 // Image lightbox — opens an attachment larger, stacked above the journey modal.
 function bjOpenImage(src){ if(!src) return; el('bj-img').src=src; el('bj-img-back').classList.add('show'); }
 function bjCloseImage(){ el('bj-img-back').classList.remove('show'); el('bj-img').removeAttribute('src'); }
+/* ===================== REMARK HISTORY DRAWER ===================== */
+// All prior discussions for one partner/lead (task_id + task_type), across every
+// executive and date, newest first. Paged via /beat-journey/remark-history.
+function bjOpenRemarkHistory(taskId, taskType, name){
+  if(!taskId || taskId<=0) return;
+  window._rh = { taskId:taskId, taskType:taskType, name:name, offset:0, limit:8, items:[], loading:false, total:0 };
+  el('bj-rh-title').innerHTML='&#128220; '+esc(name);
+  el('bj-rh-sub').textContent='Past discussions across all executives';
+  el('bj-rh-list').innerHTML='<div class="rhloading"><div class="spinner"></div>Loading&hellip;</div>';
+  el('bj-rh-more').style.display='none';
+  el('bj-rh-back').classList.add('show');
+  bjLoadRemarkHistory();
+}
+function closeRemarkHistory(){ el('bj-rh-back').classList.remove('show'); window._rh=null; }
+function bjLoadRemarkHistory(){
+  var s=window._rh; if(!s || s.loading) return;          // block re-entrant fetches
+  s.loading=true;
+  var more=el('bj-rh-more'); more.disabled=true; more.textContent='Loading…';
+  var u=CTX+'/beat-journey/remark-history?taskId='+s.taskId
+        +'&taskType='+encodeURIComponent(s.taskType||'')
+        +'&offset='+s.offset+'&limit='+s.limit;
+  fetch(u,{headers:{'Accept':'application/json'}})
+    .then(function(r){ return r.json(); })
+    .then(function(d){
+      var st=window._rh; if(!st || st.taskId!==s.taskId) return;  // drawer changed mid-flight
+      st.total=d.total||0;
+      (d.items||[]).forEach(function(it){ st.items.push(it); });
+      st.offset += (d.items||[]).length;
+      st.loading=false;
+      bjRenderRemarkHistory(!!d.hasMore);
+    })
+    .catch(function(){
+      var st=window._rh; if(st) st.loading=false;
+      el('bj-rh-list').innerHTML='<div class="rhempty">Could not load past discussions.</div>';
+      el('bj-rh-more').style.display='none';
+    });
+}
+function bjRenderRemarkHistory(hasMore){
+  var s=window._rh; if(!s) return;
+  if(!s.items.length){
+    el('bj-rh-list').innerHTML='<div class="rhempty">No earlier discussions for this partner.</div>';
+    el('bj-rh-more').style.display='none';
+    return;
+  }
+  var h='';
+  s.items.forEach(function(it){
+    var mt=(it.markType||'').toUpperCase();
+    var badge = mt.indexOf('CHECKOUT')>=0 ? '<span class="rhb ok">visited</span>'
+              : (mt==='DEFERRED' ? '<span class="rhb def">deferred</span>' : '');
+    var when = esc(it.date||'')+(it.time?' &middot; '+esc(hhmm(it.time)):'');
+    h+='<div class="rhitem">'
+      +'<div class="rhtop"><span class="rhdate">'+when+'</span>'+badge+'</div>'
+      +'<div class="rhexec">'+esc(it.exec||'')+'</div>'
+      +'<div class="rhtext">'+esc(it.remark||'')+'</div></div>';
+  });
+  el('bj-rh-list').innerHTML=h;
+  var more=el('bj-rh-more');
+  more.disabled=false; more.textContent='Load more';
+  more.style.display = hasMore ? 'block' : 'none';
+}
 /* ============================ APPROVAL ============================ */
 function loadApproval(){
   spinner();
   var from=el('bj-start').value, to=el('bj-end').value;
   var u=CTX+'/beat-report/approval/data?fromDate='+encodeURIComponent(from)+'&toDate='+encodeURIComponent(to)+qs();

Subversion Repositories SmartDukaan

(root)//trunk/profitmandi-fofo/src/main/webapp/WEB-INF/views/ftl/beat-journey.vm – Rev 37034 → 37038