1 line
No EOL
12 KiB
JavaScript
1 line
No EOL
12 KiB
JavaScript
import{f as e,h as t,i as n,l as r,r as i,s as a,t as o}from"./useToast-CS8pZhce.js";import{O as s,p as c,t as l,v as u,y as d}from"./index-CyHCRa3Z.js";import{a as f,c as p,i as m,l as h,n as g,o as _,r as v,s as y,t as b,u as x}from"./mockData-DAqQG5te.js";var S={name:`check-check`,size:24,node:[[`path`,{d:`M18 6 7 17l-5-5`,key:`116fxf`}],[`path`,{d:`m22 10-7.5 7.5L13 16`,key:`ke71qq`}]]};S.node;var C=r(S),w=t(e(),1),T=(e=250)=>new Promise(t=>setTimeout(t,e)),E=new class{clients=[...g];deals=[...m];catalog=[...b];inventory=[...y];recipes=[...p];employees=[...f];tickets=[...x];conversations=[...v];finance=[..._];tasks=[...h];async getCustomers(){return await T(200),[...this.clients]}async createCustomer(e){await T(300);let t={...e,id:`cl-${Date.now()}`};return this.clients=[t,...this.clients],t}async getDeals(){return await T(200),[...this.deals]}async updateDealStage(e,t){await T(150),this.deals=this.deals.map(n=>n.id===e?{...n,stage:t}:n)}async getCatalog(){return await T(200),[...this.catalog]}async toggleStopList(e){await T(150);let t=!1;return this.catalog=this.catalog.map(n=>n.id===e?(t=!n.isStopListed,{...n,isStopListed:t}):n),t}async getInventory(){return await T(200),[...this.inventory]}async getRecipes(){return await T(200),[...this.recipes]}async getEmployees(){return await T(200),[...this.employees]}async getTickets(){return await T(200),[...this.tickets]}async getMessages(){return await T(200),[...this.conversations]}async sendMessage(e,t){await T(150),this.conversations=this.conversations.map(n=>n.id===e?{...n,lastMessage:t,time:new Date().toLocaleTimeString(`ru-RU`,{hour:`2-digit`,minute:`2-digit`}),messages:[...n.messages,{id:`msg-${Date.now()}`,sender:`agent`,senderName:`Вы (Оператор)`,text:t,time:new Date().toLocaleTimeString(`ru-RU`,{hour:`2-digit`,minute:`2-digit`})}]}:n)}async getFinance(){return await T(200),[...this.finance]}async addFinanceEntry(e){await T(250);let t={...e,id:`fin-${Date.now()}`};return this.finance=[t,...this.finance],t}async getTasks(){return await T(200),[...this.tasks]}async updateTaskStatus(e,t){await T(150),this.tasks=this.tasks.map(n=>n.id===e?{...n,status:t}:n)}},D=a(),O=()=>{let{showToast:e}=o(),[t,r]=(0,w.useState)(v),[a,f]=(0,w.useState)(v[0].id),[p,m]=(0,w.useState)(``),[h,g]=(0,w.useState)(`all`),[_,y]=(0,w.useState)(!1),[b,x]=(0,w.useState)(!0),S=t.find(e=>e.id===a)||t[0],T=async n=>{if(n.preventDefault(),!p.trim())return;let i=p;m(``),await E.sendMessage(a,i);let o=await E.getMessages();r(o),y(!0),setTimeout(async()=>{y(!1);let n=[`Спасибо за быстрый ответ! Будем ждать вас.`,`Отлично, подтверждаю заказ. Оплату проведу при получении.`,`Спасибо большое! Подскажите ещё, есть ли у вас десерты без сахара?`,`Супер, всё понятно, спасибо вашей поддержке!`],i=n[Math.floor(Math.random()*n.length)],o=t.find(e=>e.id===a);if(o){let t={id:`m-reply-${Date.now()}`,sender:`client`,senderName:o.clientName,text:i,time:new Date().toLocaleTimeString(`ru-RU`,{hour:`2-digit`,minute:`2-digit`})};r(e=>e.map(e=>e.id===a?{...e,lastMessage:i,time:`Только что`,messages:[...e.messages,t]}:e)),e({title:`Новый ответ от ${o.clientName}`,message:i,type:`info`})}},750)},O=e=>{switch(e){case`telegram`:return(0,D.jsx)(i,{variant:`gold`,size:`sm`,children:`Telegram Bot`});case`whatsapp`:return(0,D.jsx)(i,{variant:`green`,size:`sm`,children:`WhatsApp`});case`max`:return(0,D.jsx)(i,{variant:`info`,size:`sm`,children:`MAX`});case`internal`:return(0,D.jsx)(i,{variant:`warning`,size:`sm`,children:`Командный чат`});default:return(0,D.jsx)(i,{variant:`neutral`,size:`sm`,children:`Чат`})}},k=t.filter(e=>h===`all`||e.channel===h);return(0,D.jsxs)(`div`,{className:`space-y-4 animate-fade-in`,children:[(0,D.jsxs)(`div`,{className:`flex flex-col sm:flex-row sm:items-center justify-between gap-3 bg-krona-surface p-3.5 rounded-xl border border-krona-border shadow-krona-soft`,children:[(0,D.jsxs)(`div`,{children:[(0,D.jsxs)(`div`,{className:`flex items-center gap-2`,children:[(0,D.jsx)(`h2`,{className:`text-sm font-bold text-krona-primary`,children:`Единый центр коммуникаций & Омниканальный Inbox`}),(0,D.jsx)(l,{level:`target`,size:`sm`})]}),(0,D.jsx)(`p`,{className:`text-xs text-krona-secondary mt-0.5`,children:`Telegram, WhatsApp, MAX Messenger, Web-чат и внутренние командные каналы в одном окне`})]}),(0,D.jsxs)(`div`,{className:`flex items-center gap-2 text-xs`,children:[(0,D.jsxs)(n,{variant:`secondary`,size:`sm`,onClick:()=>x(!b),children:[(0,D.jsx)(s,{className:`w-3.5 h-3.5 mr-1`}),b?`Скрыть CRM-карточку`:`Показать CRM-карточку`]}),(0,D.jsx)(i,{variant:`green`,size:`md`,children:`Онлайн: 4 канала активны`})]})]}),(0,D.jsxs)(`div`,{className:`h-[calc(100vh-13rem)] flex flex-col md:flex-row gap-3 bg-krona-surface border border-krona-border rounded-xl shadow-krona-soft overflow-hidden`,children:[(0,D.jsxs)(`div`,{className:`w-full md:w-80 lg:w-96 border-r border-krona-border flex flex-col bg-krona-workspace/50`,children:[(0,D.jsxs)(`div`,{className:`p-3 border-b border-krona-border space-y-2`,children:[(0,D.jsx)(`div`,{className:`flex items-center justify-between`,children:(0,D.jsxs)(`span`,{className:`text-xs font-bold text-krona-primary uppercase tracking-wider`,children:[`Диалоги (`,k.length,`)`]})}),(0,D.jsx)(`div`,{className:`flex items-center gap-1 overflow-x-auto text-[11px] pb-1`,children:[{id:`all`,label:`Все`},{id:`telegram`,label:`Telegram`},{id:`whatsapp`,label:`WhatsApp`},{id:`max`,label:`MAX`},{id:`internal`,label:`Команда`}].map(e=>(0,D.jsx)(`button`,{onClick:()=>g(e.id),className:`px-2 py-0.5 rounded transition-colors whitespace-nowrap ${h===e.id?`bg-[#2F684C] text-white font-medium shadow-sm`:`bg-krona-surface text-krona-secondary hover:text-krona-primary border border-krona-border/60`}`,children:e.label},e.id))}),(0,D.jsxs)(`div`,{className:`relative`,children:[(0,D.jsx)(d,{className:`w-3.5 h-3.5 absolute left-2.5 top-2.5 text-krona-secondary`}),(0,D.jsx)(`input`,{type:`text`,placeholder:`Поиск диалогов...`,className:`w-full pl-8 pr-3 py-1.5 text-xs bg-krona-surface border border-krona-border rounded-lg text-krona-primary placeholder:text-krona-secondary focus:outline-none`})]})]}),(0,D.jsx)(`div`,{className:`flex-1 overflow-y-auto divide-y divide-krona-border/40`,children:k.map(e=>(0,D.jsxs)(`div`,{onClick:()=>f(e.id),className:`p-3 cursor-pointer transition-colors ${e.id===a?`bg-krona-surface font-medium border-l-2 border-krona-gold`:`hover:bg-krona-surface/60 text-krona-secondary`}`,children:[(0,D.jsxs)(`div`,{className:`flex items-center justify-between mb-1`,children:[(0,D.jsx)(`span`,{className:`font-semibold text-xs text-krona-primary truncate`,children:e.clientName}),(0,D.jsx)(`span`,{className:`text-[10px] text-krona-secondary`,children:e.time})]}),(0,D.jsx)(`p`,{className:`text-xs text-krona-secondary truncate mb-1.5`,children:e.lastMessage}),(0,D.jsxs)(`div`,{className:`flex items-center justify-between`,children:[O(e.channel),e.unreadCount>0&&(0,D.jsx)(`span`,{className:`w-4 h-4 rounded-full bg-krona-gold text-white text-[10px] font-bold flex items-center justify-center`,children:e.unreadCount})]})]},e.id))})]}),(0,D.jsxs)(`div`,{className:`flex-1 flex flex-col min-w-0 bg-krona-surface`,children:[(0,D.jsxs)(`div`,{className:`p-3.5 border-b border-krona-border flex items-center justify-between bg-krona-surface/80`,children:[(0,D.jsxs)(`div`,{className:`flex items-center gap-2.5`,children:[(0,D.jsx)(`div`,{className:`w-8 h-8 rounded-full bg-krona-workspace border border-krona-border flex items-center justify-center font-bold text-xs text-krona-primary`,children:S.avatar}),(0,D.jsxs)(`div`,{children:[(0,D.jsx)(`h4`,{className:`text-xs font-bold text-krona-primary`,children:S.clientName}),(0,D.jsxs)(`span`,{className:`text-[10px] text-krona-secondary`,children:[`Канал связи: `,S.channel]})]})]}),O(S.channel)]}),(0,D.jsxs)(`div`,{className:`flex-1 overflow-y-auto p-4 space-y-3`,children:[S.messages.map(e=>(0,D.jsxs)(`div`,{className:`flex flex-col ${e.sender===`agent`?`items-end`:`items-start`}`,children:[(0,D.jsx)(`span`,{className:`text-[10px] text-krona-secondary mb-0.5 px-1`,children:e.senderName}),(0,D.jsxs)(`div`,{className:`p-3 rounded-xl max-w-[75%] text-xs leading-relaxed shadow-krona-soft ${e.sender===`agent`?`bg-[#2F684C] text-[#F8F6F0] rounded-br-none`:`bg-krona-workspace border border-krona-border text-krona-primary rounded-bl-none`}`,children:[(0,D.jsx)(`p`,{children:e.text}),(0,D.jsxs)(`div`,{className:`flex items-center justify-end gap-1 mt-1 text-[9px] opacity-70`,children:[(0,D.jsx)(`span`,{children:e.time}),e.sender===`agent`&&(0,D.jsx)(C,{className:`w-3 h-3`})]})]})]},e.id)),_&&(0,D.jsxs)(`div`,{className:`flex items-center gap-2 text-xs text-krona-secondary bg-krona-workspace p-2 rounded-lg w-48 animate-pulse`,children:[(0,D.jsx)(`span`,{className:`w-2 h-2 rounded-full bg-krona-gold animate-ping`}),(0,D.jsx)(`span`,{children:`Собеседник печатает...`})]})]}),(0,D.jsx)(`div`,{className:`p-3 border-t border-krona-border bg-krona-workspace/50`,children:(0,D.jsxs)(`form`,{onSubmit:T,className:`flex items-center gap-2`,children:[(0,D.jsx)(`input`,{type:`text`,value:p,onChange:e=>m(e.target.value),placeholder:`Напишите ответ клиенту или коллегам (симуляция авто-ответа)...`,className:`flex-1 bg-krona-surface border border-krona-border rounded-lg px-3 py-2 text-xs text-krona-primary placeholder:text-krona-secondary focus:outline-none focus:border-krona-green`}),(0,D.jsxs)(n,{type:`submit`,variant:`primary`,size:`sm`,className:`px-3`,children:[(0,D.jsx)(u,{className:`w-3.5 h-3.5 mr-1`}),`Отправить`]})]})})]}),b&&(0,D.jsxs)(`div`,{className:`hidden lg:flex w-72 border-l border-krona-border flex-col bg-krona-surface p-3.5 space-y-4 text-xs`,children:[(0,D.jsxs)(`div`,{className:`flex items-center justify-between pb-2 border-b border-krona-border`,children:[(0,D.jsx)(`span`,{className:`font-bold text-krona-primary uppercase text-[11px]`,children:`CRM Контекст`}),(0,D.jsx)(i,{variant:`gold`,size:`sm`,children:`VIP Клиент`})]}),(0,D.jsxs)(`div`,{className:`space-y-2`,children:[(0,D.jsxs)(`div`,{children:[(0,D.jsx)(`span`,{className:`text-[10px] text-krona-secondary`,children:`ФИО клиента:`}),(0,D.jsx)(`div`,{className:`font-bold text-krona-primary`,children:S.clientName})]}),(0,D.jsxs)(`div`,{children:[(0,D.jsx)(`span`,{className:`text-[10px] text-krona-secondary`,children:`Телефон:`}),(0,D.jsx)(`div`,{className:`font-mono text-krona-primary`,children:`+7 (913) 482-19-02`})]}),(0,D.jsxs)(`div`,{children:[(0,D.jsx)(`span`,{className:`text-[10px] text-krona-secondary`,children:`LTV (Общий объем заказов):`}),(0,D.jsx)(`div`,{className:`font-bold text-krona-green font-mono`,children:`48 200 ₽ (14 чеков)`})]}),(0,D.jsxs)(`div`,{children:[(0,D.jsx)(`span`,{className:`text-[10px] text-krona-secondary`,children:`Любимые позиции:`}),(0,D.jsx)(`div`,{className:`text-krona-secondary text-[11px]`,children:`Филадельфия Премиум, Том Ям`})]})]}),(0,D.jsxs)(`div`,{className:`p-2.5 bg-krona-workspace rounded-lg border border-krona-border space-y-1`,children:[(0,D.jsxs)(`div`,{className:`font-semibold text-krona-primary flex items-center gap-1`,children:[(0,D.jsx)(c,{className:`w-3 h-3 text-krona-gold`}),`AI Подсказка оператору:`]}),(0,D.jsx)(`p`,{className:`text-[11px] text-krona-secondary`,children:`Гость часто заказывает по пятницам в 19:30. Предложите сет Осенний со скидкой постоянного клиента.`})]}),(0,D.jsx)(`div`,{className:`pt-2 border-t border-krona-border space-y-2`,children:(0,D.jsx)(n,{variant:`outline`,size:`sm`,className:`w-full text-xs`,children:`Открыть сделку в CRM →`})})]})]})]})};export{O as CommunicationsModule}; |