1 |
- import{u as e,r as l,o as a,a as t,M as d,b as r,c as u,i as o,d as s,F as i,f as n,v as c,k as p,h as v,X as m,V as f,J as g,g as h,n as y,x as b,j as x,aQ as _,l as k,aa as w,aR as V,T as j,I as C,aS as U,m as z,p as W,ac as O,W as F}from"./index.34872ab0.1730902649514.js";import{S as B}from"./sortable.esm.c2baa127.1730902649514.js";/* empty css */const T={id:"backgroundManager",class:"rounded-lg overflow-hidden flex flex-wrap gap-2"},S={class:"flex flex-col bg-white w-52 px-2 py-4 rounded-lg h-full"},A={class:"h-full relative overflow-y-scroll leftScrollBackground"},E={class:"space-y-1 mb-4",id:"list"},I=["onClick","data-id"],M={class:"flex items-center"},$={class:"flex items-center gap-2"},D={class:"sticky bottom-0 flex justify-center"},J={class:"flex-1 relative overflow-y-scroll h-full"},Q={class:"bg-white overflow-scroll relative flex-1 rounded-lg p-4"},R={class:"grid grid-cols-4 mlg:grid-cols-3 mmd:grid-cols-2 msm:grid-cols-1 gap-4",style:{"grid-auto-rows":"max-content"}},X={style:{"aspect-ratio":"16 / 9",background:"linear-gradient(to right bottom, #ff4f00, #ff9068, #fdbc45, #ff9068, #ff4f00)"},class:"relative rounded-lg cursor-pointer"},q={style:{"aspect-ratio":"16 / 9"},class:"relative"},G=["src"],H={class:"absolute rounded-lg opacity-0 transition-all hover:opacity-100 inset-0 w-full h-full flex justify-center items-center",style:{"background-color":"rgba(0, 0, 0, 0.178)"}},K=["onClick"],L={class:"absolute z-10 right-0 bottom-0 w-full h-8 flex justify-end"},N={class:"transition-all mr-4 cursor-pointer mr-2 hover:bg-blue-500 rounded-full w-6 mb-2 flex justify-center items-center"},P=["href"],Y={class:"flex justify-center mt-8 mb-6"},Z={style:{display:"flex","align-items":"center",width:"100%"}},ee=["src"],le={style:{display:"flex","align-items":"center",width:"100%"}},ae=["src"],te={style:{display:"flex","align-items":"center",width:"100%"}},de={style:{display:"flex","align-items":"center",width:"100%"}},re=["src"],ue={__name:"background",setup(ue){const oe=e(),se=l(!1);let ie=null;const ne={id:"",type:0,mime:0,cover:"",folder:0,url:"",name:""},ce=l(Object.assign({},ne)),pe=l(0),ve=l([]),me=l(!0),fe=l(!0),ge={data:[],current_page:1,per_page:19},he=l(Object.assign({},ge)),ye=e=>{pe.value=e.id,he.value=Object.assign({},ge),we()},be=()=>{ce.value=Object.assign({},ne),ce.value.folder=pe.value,se.value=!0},xe=e=>{1===e.code?(ce.value.url=e.data.url,"string"==typeof e.data.minUrl&&(ce.value.cover=e.data.minUrl)):g.warning(e.msg)},_e=e=>{1===e.code?ce.value.cover=e.data.url:g.warning(e.msg)},ke=async()=>{if(2===ce.value.mime&&(ce.value.cover=ce.value.url.trim().replace(/;$/g,""),ce.value.url=ce.value.url.trim().replace(/;$/g,"")),ce.value.folder&&ce.value.cover&&ce.value.url){1===(await f({url:"/Wallpaper/addWallpaper",method:"post",data:ce.value})).code&&(we(),se.value=!1)}else g.error("请检查封面、壁纸和分类是否填写完整")},we=()=>{fe.value=!0,f({url:"/Wallpaper/getFolderWallpaper",method:"post",data:{id:pe.value,limit:he.value.per_page,page:he.value.current_page}}).then((e=>{1===e.code&&(he.value=e.data)})).finally((e=>{fe.value=!1}))},Ve=(e,l)=>{"size"==e&&(he.value.per_page=l),"page"==e&&(he.value.current_page=l),we()},je=e=>{let l="",a="";"add"!==e&&(l=e.id,a=e.name),m.prompt("请输入壁纸分类名称","编辑文件夹",{confirmButtonText:"提交",cancelButtonText:"取消",inputValue:a,inputValidator:e=>""!==e&&null!==e,inputErrorMessage:"请输入分类名称"}).then((({value:e})=>{me.value=!0,f({url:"/Wallpaper/editFolder",method:"post",data:{id:l,name:e}}).then((e=>{1===e.code&&(ve.value=e.data)})).finally((e=>{me.value=!1}))})).catch((()=>{g.warning("已取消操作")}))};return f({url:"/Wallpaper/getFolder"}).then((e=>{1===e.code&&(ve.value=e.data,ve.value.length>0&&ye(ve.value[0])),me.value=!1})),a((()=>{let e=document.getElementById("list");if(e){const l={animation:200,delay:500,delayOnTouchOnly:!0,draggable:".item",onUpdate:function(e){let l=ie.toArray(),a=[];l.forEach(((e,l)=>{a.push({id:parseInt(e),sort:l})})),f({url:"/Wallpaper/sortFolder",method:"post",data:a}).then((e=>{e.code}))}};ie=B.create(e,l)}})),(e,l)=>{const a=t("el-icon"),g=t("el-button"),B=t("el-pagination"),ue=t("el-option"),ie=t("el-select"),ne=t("el-form-item"),ge=t("el-upload"),Ce=t("el-input"),Ue=t("el-form"),ze=t("el-dialog"),We=d("loading");return r(),u("div",T,[o((r(),u("div",S,[s("div",A,[o(s("div",E,[(r(!0),u(i,null,n(ve.value,(e=>(r(),h(j,{key:e.id},{default:v((()=>[s("div",{onClick:l=>ye(e),"data-id":null==e?void 0:e.id,class:y(["relative item px-4 py-1.5 text-sm rounded-sm cursor-pointer flex overflow-hidden justify-between items-center",{"bg-slate-200 text-blue-400":pe.value==e.id}])},[s("div",M,[s("span",null,b(e.name),1)]),s("div",$,[p(a,{class:"hover:text-blue-600",onClick:k((l=>je(e)),["stop"])},{default:v((()=>[p(x(_))])),_:2},1032,["onClick"]),p(a,{class:"hover:text-blue-600",onClick:k((l=>(async e=>{try{await m.confirm("是否删除当前壁纸分类,删除后该目录下的壁纸将一并删除!","删除警告"),await m.confirm("您正在进行危险操作,您是否知晓当前正在删除的分类","二次确认")}catch(l){return!1}me.value=!0,f({url:"/Wallpaper/DelFolder",method:"post",data:{id:e.id}}).then((e=>{1===e.code&&(ve.value=e.data)})).finally((l=>{me.value=!1,e.id==pe.value&&ve.value.length>0&&ye(ve.value[0])}))})(e)),["stop"])},{default:v((()=>[p(x(w))])),_:2},1032,["onClick"]),p(a,{class:"cursor-move"},{default:v((()=>[p(x(V))])),_:1})])],10,I)])),_:2},1024)))),128))],512),[[c,ve.value.length]]),s("div",D,[p(g,{class:"w-11/12",type:"primary",onClick:l[0]||(l[0]=e=>je("add"))},{default:v((()=>l[11]||(l[11]=[C("创建分类")]))),_:1})])])])),[[We,me.value]]),s("div",J,[o((r(),u("div",Q,[s("div",R,[s("div",X,[s("div",{onClick:be,class:"upload-demo flex h-full flex-col justify-center items-center text-white"},[p(a,{size:"50px",class:"el-icon--upload"},{default:v((()=>[p(x(U))])),_:1}),l[12]||(l[12]=s("div",{class:"el-upload__text"}," 点击这里上传您的背景资源 ",-1))])]),(r(!0),u(i,null,n(he.value.data,(e=>(r(),h(j,{key:e.id},{default:v((()=>[s("div",q,[[0,1].includes(e.mime)?(r(),u("img",{key:0,class:"rounded-lg object-cover w-full h-full bg-gray-200",src:e.cover},null,8,G)):z("",!0),2===e.mime?(r(),u("div",{key:1,class:"rounded-lg object-cover w-full h-full bg-gray-200",style:W({background:e.url})},null,4)):z("",!0),s("div",H,[s("div",{onClick:l=>(e=>{ce.value=Object.assign({},e),se.value=!0})(e),class:"transition-all cursor-pointer bg-black bg-opacity-40 hover:opacity-100 hover:bg-red-500 rounded-full flex justify-center items-center w-10 h-10"},[p(a,{size:"28px",color:"#fff"},{default:v((()=>[p(x(_))])),_:1})],8,K),s("div",L,[s("div",N,[p(a,{onClick:l=>(async e=>{if([0,1].includes(e.mime))try{await m.confirm("是否删除当前选中壁纸?删除后文件一并会被删除,如果有使用该壁纸的用户可能会导致背景无法加载。","删除警告")}catch(l){return!1}1===(await f({url:"/Wallpaper/deleteWallpaper",method:"post",data:{id:e.id}})).code&&(we(),se.value=!1)})(e),size:"18px",color:"#fff"},{default:v((()=>[p(x(w))])),_:2},1032,["onClick"])]),[0,1].includes(e.mime)?(r(),u("a",{key:0,target:"_blank",download:"background",href:e.url,class:"transition-all cursor-pointer mr-2 hover:bg-blue-500 rounded-full w-6 mb-2 flex justify-center items-center"},[p(a,{size:"18px",color:"#fff"},{default:v((()=>[p(x(O))])),_:1})],8,P)):z("",!0)])])])])),_:2},1024)))),128))]),s("div",Y,[p(B,{"page-size":he.value.per_page,onSizeChange:l[1]||(l[1]=e=>Ve("size",e)),onCurrentChange:l[2]||(l[2]=e=>Ve("page",e)),"page-sizes":[15,19,29,49],layout:"sizes,total,prev,pager,jumper",total:he.value.total},null,8,["page-size","total"])])])),[[We,fe.value]])]),p(ze,{modelValue:se.value,"onUpdate:modelValue":l[10]||(l[10]=e=>se.value=e),title:"添加背景壁纸",width:"700"},{default:v((()=>[p(Ue,{modelValue:ce.value,"onUpdate:modelValue":l[9]||(l[9]=e=>ce.value=e),"label-position":"top"},{default:v((()=>[p(ne,{label:"壁纸类型"},{default:v((()=>[p(ie,{modelValue:ce.value.mime,"onUpdate:modelValue":l[3]||(l[3]=e=>ce.value.mime=e),placeholder:"请选择壁纸类型",class:"w-full"},{default:v((()=>[p(ue,{label:"图片壁纸",value:0}),p(ue,{label:"视频壁纸",value:1}),p(ue,{label:"纯色背景",value:2})])),_:1},8,["modelValue"])])),_:1}),0===ce.value.mime?(r(),h(ne,{key:0,label:"壁纸高清原图"},{default:v((()=>[s("div",Z,[ce.value.url?(r(),u("img",{key:0,src:ce.value.url,style:{width:"30px",height:"30px","margin-right":"10px","border-radius":"3px"}},null,8,ee)):z("",!0),p(Ce,{modelValue:ce.value.url,"onUpdate:modelValue":l[4]||(l[4]=e=>ce.value.url=e),placeholder:"请上传横屏的壁纸高清文件或网络链接地址"},{append:v((()=>[p(ge,{headers:{"Up-Type":"AdminBackground"},class:"upload-demo","show-file-list":!1,"on-success":xe,action:x(F)+x(oe).state.site.upload},{default:v((()=>[p(g,{disabled:ce.value.id>0,type:"primary"},{default:v((()=>l[13]||(l[13]=[C("上传")]))),_:1},8,["disabled"])])),_:1},8,["action"])])),_:1},8,["modelValue"])]),l[14]||(l[14]=s("div",{class:"text-xs text-red-400 mt-1"}," 建议过大请压缩后上传,推荐使用图床减轻服务器带宽压力,如果是上传的文件程序会自动裁剪封面 ",-1))])),_:1})):z("",!0),1===ce.value.mime?(r(),h(ne,{key:1,label:"动态壁纸视频文件(mp4格式必须带后缀.mp4))"},{default:v((()=>[s("div",le,[ce.value.url?(r(),u("video",{key:0,autoplay:"",muted:"",loop:"",src:ce.value.url,style:{width:"30px",height:"30px","margin-right":"10px","border-radius":"3px"}},null,8,ae)):z("",!0),p(Ce,{modelValue:ce.value.url,"onUpdate:modelValue":l[5]||(l[5]=e=>ce.value.url=e),placeholder:"请上传横屏的壁纸高清视频文件或网络链接地址,动态壁纸文件推荐使用高速cdn的外链"},{append:v((()=>[p(ge,{class:"upload-demo","show-file-list":!1,"on-success":xe,action:x(F)+"/api/AdminUpload"},{default:v((()=>[p(g,{disabled:ce.value.id>0,type:"primary"},{default:v((()=>l[15]||(l[15]=[C("上传")]))),_:1},8,["disabled"])])),_:1},8,["action"])])),_:1},8,["modelValue"])]),l[16]||(l[16]=s("div",{class:"text-xs text-red-400 mt-1"}," 建议过大请压缩后上传,推荐使用cdn+云储存减轻服务器带宽压力 ",-1))])),_:1})):z("",!0),2===ce.value.mime?(r(),h(ne,{key:2,label:"纯色背景样式值"},{default:v((()=>[s("div",te,[p(Ce,{modelValue:ce.value.url,"onUpdate:modelValue":l[6]||(l[6]=e=>ce.value.url=e),placeholder:"请填写纯色或者渐变色的css样式"},null,8,["modelValue"])]),l[17]||(l[17]=s("div",{class:"text-xs text-red-400 mt-1"},[C(" 颜色值的格式为:linear-gradient(45deg, #12c2e9, #c471ed, #f64f59)"),s("br"),C(" 第一个值为渐变角度,第二个为颜色值,颜色值可以多个,用逗号隔开,"),s("br"),C(" 详细教程参考文档:"),s("a",{style:{color:"#04a3ff","text-decoration":"underline"},href:"https://jmp6y44jr4.k.topthink.com/@mtab/background.html",target:"_blank"},"https://jmp6y44jr4.k.topthink.com/@mtab/background.html")],-1))])),_:1})):z("",!0),2!==ce.value.mime?(r(),h(ne,{key:3,label:"壁纸压缩封面"},{default:v((()=>[s("div",de,[ce.value.cover?(r(),u("img",{key:0,src:ce.value.cover,style:{width:"30px",height:"30px","margin-right":"10px","border-radius":"3px"}},null,8,re)):z("",!0),p(Ce,{modelValue:ce.value.cover,"onUpdate:modelValue":l[7]||(l[7]=e=>ce.value.cover=e),placeholder:"请上传横屏封面文件或网络链接地址"},{append:v((()=>[p(ge,{class:"upload-demo","show-file-list":!1,"on-success":_e,action:x(F)+x(oe).state.site.upload},{default:v((()=>[p(g,{disabled:ce.value.id>0,type:"primary"},{default:v((()=>l[18]||(l[18]=[C("上传")]))),_:1},8,["disabled"])])),_:1},8,["action"])])),_:1},8,["modelValue"])]),l[19]||(l[19]=s("div",{class:"text-xs text-red-400 mt-1"}," 图片尺寸宽度控制在300px左右或(文件大小在100kb左右),推荐使用图床减轻服务器带宽压力 ",-1))])),_:1})):z("",!0),p(ne,{label:"分类"},{default:v((()=>[p(ie,{modelValue:ce.value.folder,"onUpdate:modelValue":l[8]||(l[8]=e=>ce.value.folder=e),placeholder:"分类选择可多选",class:"w-full"},{default:v((()=>[(r(!0),u(i,null,n(ve.value,(e=>(r(),h(ue,{key:e.id,label:e.name,value:e.id},null,8,["label","value"])))),128))])),_:1},8,["modelValue"])])),_:1})])),_:1},8,["modelValue"]),p(g,{type:"primary",class:"w-full",onClick:ke},{default:v((()=>l[20]||(l[20]=[C("保存")]))),_:1})])),_:1},8,["modelValue"])])}}};export{ue as default};
|