https://myaffi.app/build/routes/admin.quests.banners-6YG4E4C6.js

1import{c as _}from"/build/_shared/chunk-CHSALTMO.js";import"/build/_shared/chunk-3SC2VAC3.js";import{L as j}from"/build/_shared/chunk-RNLA4Z5M.js";import{b as v}from"/build/_shared/chunk-W34J4AVZ.js";import{B as P,D as M,h as A,l as S}from"/build/_shared/chunk-4AGFH5QJ.js";import{a as k}from"/build/_shared/chunk-6TKYLUTA.js";import{a as L,m as E,r as T,t as R,x as I}from"/build/_shared/chunk-RRQGU4LS.js";import{d as N}from"/build/_shared/chunk-T36URGAI.js";var D=N(L());var x=N(L());var e=N(I()),G=0,K=()=>`banner-${++G}`,V=p=>new Promise((n,m)=>{let g=new Image,f=new FileReader;f.onload=i=>{g.src=i.target?.result},g.onload=()=>{let i=document.createElement("canvas"),y=i.getContext("2d");if(!y){m(new Error("Canvas context not available"));return}let a=Math.min(960,g.width),h=Math.round(a*(g.height/g.width));i.width=a,i.height=h,y.drawImage(g,0,0,a,h),n(i.toDataURL("image/jpeg",.85))},g.onerror=()=>m(new Error("Failed to load image")),f.onerror=()=>m(new Error("Failed to read file")),f.readAsDataURL(p)}),X=({index:p,banner:n,quests:m,selectedQuestIds:g,onQuestChange:f,onImageChange:i,onRemove:y})=>{let{t:a}=k(),[h,o]=(0,x.useState)(!1),[s,l]=(0,x.useState)(""),u=(0,x.useRef)(null),b=(0,x.useRef)(0),d=m.filter(t=>!g.includes(t.quest_id)||t.quest_id===n.quest?.quest_id).sort((t,c)=>{let q=t.quest_id===n.quest?.quest_id,Q=c.quest_id===n.quest?.quest_id;return q?-1:Q?1:Number(c.is_running)-Number(t.is_running)}),w=(0,x.useCallback)(t=>(l(""),["image/png","image/jpeg","image/gif","image/webp"].includes(t.type)?t.size>10*1024*1024?(l(a("\u30D5\u30A1\u30A4\u30EB\u30B5\u30A4\u30BA\u304C\u5927\u304D\u3059\u304E\u307E\u3059")),!1):!0:(l(a("PNG, JPG, GIF, WebP\u306E\u307F\u5BFE\u5FDC")),!1)),[]),F=(0,x.useCallback)(async t=>{if(w(t))try{let c=await V(t);i(c),l("")}catch(c){l(c instanceof Error?c.message:a("\u753B\u50CF\u51E6\u7406\u30A8\u30E9\u30FC"))}},[w,i]),J=t=>{t.target.files?.[0]&&F(t.target.files[0])},H=t=>{t.preventDefault(),t.stopPropagation(),b.current++,t.dataTransfer.items?.length&&o(!0)},W=t=>{t.preventDefault(),t.stopPropagation(),b.current--,b.current===0&&o(!1)},z=t=>{t.preventDefault(),t.stopPropagation(),t.dataTransfer.dropEffect="copy"},U=t=>{t.preventDefault(),t.stopPropagation(),o(!1),b.current=0,t.dataTransfer.files?.[0]&&F(t.dataTransfer.files[0])},C=()=>u.current?.click();return(0,e.jsxs)("div",{className:"py-3 border-b border-gray-100 last:border-b-0",children:[(0,e.jsxs)("div",{className:"flex items-center gap-2",children:[(0,e.jsx)("div",{className:"flex-shrink-0 w-6 h-6 flex items-center justify-center rounded bg-gray-100 text-xs font-semibold text-gray-600",children:p+1}),(0,e.jsx)("div",{className:"flex-1 min-w-0 max-w-xs",children:(0,e.jsx)(_,{value:n.quest?.quest_id??null,onChange:t=>f(t),children:({open:t})=>(0,e.jsxs)("div",{className:"relative",children:[(0,e.jsxs)(_.Button,{className:v("relative w-full cursor-pointer rounded py-1.5 pl-2 pr-8 text-left text-xs","bg-white border border-gray-300","hover:border-gray-400","focus:outline-none focus:border-indigo-500 focus:ring-1 focus:ring-indigo-500"),children:[(0,e.jsxs)("span",{className:v("flex items-center gap-1.5",n.quest?"text-gray-900":"text-gray-400"),children:[(0,e.jsx)("span",{className:"block truncate",children:n.quest?.title||a("\u30AF\u30A8\u30B9\u30C8\u3092\u9078\u629E...")}),n.quest&&(0,e.jsx)("span",{className:v("inline-flex flex-shrink-0 items-center rounded px-1 py-0.5 text-[9px] font-medium",n.quest.is_running?"bg-green-100 text-green-700":"bg-red-100 text-red-600"),children:n.quest.is_running?a("\u7A3C\u50CD\u4E2D"):a("\u505C\u6B62\u4E2D")})]}),(0,e.jsx)("span",{className:"pointer-events-none absolute inset-y-0 right-0 flex items-center pr-1.5",children:(0,e.jsx)(S,{className:"h-3.5 w-3.5 text-gray-400"})})]}),(0,e.jsx)(j,{show:t,as:x.Fragment,leave:"transition ease-in duration-100",leaveFrom:"opacity-100",leaveTo:"opacity-0",children:(0,e.jsxs)(_.Options,{className:v("absolute z-30 mt-1 max-h-48 w-full overflow-auto rounded py-1","bg-white border border-gray-200 shadow-lg focus:outline-none text-xs"),children:[(0,e.jsx)(_.Option,{value:null,className:({active:c}

1)=>v("relative cursor-pointer select-none py-1.5 pl-2 pr-7",c?"bg-gray-50":"","text-gray-400"),children:a("\u9078\u629E\u89E3\u9664")}),d.map(c=>(0,e.jsx)(_.Option,{value:c.quest_id,disabled:!c.is_running,className:({active:q,selected:Q,disabled:B})=>v("relative select-none py-1.5 pl-2 pr-7",B?"cursor-not-allowed opacity-50":"cursor-pointer",q&&!B&&"bg-indigo-50",Q?"text-indigo-600 font-medium":B?"text-gray-400":"text-gray-900"),children:({selected:q})=>(0,e.jsxs)(e.Fragment,{children:[(0,e.jsxs)("span",{className:"flex items-center gap-1.5",children:[(0,e.jsx)("span",{className:"block truncate",children:c.title}),(0,e.jsx)("span",{className:v("inline-flex flex-shrink-0 items-center rounded px-1 py-0.5 text-[9px] font-medium",c.is_running?"bg-green-100 text-green-700":"bg-gray-100 text-gray-500"),children:c.is_running?a("\u7A3C\u50CD\u4E2D"):a("\u505C\u6B62\u4E2D")})]}),q&&(0,e.jsx)("span",{className:"absolute inset-y-0 right-0 flex items-center pr-2 text-indigo-600",children:(0,e.jsx)(A,{className:"h-3.5 w-3.5"})})]})},c.quest_id))]})})]})})}),(0,e.jsx)("button",{type:"button",onClick:y,className:"flex-shrink-0 p-1.5 rounded text-gray-400 hover:text-red-500 hover:bg-red-50 transition-colors",title:a("\u524A\u9664"),children:(0,e.jsx)(P,{className:"h-3.5 w-3.5"})})]}),(0,e.jsxs)("div",{className:"mt-2 ml-8 max-w-md",children:[n.bannerImage?(0,e.jsxs)("div",{className:"relative group rounded overflow-hidden border border-gray-200",style:{aspectRatio:"16 / 9"},children:[(0,e.jsx)("img",{src:n.bannerImage,alt:`${a("\u30D0\u30CA\u30FC")} ${p+1}`,className:"h-full w-full object-cover"}),(0,e.jsxs)("div",{className:"absolute inset-0 bg-black/50 opacity-0 group-hover:opacity-100 transition-opacity flex items-center justify-center gap-2",children:[(0,e.jsx)("button",{type:"button",onClick:C,className:"px-2 py-0.5 rounded text-[10px] font-medium bg-white text-gray-700 hover:bg-gray-100",children:a("\u5909\u66F4")}),(0,e.jsx)("button",{type:"button",onClick:()=>i(null),className:"px-2 py-0.5 rounded text-[10px] font-medium bg-red-500 text-white hover:bg-red-600",children:a("\u524A\u9664")})]})]}):(0,e.jsx)("div",{role:"button",tabIndex:0,onClick:C,onKeyDown:t=>(t.key==="Enter"||t.key===" ")&&C(),onDragEnter:H,onDragLeave:W,onDragOver:z,onDrop:U,className:v("cursor-pointer rounded border-2 border-dashed flex items-center justify-center text-[10px]",h?"border-indigo-400 bg-indigo-50 text-indigo-600":"border-gray-300 bg-gray-50 text-gray-500 hover:border-gray-400",s&&"border-red-300 bg-red-50"),style:{aspectRatio:"16 / 9"},children:a(h?"\u30C9\u30ED\u30C3\u30D7":"\u753B\u50CF\u3092\u9078\u629E")}),s&&(0,e.jsxs)("p",{className:"mt-1 text-[10px] text-red-600 flex items-center gap-1",children:[(0,e.jsx)(M,{className:"h-3 w-3"}),s]}),(0,e.jsx)("input",{ref:u,type:"file",accept:"image/png,image/jpeg,image/gif,image/webp",className:"sr-only",onChange:J})]})]})},O=({quests:p,selectedBanners:n,onBannersChange:m,maxBanners:g=4})=>{let{t:f}=k(),i=()=>{n.length>=g||m([...n,{id:K(),quest:null,bannerImage:null}])},y=s=>{let l=n.filter((u,b)=>b!==s);m(l)},a=(s,l)=>{let u=[...n],b=l?p.find(d=>d.quest_id===l)??null:null;u[s]={...u[s],quest:b},m(u)},h=(s,l)=>{let u=[...n];u[s]={...u[s],bannerImage:l},m(u)},o=n.map(s=>s.quest?.quest_id).filter(s=>s!==void 0);return(0,e.jsxs)("div",{className:"rounded-xl border border-gray-200 bg-white shadow-sm",children:[(0,e.jsxs)("div",{className:"flex items-center justify-between px-4 py-3 border-b border-gray-100",children:[(0,e.jsxs)("div",{children:[(0,e.jsxs)("h3",{className:"text-sm font-semibold text-gray-900",children:[f("\u30D0\u30CA\u30FC\u8A2D\u5B9A\uFF08\u6700\u5927")," ",g," ",f("\u4EF6\uFF09")]}),(0,e.jsx)("p",{className:"text-xs text-gray-400",children:f("\u30D0\u30CA\u30FC\u753B\u50CF\u3092\u9078\u629E\u3057\u3066\u304F\u3060\u3055\u3044\u3002\u63A8\u5968\u30B5\u30A4\u30BA: 16:9")})]}),n.length<g&&(0,e.jsxs)("button",{type:"button",onClick:i,className:"inline-flex items-center gap-1 px-3 py-1.5 rounded-lg bg-indigo-600 text-white text-xs font-medium hover:bg-indigo-500 transition-colors",children:[(0,e.jsx)("svg",{className:"w-3.5 h-3.5",fill:"none",viewBox:"0 0 24 24",strokeWidth:2,stroke:"currentColor",children:(0,e.jsx)("path",{strokeLinecap:"round",strokeLinejoin:"round",d:"M12 4.5v15m7.5-7.5h-15"})}),f("\u8FFD\u52A0")]})]}),(0,e.jsx)("div",{className:"px-4",children:n.length===0?(0,e.jsx)("p",{className:"text-sm text-gray-400 text-center py-6",children:f("\u30D0\u30CA\u30FC\u3092\u8FFD\u52A0\u3057\u3066\u304F\u3060\u3055\u3044")}):n.map((s,l)=>(0,e.jsx)(X,{index:l,banner:s,quests:p,selectedQuestIds:o,onQuestChange:u=>a(l,u),onImageChange:u=>h(l,u),onRemove:()=>y(l)},s.id))})]})};var r=N(I());function $(){let{t:p}=k(),{quests:n}=T(),[m,g]=(0,D.useState)(()=>n.filter(o=>o.is_featured).sort((o,s)=>(o.featured_order??0)-(s.featured_order??0)).map((o,s)=>

1({id:`init-${s}`,quest:o,bannerImage:o.banner_image_url}))),[f]=(0,D.useState)(()=>n.filter(o=>o.is_featured).map(o=>o.quest_id)),i=R(),y=(0,D.useCallback)(()=>{let o=m.filter(d=>d.quest&&d.bannerImage).map((d,w)=>({quest_id:d.quest.quest_id,banner_image:d.bannerImage,order:w})),s=m.filter(d=>d.quest&&!d.quest.is_running);if(s.length>0){let d=s.map(w=>w.quest.title).join("\u3001");if(!window.confirm(p("\u505C\u6B62\u4E2D\u306E\u30AF\u30A8\u30B9\u30C8\u304C\u542B\u307E\u308C\u3066\u3044\u307E\u3059")+`:
2${d}
3
4`+p("\u3053\u306E\u307E\u307E\u4FDD\u5B58\u3057\u307E\u3059\u304B\uFF1F")))return}let l=o.map(d=>d.quest_id),u=f.filter(d=>!l.includes(d)),b=new FormData;b.append("banners",JSON.stringify(o)),u.length>0&&b.append("unfeatured",JSON.stringify(u)),i.submit(b,{method:"post"})},[m,f,i]),a=i.state==="submitting",h=i.data?.success;return(0,r.jsxs)("div",{className:"flex flex-1 flex-col",children:[(0,r.jsxs)("div",{className:"sm:flex sm:items-center sm:justify-between",children:[(0,r.jsxs)("div",{className:"sm:flex-auto",children:[(0,r.jsx)("h1",{className:"text-2xl font-bold text-gray-900",children:p("\u30D0\u30CA\u30FC\u30AB\u30EB\u30FC\u30BB\u30EB\u8A2D\u5B9A")}),(0,r.jsx)("p",{className:"mt-2 text-sm text-gray-600",children:p("\u30E2\u30D0\u30A4\u30EB\u30A2\u30D7\u30EA\u306E\u30DB\u30FC\u30E0\u753B\u9762\u306B\u8868\u793A\u3059\u308B\u30AF\u30A8\u30B9\u30C8\u30D0\u30CA\u30FC\uFF08\u6700\u59274\u679A\uFF09")})]}),(0,r.jsx)("div",{className:"mt-4 sm:ml-16 sm:mt-0 sm:flex-none",children:(0,r.jsx)(E,{to:"/admin/quests",className:"inline-flex items-center gap-2 rounded-lg border border-gray-300 bg-white px-4 py-2.5 text-sm font-semibold text-gray-700 shadow-sm hover:bg-gray-50 transition-all",children:p("\u30AF\u30A8\u30B9\u30C8\u4E00\u89A7\u306B\u623B\u308B")})})]}),(0,r.jsxs)("div",{className:"mt-6",children:[(0,r.jsx)(O,{quests:n,selectedBanners:m,onBannersChange:g,maxBanners:4}),(0,r.jsxs)("div",{className:"mt-4 flex items-center justify-between",children:[(0,r.jsx)("div",{children:i.data?.message&&(0,r.jsx)("p",{className:`text-sm ${h?"text-green-600":"text-red-600"}`,children:i.data.message})}),(0,r.jsx)("button",{type:"button",onClick:y,disabled:a||m.filter(o=>o.quest&&o.bannerImage).length===0,className:"inline-flex items-center gap-2 rounded-lg bg-gradient-to-r from-purple-600 to-indigo-600 px-5 py-2.5 text-sm font-semibold text-white shadow-md hover:from-purple-500 hover:to-indigo-500 transition-all disabled:opacity-50 disabled:cursor-not-allowed",children:a?(0,r.jsxs)(r.Fragment,{children:[(0,r.jsxs)("svg",{className:"h-4 w-4 animate-spin",fill:"none",viewBox:"0 0 24 24",children:[(0,r.jsx)("circle",{className:"opacity-25",cx:"12",cy:"12",r:"10",stroke:"currentColor",strokeWidth:"4"}),(0,r.jsx)("path",{className:"opacity-75",fill:"currentColor",d:"M4 12a8 8 0 018-8V0C5.373 0 0 5.373 0 12h4zm2 5.291A7.962 7.962 0 014 12H0c0 3.042 1.135 5.824 3 7.938l3-2.647z"})]}),p("\u4FDD\u5B58\u4E2D...")]}):(0,r.jsxs)(r.Fragment,{children:[(0,r.jsx)("svg",{className:"h-4 w-4",fill:"none",viewBox:"0 0 24 24",strokeWidth:2,stroke:"currentColor",children:(0,r.jsx)("path",{strokeLinecap:"round",strokeLinejoin:"round",d:"M9 12.75L11.25 15 15 9.75M21 12a9 9 0 11-18 0 9 9 0 0118 0z"})}),p("\u30D0\u30CA\u30FC\u8A2D\u5B9A\u3092\u4FDD\u5B58")]})})]})]})]})}export{$ as default};