全新popiart网站 react项目重构
You can not select more than 25 topics Topics must start with a letter or number, can include dashes ('-') and can be up to 35 characters long.
 
 
 

2 lines
4.9 KiB

import{j as a}from"./markdown-vendor-DnN-_XEd.js";import{u as T,r as t}from"./data-vendor-DOiUz3Tw.js";import{bd as R,a as x,be as B}from"./index-BF-Ici5R.js";import{D as E}from"./arco-vendor-Cm-ntj-q.js";import"./react-vendor-B8OyfHW2.js";const s={OFFICIAL:"official",COMMUNITY:"community"};function _(d){const h=d;return Array.isArray(h?.data?.list)?h.data.list:Array.isArray(h?.list)?h.list:[]}function V({onClose:d,onSelect:h}){const{t:c}=T(),g=t.useRef(null),[m,N]=t.useState(""),[l,v]=t.useState(""),[L,f]=t.useState([]),[A,y]=t.useState([]),[w,b]=t.useState([]),[i,C]=t.useState(s.OFFICIAL),[p,k]=t.useState([]),[n,I]=t.useState(null),[j,u]=t.useState(!1);t.useEffect(()=>{const e=window.setTimeout(()=>{v(m.trim())},300);return()=>window.clearTimeout(e)},[m]),t.useEffect(()=>{R().then(e=>{const r=e.data,o=Array.isArray(r)?r:[];o.sort((M,S)=>(M.sortNum??0)-(S.sortNum??0)),k(o)}).catch(()=>{k([])})},[]),t.useEffect(()=>{const e={uploadCharacter:!0,page:1,pageSize:120};l&&(e.keyword=l);let r=!1;return x(e).then(o=>{r||f(_(o))}).catch(()=>{r||f([])}),()=>{r=!0}},[l]),t.useEffect(()=>{if(i!==s.OFFICIAL)return;const e={type:1,page:1,pageSize:120};n!=null&&(e.categoryId=n),l&&(e.keyword=l);let r=!1;return x(e).then(o=>{r||y(_(o))}).catch(()=>{r||y([])}),()=>{r=!0}},[i,l,n]),t.useEffect(()=>{if(i!==s.COMMUNITY)return;const e={};l&&(e.keyword=l);let r=!1;return B(e).then(o=>{r||b(_(o))}).catch(()=>{r||b([])}),()=>{r=!0}},[i,l]);const F=t.useMemo(()=>n==null?c("pages.characters.category_label"):p.find(r=>r.id===n)?.name??c("pages.characters.category_label"),[p,n,c]),O=i===s.OFFICIAL?A:w,P=e=>{h?.(e),d?.()};return a.jsx("div",{className:"characterPicker",children:a.jsxs("div",{className:"characterPicker__surface",children:[a.jsx("button",{type:"button",className:"characterPicker__close",onClick:()=>d?.(),"aria-label":c("dialog.common.closeAria"),children:a.jsx("img",{src:new URL("/assets/ic_close-C0Ltcj9g.png",import.meta.url).href,alt:""})}),a.jsxs("div",{className:"characterPicker__topBar",children:[a.jsx("h3",{className:"characterPicker__title",children:c("pages.characters.my_section")}),a.jsxs("label",{className:"characterPicker__search",children:[a.jsx("img",{className:"characterPicker__searchIcon",src:new URL("/assets/ic_search-DREI2NzL.png",import.meta.url).href,alt:""}),a.jsx("input",{className:"characterPicker__searchInput",type:"search",value:m,onChange:e=>{N(e.target.value)},placeholder:c("pages.characters.search_placeholder")})]})]}),a.jsx("div",{className:"characterPicker__grid",children:L.map((e,r)=>a.jsxs("button",{type:"button",className:"characterPicker__card",onClick:()=>{P(e)},children:[a.jsx("img",{className:"characterPicker__cardImage",src:e.avatar,alt:""}),a.jsx("span",{className:"characterPicker__cardTag",children:e.title})]},String(e.id??r)))}),a.jsxs("div",{className:"characterPicker__sectionHeader",children:[a.jsxs("div",{className:"characterPicker__tabs",role:"tablist","aria-label":c("pages.characters.category_aria"),children:[a.jsx("button",{type:"button",role:"tab","aria-selected":i===s.OFFICIAL,className:["characterPicker__tab",i===s.OFFICIAL?"characterPicker__tab--active":""].filter(Boolean).join(" "),onClick:()=>{C(s.OFFICIAL),u(!1)},children:c("pages.characters.official_section")}),a.jsx("button",{type:"button",role:"tab","aria-selected":i===s.COMMUNITY,className:["characterPicker__tab",i===s.COMMUNITY?"characterPicker__tab--active":""].filter(Boolean).join(" "),onClick:()=>{C(s.COMMUNITY),u(!1)},children:c("pages.characters.community_section")})]}),i===s.OFFICIAL?a.jsx("div",{ref:g,children:a.jsx(E,{trigger:"click",position:"br",popupVisible:j,onVisibleChange:u,triggerProps:{style:{zIndex:3e3}},getPopupContainer:()=>g.current??document.body,droplist:a.jsxs("div",{className:"characterPicker__categoryDropdown",role:"menu","aria-label":c("pages.characters.category_label"),children:[a.jsx("button",{type:"button",className:["characterPicker__categoryItem",n===null?"characterPicker__categoryItem--active":""].filter(Boolean).join(" "),onClick:()=>{I(null),u(!1)},children:c("pages.characters.category_label")}),p.map(e=>a.jsx("button",{type:"button",className:["characterPicker__categoryItem",n===e.id?"characterPicker__categoryItem--active":""].filter(Boolean).join(" "),onClick:()=>{I(e.id),u(!1)},children:e.name},e.id))]}),children:a.jsxs("button",{type:"button",className:"characterPicker__categoryButton","aria-expanded":j,"aria-haspopup":"menu",children:[a.jsx("span",{children:F}),a.jsx("img",{src:new URL("/assets/ic_arrow_right_gray-DM6GPP4g.png",import.meta.url).href,alt:""})]})})}):null]}),a.jsx("div",{className:"characterPicker__grid",children:O.map((e,r)=>a.jsxs("button",{type:"button",className:"characterPicker__card",onClick:()=>{P(e)},children:[a.jsx("img",{className:"characterPicker__cardImage",src:e.avatar,alt:""}),a.jsx("span",{className:"characterPicker__cardTag",children:e.title})]},String(e.id??r)))})]})})}export{V as default};
//# sourceMappingURL=index-BgmXP-L4.js.map