https://markethacker.ru/assets/campaign-stats-CTwualG1.js

1import{h as N,T as O,m as e,L as k,D as F,y as H,z as K,A as B,B as _,E as V}from"./index-BhuuQD9y.js";import{P as z}from"./package-oNVqdsaN.js";import{I as X}from"./image-BuQU88l3.js";import{M as q}from"./message-square-BASd6dNi.js";import{P as Y}from"./percent-wBt4aiQW.js";import{P as D}from"./plus-BeoQ3l_S.js";import{C as G}from"./chevron-left-ai0KuTWj.js";import{E as J}from"./eye-x9lTuTW0.js";import{M as Q}from"./mouse-pointer-click-DaHLf1_c.js";import{S as Z}from"./shopping-cart-CiOvX5MW.js";import{W as ee}from"./wallet-sO7ZU_x5.js";const p=30,R=new Date(2026,5,1),C=r=>{const i=new Date(R);return i.setDate(i.getDate()+r),`${String(i.getDate()).padStart(2,"0")}.${String(i.getMonth()+1).padStart(2,"0")}`},m={impressions:[4200,4600,5100,4800,5300,6100,6800,7200,6900,7500,8100,8800,9200,8900,9400,10200,11e3,11800,12200,13e3,13400,12800,13900,14600,15200,15800,16400,17100,17800,18400],clicks:[140,168,182,171,198,228,255,271,256,283,306,333,349,336,357,389,420,450,466,497,512,489,531,559,581,604,627,654,680,704],orders:[8,10,11,9,13,18,22,24,21,28,34,38,42,39,41,48,55,62,66,72,75,71,80,86,91,97,103,110,118,126],ctr:[3.33,3.65,3.57,3.56,3.74,3.74,3.75,3.76,3.71,3.77,3.78,3.78,3.79,3.78,3.8,3.81,3.82,3.81,3.82,3.82,3.82,3.82,3.82,3.83,3.82,3.82,3.82,3.82,3.82,3.83],drr:[42,40,39,41,38,37,36,35,36,34,33,32,30,31,29,28,27,26,25,24,23,24,22,21,20,19,18,18,17,16]},w=[{key:"impressions",label:"Показы",color:"#8A2BE2",icon:J,format:r=>r.toLocaleString("ru-RU")},{key:"clicks",label:"Клики",color:"#22c55e",icon:Q,format:r=>r.toLocaleString("ru-RU")},{key:"orders",label:"Заказы",color:"#f97316",icon:Z,format:r=>r.toLocaleString("ru-RU")},{key:"ctr",label:"CTR %",color:"#0ea5e9",icon:B,format:r=>`${r.toFixed(2)}%`},{key:"drr",label:"ДРР %",color:"#ef4444",icon:ee,format:r=>`${r.toFixed(0)}%`}],E=[{day:3,kind:"card",label:"Новое фото",detail:"Заменена главная карточка"},{day:6,kind:"price",label:"Цена 1290→990 ₽",detail:"Снижение цены на 23%"},{day:9,kind:"promo",label:"Акция «-30%»",detail:"Участие в акции WB"},{day:13,kind:"stock",label:"Поставка +500 шт",detail:"Электросталь, +500 ед."},{day:16,kind:"review",label:"Всплеск отзывов",detail:"+42 отзыва за 2 дня, рейтинг 4.9"},{day:20,kind:"price",label:"Цена 990→890 ₽",detail:"Снижение цены на 10%"},{day:23,kind:"card",label:"Доб. видео",detail:"Добавлено видео-обзор"},{day:27,kind:"promo",label:"Распродажа лета",detail:"Подключена распродажа"}],b={price:{color:"#be185d",bg:"#fce7f3",icon:O,label:"Изменение цены"},promo:{color:"#a16207",bg:"#fef3c7",icon:Y,label:"Акции"},review:{color:"#15803d",bg:"#dcfce7",icon:q,label:"Отзывы"},card:{color:"#1d4ed8",bg:"#dbeafe",icon:X,label:"Карточка"},stock:{color:"#7c3aed",bg:"#ede9fe",icon:z,label:"Остатки"}};function me(){const[r,i]=N.useState(["impressions","orders","drr"]),[o,j]=N.useState(null),[v,L]=N.useState(new Set(Object.keys(b))),T=s=>i(t=>t.includes(s)?t.filter(a=>a!==s):[...t,s]),W=s=>{const t=new Set(v);t.has(s)?t.delete(s):t.add(s),L(t)},y=1200,S=320,c=50,$=30,d=20,P=40,U=y-c-$,h=S-d-P,x=U/(p-1),A=N.useMemo(()=>{const s={};return Object.keys(m).forEach(t=>{const a=m[t];s[t]=[Math.min(...a),Math.max(...a)]}),s},[]),I=s=>{const[t,a]=A[s];return m[s].map((l,n)=>{const f=c+n*x,M=d+(1-(l-t)/(a-t||1))*h;return`${f},${M}`}).join(" ")},g=N.useMemo(()=>({impressions:m.impressions.reduce((s,t)=>s+t,0),clicks:m.clicks.reduce((s,t)=>s+t,0),orders:m.orders.reduce((s,t)=>s+t,0),spend:482300,drr:26,ctr:3.78}),[]);return e.jsxs("div",{className:"min-h-screen bg-[#f6f5fb] text-[#2a1b4a]",children:[e.jsx("header",{className:"border-b border-black/5 bg-white",children:e.jsxs("div",{className:"mx-auto flex max-w-[1640px] items-center gap-4 px-6 py-3",children:[e.jsx(k,{to:"/",className:"text-lg font-extrabold tracking-tight text-[#8A2BE2]",children:"MarketHacker"}),e.jsxs("nav",{className:"ml-4 flex items-center gap-1 text-sm",children:[e.jsx(k,{to:"/clusters",className:"rounded-md px-3 py-1.5 text-[#6b5a8a] hover:bg-[#faf8ff]",children:"Кластеры"}),e.jsx("span",{className:"rounded-md bg-[#f3eeff] px-3 py-1.5 font-semibold text-[#8A2BE2]",children:"Статистика РК"}),e.jsx(k,{to:"/wb-search",className:"rounded-md px-3 py-1.5 text-[#6b5a8a] hover:bg-[#faf8ff]",children:"Расширение"}),e.jsx(k,{to:"/seller-funnel",className:"rounded-md px-3 py-1.5 text-[#6b5a8a] hover:bg-[#faf8ff]",children:"ВороÐ

1½ÐºÐ°"})]}),e.jsxs("div",{className:"ml-auto flex items-center gap-2",children:[e.jsxs("button",{className:"flex items-center gap-1.5 rounded-lg border border-[#e2d8f5] bg-white px-3 py-2 text-xs font-medium text-[#2a1b4a] hover:bg-[#faf8ff]",children:[e.jsx(F,{className:"h-3.5 w-3.5 text-[#8A2BE2]"})," Экспорт"]}),e.jsxs("button",{className:"flex items-center gap-1.5 rounded-lg bg-[#8A2BE2] px-3 py-2 text-xs font-semibold text-white hover:bg-[#7a22d2]",children:[e.jsx(D,{className:"h-3.5 w-3.5"})," Событие"]})]})]})}),e.jsxs("main",{className:"mx-auto max-w-[1640px] space-y-3 px-6 py-4",children:[e.jsxs("div",{className:"flex flex-wrap items-end justify-between gap-3",children:[e.jsxs("div",{children:[e.jsx("h1",{className:"text-xl font-bold leading-tight",children:"РК «Омега-3 1000мг» · #481923"}),e.jsx("p",{className:"text-xs text-[#6b5a8a]",children:"Автоматическая кампания · 12 кластеров · события сопоставлены с метриками"})]}),e.jsxs("div",{className:"flex items-center gap-2",children:[e.jsxs("div",{className:"flex items-center gap-1 rounded-lg border border-[#e2d8f5] bg-white px-2 py-1.5 text-xs",children:[e.jsx(G,{className:"h-3.5 w-3.5 text-[#9c8cbc]"}),e.jsx(H,{className:"h-3.5 w-3.5 text-[#8A2BE2]"}),e.jsx("span",{className:"font-medium",children:"01.06 — 30.06.2026"}),e.jsx(K,{className:"h-3.5 w-3.5 text-[#9c8cbc]"})]}),e.jsxs("select",{className:"rounded-lg border border-[#e2d8f5] bg-white px-2 py-1.5 text-xs",children:[e.jsx("option",{children:"День"}),e.jsx("option",{children:"Неделя"}),e.jsx("option",{children:"Месяц"})]})]})]}),e.jsxs("div",{className:"grid grid-cols-2 gap-2 md:grid-cols-6",children:[e.jsx(u,{label:"Показы",value:g.impressions.toLocaleString("ru-RU"),delta:"+18%",up:!0}),e.jsx(u,{label:"Клики",value:g.clicks.toLocaleString("ru-RU"),delta:"+24%",up:!0}),e.jsx(u,{label:"CTR",value:`${g.ctr.toFixed(2)}%`,delta:"+0.4 п.п.",up:!0}),e.jsx(u,{label:"Заказы",value:g.orders.toLocaleString("ru-RU"),delta:"+62%",up:!0}),e.jsx(u,{label:"Расход",value:`${g.spend.toLocaleString("ru-RU")} ₽`,delta:"+11%"}),e.jsx(u,{label:"ДРР",value:`${g.drr}%`,delta:"−14 п.п.",up:!0})]}),e.jsxs("div",{className:"flex flex-wrap items-center gap-2 rounded-xl border border-[#e2d8f5] bg-white px-3 py-2",children:[e.jsx("span",{className:"text-[10px] font-semibold uppercase tracking-wider text-[#6b5a8a]",children:"Метрики:"}),w.map(s=>{const t=r.includes(s.key),a=s.icon;return e.jsxs("button",{onClick:()=>T(s.key),className:`flex items-center gap-1.5 rounded-md border px-2.5 py-1 text-xs font-medium transition ${t?"border-transparent text-white":"border-[#e2d8f5] bg-white text-[#6b5a8a] hover:bg-[#faf8ff]"}`,style:t?{background:s.color}:{},children:[e.jsx(a,{className:"h-3 w-3"})," ",s.label]},s.key)}),e.jsx("div",{className:"ml-auto flex items-center gap-1 text-xs text-[#6b5a8a]",children:e.jsxs("button",{className:"flex items-center gap-1 rounded-md px-2 py-1 hover:bg-[#faf8ff]",children:[e.jsx(_,{className:"h-3.5 w-3.5"})," Настроить"]})})]}),e.jsxs("div",{className:"rounded-xl border border-[#e2d8f5] bg-white p-4 shadow-sm",children:[e.jsxs("div",{className:"relative",children:[e.jsxs("svg",{viewBox:`0 0 ${y} ${S}`,className:"block w-full",onMouseLeave:()=>j(null),onMouseMove:s=>{const t=s.currentTarget.getBoundingClientRect(),a=(s.clientX-t.left)/t.width*y,l=Math.max(0,Math.min(p-1,Math.round((a-c)/x)));j(l)},children:[[0,.25,.5,.75,1].map(s=>e.jsx("line",{x1:c,x2:y-$,y1:d+s*h,y2:d+s*h,stroke:"#e2d8f5",strokeWidth:1},s)),Array.from({length:7}).map((s,t)=>{const a=Math.round(t/6*(p-1));return e.jsx("text",{x:c+a*x,y:S-18,fontSize:10,fill:"#9c8cbc",textAnchor:"middle",children:C(a)},t)}),E.filter(s=>v.has(s.kind)).map((s,t)=>{const a=c+s.day*x,l=b[s.kind];return e.jsxs("g",{children:[e.jsx("line",{x1:a,x2:a,y1:d,y2:d+h,stroke:l.color,strokeOpacity:.25,strokeDasharray:"3 3",strokeWidth:1}),e.jsx("circle",{cx:a,cy:d-4,r:6,fill:l.color})]},t)}),r.map(s=>{const t=w.find(a=>a.key===s);return e.jsx("polyline",{fill:"none",stroke:t.color,strokeWidth:2,points:I(s)},s)}),o!==null&&e.jsxs(e.Fragment,{children:[e.jsx("line",{x1:c+o*x,x2:c+o*x,y1:d,y2:d+h,stroke:"#2a1b4a",strokeOpacity:.2,strokeWidth:1}),r.map(s=>{const t=w.find(M=>M.key===s),[a,l]=A[s],n=m[s][o],f=d+(1-(n-a)/(l-a||1))*h;return e.jsx("circle",{cx:c+o*x,cy:f,r:4,fill:"white",stroke:t.color,strokeWidth:2},s)})]})]}),o!==null&&e.jsxs("div",{className:"pointer-events-none absolute top-2 rounded-lg border border-[#e2d8f5] bg-white p-2 text-[11px] shadow-lg",style:{left:`${(c+o*x)/y*100}%`,transform:"translateX(8px)"},children:[e.jsxs("div",{className:"mb-1 font-bold text-[#2a1b4a]",children:[C(o),".2026"]}

1),r.map(s=>{const t=w.find(a=>a.key===s);return e.jsxs("div",{className:"flex items-center gap-2",children:[e.jsx("span",{className:"h-1.5 w-2.5 rounded-sm",style:{background:t.color}}),e.jsxs("span",{className:"text-[#6b5a8a]",children:[t.label,":"]}),e.jsx("span",{className:"font-semibold tabular-nums text-[#2a1b4a]",children:t.format(m[s][o])})]},s)}),E.filter(s=>s.day===o&&v.has(s.kind)).map((s,t)=>{const a=b[s.kind];return e.jsxs("div",{className:"mt-1 rounded px-1.5 py-0.5 text-[10px] font-medium",style:{background:a.bg,color:a.color},children:["● ",s.label]},t)})]})]}),e.jsxs("div",{className:"mt-3 flex flex-wrap items-center gap-2 border-t border-[#f0eaff] pt-3",children:[e.jsx("span",{className:"text-[10px] font-semibold uppercase tracking-wider text-[#6b5a8a]",children:"События:"}),Object.keys(b).map(s=>{const t=b[s],a=v.has(s),l=t.icon;return e.jsxs("button",{onClick:()=>W(s),className:`flex items-center gap-1.5 rounded-md border px-2 py-1 text-[11px] font-medium transition ${a?"":"opacity-40"}`,style:{background:t.bg,color:t.color,borderColor:t.color+"40"},children:[e.jsx(l,{className:"h-3 w-3"})," ",t.label]},s)})]})]}),e.jsxs("div",{className:"rounded-xl border border-[#e2d8f5] bg-white shadow-sm",children:[e.jsxs("div",{className:"flex items-center justify-between border-b border-[#f0eaff] px-4 py-2.5",children:[e.jsxs("div",{className:"flex items-center gap-2",children:[e.jsx("h3",{className:"text-sm font-bold text-[#2a1b4a]",children:"Календарь событий"}),e.jsx("span",{className:"rounded-md bg-[#f3eeff] px-2 py-0.5 text-[10px] font-semibold text-[#8A2BE2]",children:"Июнь 2026"})]}),e.jsxs("button",{className:"flex items-center gap-1 rounded-md bg-[#8A2BE2] px-2.5 py-1.5 text-[11px] font-semibold text-white hover:bg-[#7a22d2]",children:[e.jsx(D,{className:"h-3 w-3"})," Создать событие"]})]}),e.jsx("div",{className:"overflow-x-auto",children:e.jsxs("div",{className:"min-w-[1100px]",children:[e.jsxs("div",{className:"flex border-b border-[#f0eaff] bg-[#faf8ff]",children:[e.jsx("div",{className:"w-[180px] shrink-0 px-3 py-2 text-[10px] font-semibold uppercase tracking-wider text-[#6b5a8a]",children:"События"}),e.jsx("div",{className:"flex flex-1",children:Array.from({length:p}).map((s,t)=>{const a=new Date(R);a.setDate(a.getDate()+t);const l=a.getDay()===0||a.getDay()===6;return e.jsx("div",{className:`flex-1 border-r border-[#f0eaff] py-2 text-center text-[10px] ${l?"bg-[#f3eeff]/40 text-[#8A2BE2]":"text-[#6b5a8a]"}`,children:String(a.getDate()).padStart(2,"0")},t)})})]}),Object.keys(b).map(s=>{const t=b[s],a=E.filter(n=>n.kind===s),l=t.icon;return e.jsxs("div",{className:"flex border-b border-[#f0eaff] hover:bg-[#faf8ff]/40",children:[e.jsxs("div",{className:"flex w-[180px] shrink-0 items-center gap-2 px-3 py-2.5 text-xs",children:[e.jsx("span",{className:"grid h-5 w-5 place-items-center rounded",style:{background:t.bg},children:e.jsx(l,{className:"h-3 w-3",style:{color:t.color}})}),e.jsx("span",{className:"font-medium text-[#2a1b4a]",children:t.label}),e.jsx("span",{className:"ml-auto text-[10px] text-[#9c8cbc]",children:a.length})]}),e.jsxs("div",{className:"relative flex flex-1",children:[Array.from({length:p}).map((n,f)=>e.jsx("div",{className:"flex-1 border-r border-[#f0eaff]"},f)),a.map((n,f)=>e.jsxs("div",{title:`${n.label} — ${n.detail}`,className:"absolute top-1.5 flex h-8 cursor-pointer items-center gap-1 overflow-hidden rounded-md px-1.5 text-[10px] font-semibold shadow-sm hover:shadow",style:{background:t.bg,color:t.color,left:`${n.day/p*100}%`,width:`calc(${1/p*100}% + 80px)`,maxWidth:180},children:[e.jsx("span",{className:"h-1.5 w-1.5 shrink-0 rounded-full",style:{background:t.color}}),e.jsx("span",{className:"truncate",children:n.label})]},f))]})]},s)})]})}),e.jsx("div",{className:"border-t border-[#f0eaff] bg-[#faf8ff] px-4 py-2 text-[11px] text-[#6b5a8a]",children:"Подсказка: события на графике выше отображаются вертикальными пунктирами того же цвета. Кликните по строке чтобы развернуть детали."})]})]})]})}function u({label:r,value:i,delta:o,up:j}){return e.jsxs("div",{className:"rounded-xl border border-[#e2d8f5] bg-white px-3 py-2.5",children:[e.jsx("div",{className:"text-[10px] uppercase tracking-wider text-[#6b5a8a]",children:r}),e.jsx("div",{className:"mt-0.5 text-lg font-bold leading-tight text-[#2a1b4a]",children:i}),e.jsxs("div",{className:`mt-0.5 flex items-center gap-0.5 text-[10px] font-semibold ${j?"text-[#15803d]":"text-[#6b5a8a]"}`,children:[j?e.jsx(B,{className:"h-3 w-3"}):e.jsx(V,{className:"h-3 w-3"}),o]})]})}export{me as component};