Справочник участников: выпадающий список с поиском

Co-Authored-By: Claude Opus 5 (1M context) <noreply@anthropic.com>

internal/lkgateway/web/templates/admin_setup.html

@@ -480,12 +480,14 @@
       <form method="post" action="/admin/setup/org" style="margin-top:12px;display:grid;gap:10px;max-width:680px">
         <input type="hidden" name="section" value="sec-org">
         <label>Найти себя в справочнике участников M2M</label>
-        <input id="orgq" placeholder="ИНН, часть названия или код участника" autocomplete="off">
+        <div class="hb-wrap"><input id="orgq" placeholder="Выберите из списка или введите ИНН, название, код" autocomplete="off"><button type="button" class="hb-toggle" title="Весь список">▾</button></div>
         <div id="orgres" class="hb-res"></div>
         <style>
   .hb-box{position:relative}
-  .hb-res{margin-top:4px;max-height:300px;overflow:auto;border-radius:8px}
+  .hb-res{margin-top:4px;max-height:320px;overflow:auto;border-radius:8px;border:1px solid var(--border);background:var(--card-2);padding:4px}
   .hb-res:empty{display:none}
+  .hb-wrap{display:flex;gap:6px}.hb-wrap input{flex:1}
+  .hb-toggle{padding:0 12px;border-radius:8px;border:1px solid var(--border);background:var(--card);color:var(--text);cursor:pointer}
   .hb-hit{display:block;width:100%;text-align:left;padding:7px 10px;margin:2px 0;border-radius:8px;border:1px solid var(--border);background:var(--card);color:var(--text);cursor:pointer;font-size:13px}
   .hb-hit:hover{border-color:var(--accent)}
   .hb-m{color:var(--muted);font-size:12px}
@@ -493,18 +495,28 @@
         <script>
 // hbFind — подбор участника справочника НРД по ИНН, названию или коду (без учёта регистра и кавычек).
 function hbNorm(s){return String(s||'').toLowerCase().replace(/ё/g,'е').replace(/[«»"'“”.,()]/g,' ').replace(/\s+/g,' ').trim()}
-function hbFind(list,q){q=hbNorm(q);if(q.length<2)return[];const words=q.split(' ');
+function hbFind(list,q){q=hbNorm(q);
+  if(!q)return list.slice().sort((a,b)=>(a.kind===b.kind?0:a.kind==='depo'?-1:1)||hbNorm(a.name).localeCompare(hbNorm(b.name),'ru'));
+  const words=q.split(' ');
   return list.map(p=>{const hay=hbNorm([p.inn,p.code,p.name,p.full_name,p.display_name,p.eng_name].join(' '));
     if(!words.every(w=>hay.includes(w)))return null;
     const score=(String(p.inn).startsWith(q)||String(p.code).toLowerCase().startsWith(q)?0:hbNorm(p.name).startsWith(q)||hbNorm(p.display_name).startsWith(q)?1:2)+(p.kind==='depo'?0:0.5);
-    return {p,score}}).filter(Boolean).sort((a,b)=>a.score-b.score).slice(0,12).map(x=>x.p)}
+    return {p,score}}).filter(Boolean).sort((a,b)=>a.score-b.score||hbNorm(a.p.name).localeCompare(hbNorm(b.p.name),'ru')).map(x=>x.p)}
 function hbBind(inp,box,list,onPick){
   const esc=s=>String(s??'').replace(/[&<>"]/g,c=>({'&':'&amp;','<':'&lt;','>':'&gt;','"':'&quot;'}[c]));
-  let hits=[];
-  const draw=()=>{hits=hbFind(list,inp.value);box.innerHTML=inp.value.trim().length<2?'':(hits.length?hits.map((p,i)=>'<button type="button" class="hb-hit" data-i="'+i+'"><b>'+esc(p.name)+'</b> <span class="hb-m">ИНН '+esc(p.inn)+' · '+esc(p.code)+(p.kind==='broker'?' · брокер':'')+'</span></button>').join(''):'<div class="hb-m" style="padding:6px 2px">В справочнике не найдено — введите ИНН и наименование в поля ниже.</div>')};
-  inp.addEventListener('input',draw);
-  inp.addEventListener('keydown',e=>{if(e.key==='Enter'){e.preventDefault();if(hits[0]){onPick(hits[0]);box.innerHTML=''}}if(e.key==='Escape')box.innerHTML=''});
-  box.addEventListener('click',e=>{const b=e.target.closest('.hb-hit');if(!b)return;onPick(hits[+b.dataset.i]);box.innerHTML=''});
+  let hits=[],picked=inp.dataset.picked==='1';
+  const q=()=>picked?'':inp.value;
+  const draw=()=>{hits=hbFind(list,q());box.innerHTML=(hits.length?'<div class="hb-m" style="padding:2px 4px">'+(q().trim()?'Найдено: ':'Все участники: ')+hits.length+'</div>'+hits.map((p,i)=>'<button type="button" class="hb-hit" data-i="'+i+'"><b>'+esc(p.name)+'</b> <span class="hb-m">ИНН '+esc(p.inn)+' · '+esc(p.code)+(p.kind==='broker'?' · брокер':'')+'</span></button>').join(''):'<div class="hb-m" style="padding:6px 2px">В справочнике не найдено — введите ИНН и наименование в поля ниже.</div>');box.classList.add('open')};
+  const close=()=>{box.innerHTML='';box.classList.remove('open')};
+  inp.addEventListener('focus',()=>{if(picked)inp.select();draw()});
+  inp.addEventListener('input',()=>{picked=false;draw()});
+  inp.addEventListener('keydown',e=>{if(e.key==='Enter'){e.preventDefault();if(hits[0]){pick(hits[0])}}if(e.key==='Escape')close()});
+  const pick=p=>{onPick(p);picked=true;close()};
+  box.addEventListener('mousedown',e=>e.preventDefault());
+  box.addEventListener('click',e=>{const b=e.target.closest('.hb-hit');if(b)pick(hits[+b.dataset.i])});
+  inp.addEventListener('blur',()=>setTimeout(close,150));
+  const tg=inp.parentNode.querySelector('.hb-toggle');
+  if(tg)tg.addEventListener('click',()=>{if(box.classList.contains('open'))close();else{inp.focus();draw()}});
 }
         {
           const inp=document.getElementById('orgq'),f=inp.form;