全新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
7.8 KiB

import{j as r}from"./markdown-vendor-BZI_VWzW.js";import{u as W,r as t}from"./data-vendor-BOGugMqL.js";import{a as q,g as Q}from"./react-vendor-wlKWdfEb.js";import{bk as J,a as U,bl as X,f as Z,R as $}from"./index-BlWdPD5L.js";import{c as aa}from"./imageDragTransfer-DvFDfKg6.js";import{D as ea}from"./arco-vendor-CAnKnMnO.js";function P(y){const s=y;return Array.isArray(s?.data?.list)?s.data.list:[]}const I="keyword",ra=350,ta=new URL("/assets/ic_search-DREI2NzL.png",import.meta.url).href,sa=new URL("/assets/ic_plus-DsKUbTM-.png",import.meta.url).href,ca=new URL("/assets/ic_arrow_right_gray-DM6GPP4g.png",import.meta.url).href,h={OFFICIAL:"official",COMMUNITY:"community"};function ia(...y){const s=new Set;return y.forEach(c=>{c.forEach(d=>{const u=String(d??"").trim();u&&s.add(u)})}),Array.from(s)}const F=t.memo(function({item:s,isButton:c=!1,onOpen:d,onHover:u,onDragStart:b}){const n=t.useCallback(()=>{u(s?.threeViewImage)},[s,u]),f=t.useCallback(x=>{b(x,s?.threeViewImage)},[s,b]),p=t.useCallback(()=>{d(s)},[s,d]);return c?r.jsxs("button",{type:"button",className:"character_library_sections__card",draggable:!0,onMouseEnter:n,onDragStart:f,onClick:p,children:[r.jsx("img",{className:"character_library_sections__card_image",src:s.avatar,alt:"",draggable:!1}),r.jsx("span",{className:"character_library_sections__card_tag",children:s.title})]}):r.jsxs("div",{className:"character_library_sections__card",draggable:!0,onMouseEnter:n,onDragStart:f,onClick:p,children:[r.jsx("img",{className:"character_library_sections__card_image",src:s.avatar,alt:"",draggable:!1}),r.jsx("span",{className:"character_library_sections__card_tag",children:s.title})]})});function na({showDiyEntry:y=!0}){const s=q(),{t:c}=W(),[d,u]=Q(),b=t.useRef(null),n=d.get(I)?.trim()??"",[f,p]=t.useState(()=>d.get(I)??""),x=t.useDeferredValue(f),[N,k]=t.useState([]),[j,S]=t.useState([]),[_,A]=t.useState(h.OFFICIAL),[w,O]=t.useState([]),[g,M]=t.useState(null),[R,C]=t.useState(!1),[E,v]=t.useState([]),m=t.useMemo(()=>aa(),[]);t.useEffect(()=>()=>{m.dispose()},[m]),t.useEffect(()=>{J().then(e=>{const a=e.data,i=Array.isArray(a)?a:[];i.sort((o,l)=>(o.sortNum??0)-(l.sortNum??0)),O(i)}).catch(()=>{O([])})},[]),t.useEffect(()=>{p(d.get(I)??"")},[d]),t.useEffect(()=>{const e=window.setTimeout(()=>{const a=x.trim();a!==n&&u(i=>{const o=new URLSearchParams(i);return a?o.set(I,a):o.delete(I),o},{replace:!0})},ra);return()=>window.clearTimeout(e)},[x,n,u]),t.useEffect(()=>{const e={uploadCharacter:!0,page:1,pageSize:30};n&&(e.keyword=n);let a=!1;return U(e).then(i=>{a||v(i.data.list)}).catch(()=>{a||v([])}),()=>{a=!0}},[n]),t.useEffect(()=>{if(_!==h.OFFICIAL)return;const e={type:1,page:1,pageSize:30};g!=null&&(e.categoryId=g),n&&(e.keyword=n);let a=!1;return U(e).then(i=>{a||k(P(i))}).catch(()=>{a||k([])}),()=>{a=!0}},[_,g,n]),t.useEffect(()=>{if(_!==h.COMMUNITY)return;const e={};n&&(e.keyword=n);let a=!1;return X(e).then(i=>{a||S(P(i))}).catch(()=>{a||S([])}),()=>{a=!0}},[_,n]),t.useEffect(()=>{const e=ia(E.map(a=>a?.threeViewImage),N.map(a=>String(a?.threeViewImage??"")),j.map(a=>a?.threeViewImage));e.length!==0&&m.warmupPreviewImages(e)},[j,m,E,N]);const Y=t.useMemo(()=>g==null?c("pages.characters.category_all"):w.find(a=>a.id===g)?.name??c("pages.characters.category_label"),[w,g,c]),L=t.useCallback(e=>{Z({id:e.id,onDeleted:a=>{const i=String(a);v(o=>o.filter(l=>String(l?.id??"")!==i)),S(o=>o.filter(l=>String(l?.id??"")!==i))},onUpdated:a=>{const i=String(a.id),o=l=>String(l?.id??"")!==i?l:{...l,title:a.title,description:a.description,isPublic:a.isPublic,avatar:a.avatar||l?.avatar};v(l=>l.map(o)),S(l=>l.map(o))}})},[]),B=t.useCallback(()=>{s($.CHARACTERS_CREATE)},[s]),V=t.useMemo(()=>_===h.OFFICIAL?N:j,[_,j,N]),H=t.useCallback(()=>{A(h.OFFICIAL),C(!1)},[]),z=t.useCallback(()=>{A(h.COMMUNITY),C(!1)},[]),G=t.useCallback(()=>{M(null),C(!1)},[]),K=t.useCallback(e=>{M(e),C(!1)},[]),T=(e,a)=>{m.startImageDrag({evt:e,dragUrl:a,previewUrl:a})},D=t.useCallback(e=>{m.ensurePreviewImage(e)},[m]);return r.jsxs("div",{className:"character_library_sections",children:[r.jsxs("section",{className:"character_library_sections__section","aria-labelledby":"character-library-my-heading",children:[r.jsxs("div",{className:"character_library_sections__section_head",children:[r.jsx("div",{className:"character_library_sections__title_wrap",children:r.jsx("h2",{id:"character-library-my-heading",className:"character_library_sections__section_title",children:c("pages.characters.my_section")})}),r.jsxs("label",{className:"character_library_sections__search",children:[r.jsx("img",{className:"character_library_sections__search_icon",src:ta,alt:""}),r.jsx("input",{className:"character_library_sections__search_input",type:"search",placeholder:c("pages.characters.search_placeholder"),name:"keyword",value:f,onChange:e=>{p(e.target.value)},"aria-label":c("pages.characters.search_aria")})]})]}),r.jsxs("div",{className:"character_library_sections__grid",children:[y?r.jsxs("button",{type:"button",className:"character_library_sections__card character_library_sections__diy_card",onClick:()=>{B()},"aria-label":c("pages.characters.diy_aria"),children:[r.jsx("img",{className:"character_library_sections__diy_icon",src:sa,alt:""}),r.jsx("p",{className:"character_library_sections__diy_label",children:c("pages.characters.diy_label")})]}):null,E.map((e,a)=>r.jsx(F,{item:e,isButton:!0,onHover:D,onDragStart:T,onOpen:L},String(e.id??a)))]})]}),r.jsxs("section",{className:"character_library_sections__section","aria-label":c("pages.characters.official_section"),children:[r.jsxs("div",{className:"character_library_sections__section_head",children:[r.jsx("div",{className:"character_library_sections__title_wrap",children:r.jsxs("div",{className:"character_library_sections__tabs",role:"tablist","aria-label":c("pages.characters.official_section"),children:[r.jsx("button",{type:"button",role:"tab","aria-selected":_===h.OFFICIAL,className:["character_library_sections__section_tab",_===h.OFFICIAL?"character_library_sections__section_tab_active":""].filter(Boolean).join(" "),onClick:H,children:c("pages.characters.official_section")}),r.jsx("button",{type:"button",role:"tab","aria-selected":_===h.COMMUNITY,className:["character_library_sections__section_tab",_===h.COMMUNITY?"character_library_sections__section_tab_active":""].filter(Boolean).join(" "),onClick:z,children:c("pages.characters.community_section")})]})}),_===h.OFFICIAL?r.jsx("div",{ref:b,children:r.jsx(ea,{trigger:"click",position:"br",popupVisible:R,onVisibleChange:C,triggerProps:{style:{zIndex:2e3}},getPopupContainer:()=>b.current??document.body,droplist:r.jsxs("div",{className:"character_library_sections__category_dropdown",role:"menu","aria-label":c("pages.characters.category_aria"),children:[r.jsx("button",{type:"button",className:["character_library_sections__category_menu_item",g===null?"character_library_sections__category_menu_item_active":""].filter(Boolean).join(" "),role:"menuitem",onClick:G,children:c("pages.characters.category_all")}),w.map(e=>r.jsx("button",{type:"button",className:["character_library_sections__category_menu_item",g===e.id?"character_library_sections__category_menu_item_active":""].filter(Boolean).join(" "),role:"menuitem",onClick:()=>{K(e.id)},children:e.name},e.id))]}),children:r.jsxs("button",{type:"button",className:"character_library_sections__category","aria-label":c("pages.characters.category_aria"),"aria-expanded":R,"aria-haspopup":"menu",children:[r.jsx("span",{children:Y}),r.jsx("img",{className:"character_library_sections__category_icon",src:ca,alt:""})]})})}):null]}),r.jsx("div",{className:"character_library_sections__grid",children:V.map((e,a)=>r.jsx(F,{item:e,onHover:D,onDragStart:T,onOpen:L},String(e.id??a)))})]})]})}function ga(){return r.jsx("div",{className:"charactersPage",children:r.jsx(na,{})})}export{na as CharacterLibrarySections,ga as default};
//# sourceMappingURL=index-ocHw71Eb.js.map