WebSVN – SmartDukaan – Diff – /trunk/profitmandi-fofo/src/main/webapp/WEB-INF/views/ftl/lms-dashboard-standalone.vm

   .inp{border:1px solid var(--line);border-radius:9px;padding:9px 11px;font-size:13px;font-weight:500;background:#fff;color:var(--ink);width:100%}
   .inp:focus{outline:none;border-color:var(--brand2);box-shadow:0 0 0 3px #eaefff}
   .inp[readonly],.inp.ro{background:#f5f6fa;color:var(--muted);font-weight:600}
   select.inp{appearance:none;cursor:pointer;background-image:url("data:image/svg+xml;utf8,<svg xmlns='http://www.w3.org/2000/svg' width='10' height='6'><path d='M1 1l4 4 4-4' stroke='%2369748c' fill='none' stroke-width='1.5'/></svg>");background-repeat:no-repeat;background-position:right 11px center}
   .hinttext{font-size:11px;color:var(--soft)}
+  /* Brand-wise value capture. auto-fill keeps it compact on a laptop and collapses to one column
+     on a phone, which is where Path B (field encounter) is actually used. */
+  .brandgrid{display:grid;grid-template-columns:repeat(auto-fill,minmax(148px,1fr));gap:8px;margin-top:2px}
+  .brandcell{display:flex;align-items:center;gap:6px;background:#f7f8fc;border:1px solid var(--line);
+    border-radius:8px;padding:4px 8px}
+  .brandcell .bname{font-size:11.5px;font-weight:700;color:var(--ink);white-space:nowrap;min-width:58px}
+  .brandcell .bval{border:0;background:transparent;padding:3px 0;height:auto;font-size:12.5px;text-align:right}
+  .brandcell .bval:focus{outline:0;box-shadow:none}
+  .brandcell:focus-within{border-color:var(--brand);background:#fff}
   .resolvebox{background:#f5f7ff;border:1px solid #dfe4f7;border-radius:11px;padding:13px 15px;display:flex;align-items:center;gap:13px}
   .resolvebox .ra{width:38px;height:38px;border-radius:10px;background:var(--navy);color:#fff;display:flex;align-items:center;justify-content:center;font-weight:800;font-size:14px;flex:none}
   .resolvebox .rt{font-size:11px;color:var(--muted);font-weight:700;text-transform:uppercase;letter-spacing:.04em}
   .resolvebox .rn{font-size:15px;font-weight:750;margin-top:1px}
   .resolvebox .rc{font-size:11.5px;color:var(--muted);margin-top:2px}
   <div id="create" class="hide">
     <div class="pagehead">
       <div>
         <div class="crumb">Create · New Lead</div>
         <h1 class="page">Create Lead</h1>
-        <div class="sub">Mandatory fields must be filled before submit. LMS ID is generated only on successful submit — auto-assigned from region.</div>
+        <div class="sub">Only what an agent can know on a first call. LMS ID is generated on submit and the lead is auto-assigned from region. Address, store photo and geo-pin come from the capture link, which is created automatically and copied to your clipboard.</div>
       </div>
       <div class="hd-right">
         <div class="ctl" style="padding:4px;display:flex;gap:4px">
           <button class="btn coral sm" id="pathA" style="border-radius:7px" onclick="setPath('A',this)">Path A · BGC outbound</button>
           <button class="btn ghost sm" id="pathB" style="border-radius:7px" onclick="setPath('B',this)">Path B · Field encounter</button>
         <h2>Lead details</h2>
         <p class="desc" id="createDesc">Path A — captured by BGC agent during an outbound call, after consent.</p>
         <div class="form-grid">
           <div class="fld"><label>Retailer name <span class="m">*</span></label><input class="inp" id="cRetailer" placeholder="Contact person"></div>
           <div class="fld"><label>Business name <span class="m">*</span></label><input class="inp" id="cBusiness" placeholder="Shop / trade name"></div>
-          <div class="fld full"><label>Location <span class="m">*</span> <span class="hinttext" style="float:right" id="cLocHint">geo-pin optional on Path A</span></label><input class="inp" id="cLocation" placeholder="Full address"></div>
           <div class="fld"><label>Contact number <span class="m">*</span></label><input class="inp mono" id="cContact" placeholder="10-digit mobile" inputmode="numeric"></div>
+          <div class="fld full">
-          <div class="fld"><label>Business value</label><input class="inp" id="cValue" placeholder="e.g. 85000 (₹/month)"></div>
+            <label>Monthly business value — brand wise <span class="auto" id="cValueTotal">total ₹0</span></label>
+            <div class="brandgrid" id="cBrandGrid">
+              #foreach($b in $leadBrands)
+                <div class="brandcell">
+                  <span class="bname">$b</span>
+                  <input class="inp bval mono" data-brand="$b" placeholder="0" inputmode="numeric"
+                         oninput="brandTotal()">
+                </div>
+              #end
+            </div>
+            <div class="hinttext">Type in rupees per month — 100000 or 1L, 50k both work. Leave a brand blank if it is not stocked.</div>
+          </div>
           <div class="fld"><label>Interest status</label><select class="inp" id="cInterest"><option>Interested</option><option>Callback</option><option>Not Interested</option></select></div>
-          <div class="fld"><label>Category / brands</label><input class="inp" id="cBrands" placeholder="Samsung, Vivo…"></div>
           <div class="fld full">
             <label>Region / State <span class="m">*</span> <span class="auto">drives auto-assignment</span></label>
             <select class="inp" id="cRegion" onchange="resolveBM(this.value)">
               <option value="">Select a region…</option>
               #foreach($r in $regions)
     setTimeout(function(){ t.style.opacity='0'; t.style.transition='opacity .3s'; setTimeout(function(){ t.remove(); },300); },2600); }
   // ---- filters + fetch
   function qs(){ var q=''; if(STATE.regionId)q+='&regionId='+encodeURIComponent(STATE.regionId);
     if(STATE.from)q+='&from='+encodeURIComponent(STATE.from); if(STATE.to)q+='&to='+encodeURIComponent(STATE.to); return q; }
-  function getJSON(path,cb){ fetch(CTX+path,{credentials:'same-origin',headers:{'X-Requested-With':'XMLHttpRequest'}})
+  function getJSON(path,cb,onErr){ fetch(CTX+path,{credentials:'same-origin',headers:{'X-Requested-With':'XMLHttpRequest'}})
+    .then(function(r){ if(!r.ok) throw new Error('HTTP '+r.status); return r.json(); })
-    .then(function(r){ return r.json(); }).then(function(j){ cb((j&&j.response!==undefined)?j.response:j); })
+    .then(function(j){ cb((j&&j.response!==undefined)?j.response:j); })
-    .catch(function(e){ console.error('LMS fetch failed',path,e); toast('Could not load data'); }); }
+    .catch(function(e){ console.error('LMS fetch failed',path,e);
+      if(typeof onErr==='function'){ onErr(e); } else { toast('Could not load data'); } }); }
   // ---- stage helpers
   var STCLASS={NEW:'st-new',ASSIGNED:'st-assigned',CONTACTED:'st-contacted',QUALIFIED:'st-qualified',
     BEAT_PLANNED:'st-beat',VISITED:'st-visited',ONBOARDED:'st-onboarded',ACTIVE:'st-active',NOT_INTERESTED:'st-ni',DROPPED:'st-dead'};
   function stagePill(st,lb){ if(!st) return '<span class="stage st-new">—</span>'; return '<span class="stage '+(STCLASS[st]||'st-new')+'">'+esc(lb||st)+'</span>'; }
   function drill(crumb,title,sub,bt,bk){ openDrawer(crumb,title,'Loading…','<div class="ph">Loading…</div>');
     var q='?bucketType='+encodeURIComponent(bt)+(bk?'&bucketKey='+encodeURIComponent(bk):'')+qs();
     getJSON('/lms/dashboard/leads'+q,function(d){ var leads=(d&&d.leads)?d.leads:[];
       openDrawer(crumb,title,(sub||'')+' · '+leads.length+' lead(s)',drawerLeadTable(leads)); }); }
+  // ---- app-bar search: LMS id / retailer / business / phone / city -> results in the drawer
+  var searchTimer=null, searchSeq=0;
+  function runSearch(){ var q=(byId('lmsSearch').value||'').trim();
+    if(q.length<2){ toast('Type at least 2 characters'); return; }
+    var seq=++searchSeq;
+    openDrawer('Search','\u201c'+q+'\u201d','Searching…','<div class="ph">Searching…</div>');
+    getJSON('/lms/dashboard/search?q='+encodeURIComponent(q),function(d){
+      if(seq!==searchSeq) return;                       // a newer search already won
+      var leads=(d&&d.leads)?d.leads:[];
+      openDrawer('Search','\u201c'+q+'\u201d',leads.length+' match(es)',drawerLeadTable(leads)); },
+      function(){ if(seq!==searchSeq) return;
+        openDrawer('Search','\u201c'+q+'\u201d','Search failed','<div class="ph">Could not run the search.</div>'); }); }
+  byId('lmsSearch').addEventListener('keydown',function(e){
+    if(e.key==='Enter'){ e.preventDefault(); clearTimeout(searchTimer); runSearch(); }
+    else if(e.key==='Escape'){ this.blur(); closeDrawer(); } });
+  byId('lmsSearch').addEventListener('input',function(){ clearTimeout(searchTimer);
+    var v=(this.value||'').trim(); if(v.length<2) return;
+    searchTimer=setTimeout(runSearch,400); });
   var REPORT_NOTE={ 'State Funnel':'Live from the lead record — grouped by region, BM and ASM.',
     'SLA Compliance':'Live — first_contacted_at vs first_contact_due, owner heat-map.',
     'Ageing':'Live — open leads untouched > 7 days, by stage.',
     'Management Roll-up':'Live — cross-region leads, onboardings and estimated value.',
     'BGC Daily':'Partial — created + dispositions are real; call volume is a PROXY (contacted ÷ days). No telephony bridge yet.',
       '<div class="tt">'+(t.type?esc(t.type):'Update')+'</div>'+
       '<div class="tm">'+esc(t.actor||'System')+' · '+fmtDT(t.when)+(t.scheduled?(' · scheduled '+fmtDT(t.scheduled)):'')+'</div>'+
       (t.body?('<div class="td">'+esc(t.body)+'</div>'):'')+'</div>'; }); trail+='</div>'; }
     trail+='</div>';
-    var openBtn='<div style="text-align:right;margin-bottom:12px"><button class="btn coral sm" onclick="window.open(CTX+\'/leadRecord?leadId='+d.id+'\',\'_blank\')">Open in app to act &rarr;</button></div>';
+    var openBtn='<div style="text-align:right;margin-bottom:12px"><button class="btn coral sm" onclick="window.open(CTX+\'/dashboard?leadRecord='+d.id+'\',\'_blank\')">Open in app to act &rarr;</button></div>';
     byId('recordHost').innerHTML=head+step+openBtn+'<div class="grid g3"><div>'+details+trail+'</div><div>'+sla+'</div></div>';
+  }
   // ====================== CREATE LEAD (real /lms/resolve-region + /createLead) ======================
   var CREATE_PATH='A';
   function setPath(p,btn){ CREATE_PATH=p;
     byId('pathA').className='btn '+(p==='A'?'coral':'ghost')+' sm'; byId('pathB').className='btn '+(p==='B'?'coral':'ghost')+' sm';
-    byId('createDesc').textContent=(p==='A')?'Path A — captured by BGC agent during an outbound call, after consent.':'Path B — field encounter; geo-pin/location is mandatory, owner = creator.';
+    byId('createDesc').textContent=(p==='A')?'Path A — captured by a BGC agent during an outbound call, after consent. Owner is the region BM.':'Path B — field encounter. Owner is you, the creator.';
-    byId('cLocHint').textContent=(p==='A')?'geo-pin optional on Path A':'location mandatory on Path B'; }
+  }
   function initials(n){ n=(n||'').trim(); if(!n) return '—'; var p=n.split(/\s+/); return ((p[0]||'')[0]||'').toUpperCase()+((p[1]||'')[0]||'').toUpperCase(); }
   function resolveBM(regionId){ if(!regionId){ byId('rName').textContent='Pick a region…'; byId('rRegion').textContent='—'; byId('raAv').textContent='—';
       byId('rEsc').textContent='The owning BM/RSM is resolved from the region (cs.position).'; return; }
     getJSON('/lms/resolve-region?regionId='+encodeURIComponent(regionId),function(d){ d=d||{};
       byId('rRegion').textContent=d.regionCode||''; var nm=d.bmName||'';
       if(d.assignmentStatus==='HOLD' || !nm){ byId('rName').textContent='No active BM/RSM'; byId('raAv').textContent='!';
         byId('raAv').style.background='#e03131'; byId('rEsc').innerHTML='Region has no active owner &rarr; <b style="color:#e03131">HOLD queue</b>, Sales Head notified.'; }
       else { byId('rName').textContent=nm; byId('raAv').textContent=initials(nm); byId('raAv').style.background='#1f2a5e';
         byId('rEsc').textContent='Auto-resolved from region · escalation contact copied on the assignment email.'; } }); }
+  // ---- brand-wise business value ------------------------------------------------------------
+  // Agents write "1L", "50k", "1.5 lakh" as readily as digits, and rejecting those would just push
+  // them back to typing a single lump sum. Parsed here so the stored value is always plain rupees.
+  function parseMoney(raw){
+    if(raw===null||raw===undefined) return 0;
+    var t=(''+raw).trim().toLowerCase().replace(/[₹,\s]/g,'');
+    if(!t) return 0;
+    var m=t.match(/^([0-9]*\.?[0-9]+)(k|l|lac|lacs|lakh|lakhs|cr|crore|crores)?$/);
+    if(!m) return 0;
+    var n=parseFloat(m[1]); if(isNaN(n)) return 0;
+    switch(m[2]){
+      case 'k': return Math.round(n*1000);
+      case 'l': case 'lac': case 'lacs': case 'lakh': case 'lakhs': return Math.round(n*100000);
+      case 'cr': case 'crore': case 'crores': return Math.round(n*10000000);
+      default: return Math.round(n);
+    }
+  }
+  function collectBrands(){
+    var out=[];
+    document.querySelectorAll('#cBrandGrid .bval').forEach(function(el){
+      var v=parseMoney(el.value);
+      if(v>0) out.push({brand:el.getAttribute('data-brand'), value:v});
+    });
+    return out;
+  }
+  function brandTotal(){
+    var t=0; collectBrands().forEach(function(b){ t+=b.value; });
+    var el=byId('cValueTotal');
+    if(el) el.textContent='total '+(t>0?fmtMoney(t):'₹0');
+    return t;
+  }
+  function fmtMoney(n){
+    if(n>=10000000) return '₹'+(n/10000000).toFixed(n%10000000?2:0)+'Cr';
+    if(n>=100000)   return '₹'+(n/100000).toFixed(n%100000?2:0)+'L';
+    if(n>=1000)     return '₹'+(n/1000).toFixed(n%1000?1:0)+'K';
+    return '₹'+n;
+  }
   function val(id){ var e=byId(id); return e?e.value:''; }
-  function submitLead(){ var fn=val('cRetailer').trim(), biz=val('cBusiness').trim(), loc=val('cLocation').trim();
+  function submitLead(){ var fn=val('cRetailer').trim(), biz=val('cBusiness').trim();
-    var phone=(val('cContact')||'').replace(/\D/g,'').slice(-10); var value=parseFloat((val('cValue')||'').replace(/[^0-9.]/g,''));
+    var phone=(val('cContact')||'').replace(/\D/g,'').slice(-10);
+    var brands=collectBrands(); var value=brandTotal();
     var region=val('cRegion'); var path=CREATE_PATH;
+    if(!fn){ toast('Retailer name is required'); return; }
-    if(!fn){ toast('Retailer name is required'); return; } if(phone.length!==10){ toast('A valid 10-digit contact is required'); return; }
+    if(phone.length!==10){ toast('A valid 10-digit contact is required'); return; }
-    if(!region){ toast('Pick a region'); return; } if(path==='B' && !loc){ toast('Path B needs a location'); return; }
+    if(!region){ toast('Pick a region'); return; }
+    // No address check on either path any more: the capture link is what establishes location,
+    // and it is generated for every lead regardless of path.
-    var payload={ firstName:fn, lastName:'', mobile:phone, address:loc||'', city:'', state:'', source:'LMS Dashboard',
+    var payload={ firstName:fn, mobile:phone, outletName:biz||'', source:'LMS Dashboard',
-      remark:'Created from LMS dashboard', outletName:biz||'', regionId:parseInt(region,10), creationPath:path };
+      regionId:parseInt(region,10), creationPath:path };
+    // potential is the sum, so the funnel's value column keeps working, while the per-brand split
+    // is what actually tells a BM what the counter is worth.
     if(value && value>0) payload.potential=value;
+    if(brands.length) payload.leadBrands=brands;
+    // /lms/createLead, NOT the shared /createLead: this one honours regionId and creationPath, so
+    // the lead actually gets a stage, an LMS code, an owner and an SLA clock.
+    fetch(CTX+'/lms/createLead',{method:'POST',credentials:'same-origin',
-    fetch(CTX+'/createLead',{method:'POST',credentials:'same-origin',headers:{'Content-Type':'application/json','X-Requested-With':'XMLHttpRequest'},body:JSON.stringify(payload)})
+        headers:{'Content-Type':'application/json','X-Requested-With':'XMLHttpRequest'},
+        body:JSON.stringify(payload)})
-      .then(function(r){ return r.text(); }).then(function(t){ t=(''+t).trim(); var id=parseInt(t,10);
+      .then(function(r){ return r.text(); })
+      .then(function(t){
+        var d=null; try{ d=JSON.parse(t); }catch(e){ d=null; }
+        var res=(d&&d.response)?d.response:d;
+        if(!res || res.ok!==true){
+          // A refusal carries the reason as a bare string under `response` (badRequest("...")),
+          // whereas success is an object. Surface the reason, not a generic failure.
+          toast((typeof res==='string' && res) || (res&&res.message) || 'Create failed');
+          return;
+        }
+        var held=(res.assignmentStatus==='HOLD');
+        toast(held ? ('Lead '+res.lmsCode+' created · no BM for that region, parked in HOLD')
-        if(!isNaN(id) && String(id)===t){ toast('Lead created · auto-assigned · SLA started',1);
+                   : ('Lead '+res.lmsCode+' created · assigned to '+(res.ownerName||'the region BM')+' · SLA started'), 1);
-          ['cRetailer','cBusiness','cLocation','cContact','cValue','cBrands'].forEach(function(x){ byId(x).value=''; });
+        ['cRetailer','cBusiness','cContact'].forEach(function(x){ var e=byId(x); if(e) e.value=''; });
+        document.querySelectorAll('#cBrandGrid .bval').forEach(function(el){ el.value=''; });
+        brandTotal();
+        // Hand the capture link over immediately — the whole point of generating it on create is
+        // that the agent is still on the call with the retailer.
+        if(res.geoLink){
+          if(navigator.clipboard && navigator.clipboard.writeText){
+            navigator.clipboard.writeText(res.geoLink).then(function(){
+              alert('Capture link copied to your clipboard — send it to the retailer now:\n\n'+res.geoLink);
+            }, function(){ prompt('Send this capture link to the retailer:', res.geoLink); });
+          } else {
+            prompt('Send this capture link to the retailer:', res.geoLink);
+          }
+        }
-          byId('recLookup').value=id; injectRecord(id); go('record',document.querySelectorAll('.tab')[1]); refresh(); }
+        byId('recLookup').value=res.leadId; injectRecord(res.leadId);
-        else { toast(t||'Lead created'); } })
+        go('record',document.querySelectorAll('.tab')[1]); refresh(); })
       .catch(function(e){ toast('Create failed'); }); }
   // ====================== AUTO-ASSIGNMENT (real resolve per region) ======================
-  function buildAssign(){ var opts=byId('cRegion').querySelectorAll('option'); var rows=[]; var holdCount=0, assignedCount=0, pending=0;
+  function buildAssign(){ var opts=byId('cRegion').querySelectorAll('option'); var holdCount=0, assignedCount=0, pending=0;
-    byId('assignMap').innerHTML='';
+    var body=byId('assignMap'); body.innerHTML='';
+    // Rows are created up-front in region order, then filled in as each resolve lands — otherwise
+    // the table would be ordered by whichever request happened to answer first.
     opts.forEach(function(o){ if(!o.value) return; pending++;
-      var id=o.value, label=o.textContent;
+      var label=o.textContent;
+      var tr=document.createElement('tr');
+      tr.innerHTML='<td><b>'+esc(label)+'</b></td><td colspan="2"><span class="ph">Resolving…</span></td>';
+      body.appendChild(tr);
+      function done(){ if(--pending===0){ renderAssignKpis(assignedCount,holdCount); } }
-      getJSON('/lms/resolve-region?regionId='+encodeURIComponent(id),function(d){ d=d||{}; pending--;
+      getJSON('/lms/resolve-region?regionId='+encodeURIComponent(o.value),function(d){ d=d||{};
         var hold=(d.assignmentStatus==='HOLD' || !d.bmName);
         if(hold) holdCount++; else assignedCount++;
-        var tr=document.createElement('tr');
         tr.innerHTML='<td><b>'+esc(label)+'</b></td>'+
           '<td>'+(hold?'<span class="warnflag">— vacant —</span>':esc(d.bmName))+'</td>'+
           '<td>'+(hold?'<span class="stage st-ni">HOLD</span>':'<span class="stage st-active">Active</span>')+'</td>';
-        byId('assignMap').appendChild(tr);
+        done();
-        if(pending===0){ renderAssignKpis(assignedCount,holdCount); } }); });
+      },function(){ tr.innerHTML='<td><b>'+esc(label)+'</b></td><td colspan="2"><span class="warnflag">could not resolve</span></td>';
+        done(); }); });
     // HOLD queue leads
     getJSON('/lms/dashboard/leads?bucketType=ATTENTION&bucketKey=HOLD',function(d){ var leads=(d&&d.leads)?d.leads:[];
       if(!leads.length){ byId('holdQueue').innerHTML='<div class="ph">No leads in HOLD. 🎉</div>'; return; }
       var h=''; leads.slice(0,8).forEach(function(l){ h+='<div style="display:flex;align-items:center;gap:10px;font-size:12.5px;padding:5px 0" class="clickrow" data-leadid="'+l.id+'">'+
         '<span class="idpill">'+esc(l.lmsCode)+'</span> <span>'+esc(l.name||l.outlet||'—')+'</span></div>'; });

Subversion Repositories SmartDukaan

(root)/trunk/profitmandi-fofo/src/main/webapp/WEB-INF/views/ftl/lms-dashboard-standalone.vm – Rev 37125 → 37651