Files
mai-bot/dashboard/dist/assets/pack-market-BOV814Tz.js

2 lines
7.4 KiB
JavaScript

import{i as V,r as n,j as e}from"./router-zNjPR4CY.js";import{a4 as _,B as k,S as G,I as J,F as W,G as q,H as K,J as X,C as P,b as M,f as y,an as B,d as Y,e as Z}from"./index-CuOHsLf7.js";import{B as w}from"./badge-CDs67obV.js";import{P as ee,a as se,b as v,e as ae,d as te,f as le}from"./pagination-DX-kWu7G.js";import{S as N}from"./skeleton-CXI2IV_v.js";import{g as ne,l as re,a as ie,t as ce}from"./pack-api-NsQx-ed4.js";import{ad as T,aH as A,b5 as $,P as L,R as oe,S as de,b6 as me,a as xe,a1 as he,t as ue,ak as je,al as ge,am as fe}from"./icons-DTcdLw9j.js";import"./misc-BwRzHX8c.js";import"./radix-C-ZuImoP.js";import"./utils-DjBw3JGv.js";const S=[{value:"created_at",label:"最新发布",icon:T},{value:"downloads",label:"下载最多",icon:A},{value:"likes",label:"最受欢迎",icon:$}];function _e(){const t=V(),[o,d]=n.useState([]),[m,j]=n.useState(!0),[x,i]=n.useState(""),[g,E]=n.useState("downloads"),[c,h]=n.useState(1),[u,H]=n.useState(1),[R,z]=n.useState(0),[O,b]=n.useState(new Set),[C,D]=n.useState(new Set),p=ne(),f=n.useCallback(async()=>{j(!0);try{const s=await re({status:"approved",page:c,page_size:12,search:x||void 0,sort_by:g,sort_order:"desc"});d(s.packs),H(s.total_pages),z(s.total);const a=new Set;for(const l of s.packs)await ie(l.id,p)&&a.add(l.id);b(a)}catch(s){console.error("加载 Pack 列表失败:",s),_({title:"加载 Pack 列表失败",variant:"destructive"})}finally{j(!1)}},[c,x,g,p]);n.useEffect(()=>{f()},[f]);const U=s=>{s.preventDefault(),h(1),f()},F=async s=>{if(!C.has(s)){D(a=>new Set(a).add(s));try{const a=await ce(s,p);b(l=>{const r=new Set(l);return a.liked?r.add(s):r.delete(s),r}),d(l=>l.map(r=>r.id===s?{...r,likes:a.likes}:r))}catch(a){console.error("点赞失败:",a),_({title:"点赞失败",variant:"destructive"})}finally{D(a=>{const l=new Set(a);return l.delete(s),l})}}},I=s=>{t({to:"/config/pack-market/$packId",params:{packId:s}})},Q=S.find(s=>s.value===g)||S[0];return e.jsxs("div",{className:"h-[calc(100vh-4rem)] flex flex-col p-4 sm:p-6",children:[e.jsx("div",{className:"mb-4 sm:mb-6",children:e.jsxs("div",{className:"flex flex-col sm:flex-row sm:items-center justify-between gap-4",children:[e.jsxs("div",{children:[e.jsxs("h1",{className:"text-2xl sm:text-3xl font-bold flex items-center gap-2",children:[e.jsx(L,{className:"h-8 w-8",strokeWidth:2}),"配置模板市场"]}),e.jsx("p",{className:"text-muted-foreground mt-1 text-sm sm:text-base",children:"浏览和应用社区分享的模型配置模板,快速配置你的 MaiBot"})]}),e.jsxs(k,{variant:"outline",onClick:f,disabled:m,className:"gap-2",children:[e.jsx(oe,{className:`h-4 w-4 ${m?"animate-spin":""}`}),"刷新"]})]})}),e.jsx(G,{className:"flex-1",children:e.jsxs("div",{className:"space-y-4",children:[e.jsxs("div",{className:"flex gap-4 flex-wrap",children:[e.jsx("form",{onSubmit:U,className:"flex-1 min-w-[200px] max-w-md",children:e.jsxs("div",{className:"relative",children:[e.jsx(de,{className:"absolute left-3 top-1/2 -translate-y-1/2 w-4 h-4 text-muted-foreground"}),e.jsx(J,{placeholder:"搜索模板名称、描述...",value:x,onChange:s=>i(s.target.value),className:"pl-10"})]})}),e.jsxs(W,{children:[e.jsx(q,{asChild:!0,children:e.jsxs(k,{variant:"outline",className:"min-w-[140px] gap-2",children:[e.jsx(me,{className:"w-4 h-4"}),Q.label,e.jsx(xe,{className:"w-4 h-4 ml-auto"})]})}),e.jsx(K,{align:"end",children:S.map(s=>e.jsxs(X,{onClick:()=>{E(s.value),h(1)},children:[e.jsx(s.icon,{className:"w-4 h-4 mr-2"}),s.label]},s.value))})]})]}),e.jsxs("div",{className:"text-sm text-muted-foreground",children:["共找到 ",e.jsx("span",{className:"font-medium text-foreground",children:R})," 个模板"]}),m?e.jsx("div",{className:"grid grid-cols-1 md:grid-cols-2 lg:grid-cols-3 gap-4",children:Array.from({length:6}).map((s,a)=>e.jsxs(P,{children:[e.jsxs(M,{children:[e.jsx(N,{className:"h-6 w-3/4"}),e.jsx(N,{className:"h-4 w-full mt-2"})]}),e.jsx(y,{children:e.jsx(N,{className:"h-20 w-full"})}),e.jsx(B,{children:e.jsx(N,{className:"h-9 w-full"})})]},a))}):o.length===0?e.jsx(P,{className:"py-12",children:e.jsxs(y,{className:"text-center text-muted-foreground",children:[e.jsx(L,{className:"w-12 h-12 mx-auto mb-4 opacity-50"}),e.jsx("p",{className:"text-lg font-medium",children:"暂无模板"}),e.jsx("p",{className:"mt-1",children:"还没有人分享配置模板,快来分享第一个吧!"})]})}):e.jsx("div",{className:"grid grid-cols-1 md:grid-cols-2 lg:grid-cols-3 gap-4",children:o.map(s=>e.jsx(Ne,{pack:s,liked:O.has(s.id),liking:C.has(s.id),onLike:()=>F(s.id),onView:()=>I(s.id)},s.id))}),u>1&&e.jsx(ee,{children:e.jsxs(se,{children:[e.jsx(v,{children:e.jsx(ae,{onClick:()=>h(s=>Math.max(1,s-1)),className:c===1?"pointer-events-none opacity-50":"cursor-pointer"})}),Array.from({length:u},(s,a)=>a+1).filter(s=>s===1||s===u||Math.abs(s-c)<=1).map((s,a,l)=>{const r=a>0&&s-l[a-1]>1;return e.jsxs(v,{children:[r&&e.jsx("span",{className:"px-2",children:"..."}),e.jsx(te,{onClick:()=>h(s),isActive:s===c,className:"cursor-pointer",children:s})]},s)}),e.jsx(v,{children:e.jsx(le,{onClick:()=>h(s=>Math.min(u,s+1)),className:c===u?"pointer-events-none opacity-50":"cursor-pointer"})})]})})]})})]})}function Ne({pack:t,liked:o,liking:d,onLike:m,onView:j}){const x=i=>new Date(i).toLocaleDateString("zh-CN",{year:"numeric",month:"short",day:"numeric"});return e.jsxs(P,{className:"flex flex-col hover:shadow-md transition-shadow",children:[e.jsxs(M,{className:"pb-3",children:[e.jsxs("div",{className:"flex items-start justify-between",children:[e.jsx(Y,{className:"text-lg line-clamp-1",children:t.name}),e.jsxs(w,{variant:"secondary",className:"text-xs",children:["v",t.version]})]}),e.jsx(Z,{className:"line-clamp-2 min-h-[40px]",children:t.description})]}),e.jsxs(y,{className:"flex-1 space-y-3",children:[e.jsxs("div",{className:"flex items-center justify-between text-sm text-muted-foreground",children:[e.jsxs("span",{className:"flex items-center gap-1",children:[e.jsx(he,{className:"w-3.5 h-3.5"}),t.author]}),e.jsxs("span",{className:"flex items-center gap-1",children:[e.jsx(T,{className:"w-3.5 h-3.5"}),x(t.created_at)]})]}),e.jsxs("div",{className:"flex gap-4 text-sm",children:[e.jsxs("span",{className:"flex items-center gap-1 text-muted-foreground",title:"提供商数量",children:[e.jsx(ue,{className:"w-3.5 h-3.5"}),t.provider_count]}),e.jsxs("span",{className:"flex items-center gap-1 text-muted-foreground",title:"模型数量",children:[e.jsx(je,{className:"w-3.5 h-3.5"}),t.model_count]}),e.jsxs("span",{className:"flex items-center gap-1 text-muted-foreground",title:"任务配置数",children:[e.jsx(ge,{className:"w-3.5 h-3.5"}),t.task_count]})]}),t.tags&&t.tags.length>0&&e.jsxs("div",{className:"flex flex-wrap gap-1",children:[t.tags.slice(0,3).map(i=>e.jsxs(w,{variant:"outline",className:"text-xs",children:[e.jsx(fe,{className:"w-2.5 h-2.5 mr-1"}),i]},i)),t.tags.length>3&&e.jsxs(w,{variant:"outline",className:"text-xs",children:["+",t.tags.length-3]})]})]}),e.jsx(B,{className:"pt-3 border-t",children:e.jsxs("div",{className:"flex items-center justify-between w-full",children:[e.jsxs("div",{className:"flex items-center gap-3 text-sm text-muted-foreground",children:[e.jsxs("span",{className:"flex items-center gap-1",children:[e.jsx(A,{className:"w-4 h-4"}),t.downloads]}),e.jsxs("button",{onClick:i=>{i.stopPropagation(),m()},disabled:d,className:`flex items-center gap-1 transition-colors ${o?"text-red-500":"hover:text-red-500"} ${d?"opacity-50":""}`,children:[e.jsx($,{className:`w-4 h-4 ${o?"fill-current":""}`}),t.likes]})]}),e.jsx(k,{size:"sm",onClick:j,children:"查看详情"})]})})]})}export{_e as default};