https://bomber-admin.web.app/assets/SalonRanking-DZX6g5_0.js

1import{f as C,r as c,j as e,L as R}from"./vendor-react-Cx3Bz6gM.js";import{u as A}from"./main-BR99q4qQ.js";import"./vendor-firebase-CGQGHW05.js";const f=h=>`¥${Math.round(h||0).toLocaleString()}`;function K(){var b,j;const{isAdmin:h}=A(),[N]=C(),x=N.get("ym")||"",[a,p]=c.useState(null),[i,v]=c.useState(""),[m,w]=c.useState("amount");c.useEffect(()=>{try{const t=x?`execDashboard:${x}`:null;if(t){const s=localStorage.getItem(t);s&&p(JSON.parse(s))}if(!t||!localStorage.getItem(t)){const s=Object.keys(localStorage).filter(r=>r.startsWith("execDashboard:"));if(s.sort().reverse(),s[0]){const r=localStorage.getItem(s[0]);r&&p(JSON.parse(r))}}}catch(t){console.warn("cache read failed:",t)}},[x]);const o=c.useMemo(()=>{var r,d;const t=((d=(r=a==null?void 0:a.data)==null?void 0:r.current)==null?void 0:d.salonRanking)||[];let s=i?t.filter(l=>l.name.toLowerCase().includes(i.toLowerCase())):t;return s=[...s],m==="amount"?s.sort((l,n)=>n.amount-l.amount):m==="name"&&s.sort((l,n)=>l.name.localeCompare(n.name,"ja")),s},[a,i,m]),u=((b=o[0])==null?void 0:b.amount)||0,k=o.reduce((t,s)=>t+s.amount,0),y=((j=a==null?void 0:a.data)==null?void 0:j.period)||x||"-",S=(a==null?void 0:a.fetchedAt)||"-";if(!h)return e.jsx("div",{className:"mx-auto max-w-3xl rounded-xl border border-amber-300 bg-amber-50 p-6 text-sm text-amber-900",children:"このページは admin / master 権限のみ閲覧できます。"});const L=()=>{const t=[["順位","サロン名","売上金額"]];o.forEach((n,g)=>t.push([g+1,n.name,n.amount]));const s=t.map(n=>n.map(g=>`"${String(g).replace(/"/g,'""')}"`).join(",")).join(`\r
2`),r=new Blob(["\uFEFF"+s],{type:"text/csv;charset=utf-8"}),d=URL.createObjectURL(r),l=document.createElement("a");l.href=d,l.download=`サロン別売上ランキング_${y.replace("/","-")}.csv`,l.click(),setTimeout(()=>URL.revokeObjectURL(d),3e3)};return e.jsxs("div",{className:"mx-auto max-w-6xl space-y-5",children:[e.jsxs("div",{className:"flex flex-wrap items-center justify-between gap-3",children:[e.jsxs("div",{children:[e.jsx("div",{className:"flex items-center gap-2 text-xs text-gray-500",children:e.jsx(R,{to:"/admin/dashboard-exec",className:"hover:text-indigo-600",children:"← 経営ダッシュボードに戻る"})}),e.jsx("h1",{className:"mt-1 text-xl font-bold text-gray-900",children:"サロン別売上ランキング"}),e.jsxs("p",{className:"text-xs text-gray-500",children:["対象月: ",e.jsx("span",{className:"font-medium",children:y})," ／ データ取得: ",S]})]}),e.jsx("div",{className:"flex items-center gap-2",children:e.jsx("button",{onClick:L,className:"rounded-lg bg-emerald-600 px-3 py-1.5 text-xs font-bold text-white hover:bg-emerald-700",children:"📥 CSVダウンロード"})})]}),e.jsxs("div",{className:"flex flex-wrap items-center gap-3 rounded-xl border border-gray-200 bg-white p-4",children:[e.jsx("input",{type:"text",value:i,onChange:t=>v(t.target.value),placeholder:"サロン名で絞り込み...",className:"flex-1 min-w-[200px] rounded-lg border border-gray-300 px-3 py-1.5 text-sm"}),e.jsxs("div",{className:"flex items-center gap-1",children:[e.jsx("span",{className:"text-xs text-gray-500",children:"並び替え:"}),[{key:"amount",label:"売上金額"},{key:"name",label:"サロン名"}].map(t=>e.jsx("button",{onClick:()=>w(t.key),className:`rounded-lg border px-3 py-1 text-xs font-medium ${m===t.key?"border-indigo-500 bg-indigo-500 text-white":"border-gray-300 bg-white text-gray-700 hover:bg-gray-50"}`,children:t.label},t.key))]})]}),e.jsxs("div",{className:"grid grid-cols-1 gap-4 sm:grid-cols-2",children:[e.jsxs("div",{className:"rounded-2xl border border-gray-200 bg-white p-4",children:[e.jsx("div",{className:"text-xs text-gray-500",children:"サロン数"}),e.jsxs("div",{className:"mt-1 text-2xl font-bold text-gray-900",children:[o.length.toLocaleString()," サロン"]})]}),e.jsxs("div",{className:"rounded-2xl border border-gray-200 bg-white p-4",children:[e.jsx("div",{className:"text-xs text-gray-500",children:"売上合計"}),e.jsx("div",{className:"mt-1 text-2xl font-bold text-gray-900",children:f(k)})]})]}),e.jsx("div",{className:"overflow-hidden rounded-2xl border border-gray-200 bg-white",children:o.length===0?e.jsx("div",{className:"p-10 text-center text-sm text-gray-400",children:"データがありません（経営ダッシュボードで一度データ取得後、このページを開いてください）"}):e.jsxs("table",{className:"min-w-full text-sm",children:[e.jsx("thead",{className:"bg-gray-50 text-xs text-gray-600",children:e.jsxs("tr",{children:[e.jsx("th",{className:"px-4 py-2 text-left",children:"順位"}),e.jsx("th",{className:"px-4 py-2 text-left",children:"サロン名"}),e.jsx("th",{className:"px-4 py-2",children:"売上割合"}),e.jsx("th",{className:"px-4 py-2 text-right",children:"売上金額"})]})}),e.jsx("tbody",{children:o.map((t,s)=>e.jsxs("tr",{className:"border-t border-gray-100 hover:bg-gray-50",children:[e.jsx("td",{className:"px-4 py-2 text-xs font-bold text-gray-400",children:s+1}),e.jsx("td",{className:"px-4 py-2 text-sm text-gray-900",children:t.name}),e.jsx("td",{className:"px-4 py-2",children:e.jsx("div",{className:"h-4 overflow-hidden rounded bg-gray-100",children:e.jsx("div",{className:"h-full bg-pink-500",style:{width:`${u>0?t.amount/u*100:0}%`}})})}),e.jsx("td",{className:"px-4 py-2 text-right text-sm font-medium text-gray-900",children:f(t.amount)})]},t.name))})]})})]})}export{K as default};