From caac3475e1c72fdd9dfc4d832c1ea8794b53efb6 Mon Sep 17 00:00:00 2001 From: Liu YaoWen <576079353@qq.com> Date: Fri, 8 Dec 2023 13:58:27 +0800 Subject: [PATCH] =?UTF-8?q?chore:=20example=E6=9B=B4=E6=96=B0?= MIME-Version: 1.0 Content-Type: text/plain; charset=UTF-8 Content-Transfer-Encoding: 8bit --- docs/assets/PageA.950c057e.js | 1 + docs/assets/PageA.bb9694a5.js | 1 - docs/assets/{PageB.30be8c1e.js => PageB.97751dea.js} | 2 +- docs/assets/api.51d0c053.js | 1 - docs/assets/api.ac58b069.js | 1 + docs/assets/{api.1f0230ce.css => api.e93543f3.css} | 2 +- docs/assets/{index.f6507150.js => index.dd4211c2.js} | 2 +- docs/index.html | 2 +- 8 files changed, 6 insertions(+), 6 deletions(-) create mode 100644 docs/assets/PageA.950c057e.js delete mode 100644 docs/assets/PageA.bb9694a5.js rename docs/assets/{PageB.30be8c1e.js => PageB.97751dea.js} (59%) delete mode 100644 docs/assets/api.51d0c053.js create mode 100644 docs/assets/api.ac58b069.js rename docs/assets/{api.1f0230ce.css => api.e93543f3.css} (52%) rename docs/assets/{index.f6507150.js => index.dd4211c2.js} (71%) diff --git a/docs/assets/PageA.950c057e.js b/docs/assets/PageA.950c057e.js new file mode 100644 index 0000000..06cc8fa --- /dev/null +++ b/docs/assets/PageA.950c057e.js @@ -0,0 +1 @@ +import{g as A,L as B,W as M,l as j,e as E}from"./api.ac58b069.js";import{g as w,l as y,m as I,o as p,c as b,b as n,w as r,a as s,u as o,t as $,n as L,p as O,r as g,d as C,q as F,s as z,v as G,F as H,f as D,x as N}from"./vendor.89609b2d.js";import{_ as P}from"./index.dd4211c2.js";const T={style:{width:"100%"}},R=["onClick"],K={class:"overflow-hidden"},W={class:"px-4 pt-2 pb-4 border-t border-t-gray-800"},q={class:"pb-4 text-gray-50 group-hover:text-yellow-300"},Z={class:"pt-3 flex justify-between items-center border-t border-t-gray-600 border-opacity-50"},J={class:"text-gray-50"},Q=["onClick"],U=w({props:{list:{type:Array},options:{type:Object},pageSize:{type:Number,default:100}},emits:{cardClick:null},setup(a,{emit:h}){const t=a,d=y([]),m=y(1);I(()=>{e()});function e(){A({page:m.value,pageSize:t.pageSize}).then(c=>{d.value.push(...c),m.value+=1})}function f(c,x){d.value.splice(x,1)}function l(c){h("cardClick",c)}function u(c){}function _(c){console.error(`${c}: \u52A0\u8F7D\u5931\u8D25`)}function V(c){}return(c,x)=>(p(),b("div",T,[n(o(M),{list:d.value,"row-key":a.options.rowKey,gutter:a.options.gutter,"has-around-gutter":a.options.hasAroundGutter,width:a.options.width,breakpoints:a.options.breakpoints,"img-selector":a.options.imgSelector,"background-color":a.options.backgroundColor,"animation-effect":a.options.animationEffect,"animation-duration":a.options.animationDuration,"animation-delay":a.options.animationDelay,lazyload:a.options.lazyload,"load-props":a.options.loadProps,"cross-origin":a.options.crossOrigin,align:a.options.align},{item:r(({item:v,url:k,index:i})=>[s("div",{class:"bg-gray-900 rounded-lg shadow-md overflow-hidden transition-all duration-300 ease-linear hover:shadow-lg hover:shadow-gray-600 group",onClick:S=>l(v)},[s("div",K,[n(o(B),{url:k,title:"title",alt:v.name,class:"cursor-pointer transition-all duration-300 ease-linear group-hover:scale-105",onLoad:u,onError:_,onSuccess:V},null,8,["url","alt"])]),s("div",W,[s("h2",q,$(v.name),1),s("div",Z,[s("div",J," $ "+$(v.price),1),s("div",null,[s("button",{class:"px-3 h-7 rounded-full bg-red-500 text-sm text-white shadow-lg transition-all duration-300 hover:bg-red-600",onClick:L(S=>f(v,i),["stop"])}," \u5220\u9664 ",8,Q)])])])],8,R)]),_:1},8,["list","row-key","gutter","has-around-gutter","width","breakpoints","img-selector","background-color","animation-effect","animation-duration","animation-delay","lazyload","load-props","cross-origin","align"]),s("div",{class:"flex justify-center py-10 bg-gray-900"},[s("button",{class:"px-5 py-2 rounded-full bg-gray-700 text-md text-white cursor-pointer hover:bg-gray-800 transition-all duration-300",onClick:e}," \u52A0\u8F7D\u66F4\u591A ")])]))}});const X=w({props:{visible:{type:Boolean},options:{type:Object}},emits:{"update:visible":null},setup(a,{emit:h}){const t=a,d=O({get(){return t.visible},set(m){h("update:visible",m)}});return(m,e)=>{const f=g("el-drawer");return p(),C(f,{modelValue:o(d),"onUpdate:modelValue":e[0]||(e[0]=l=>F(d)?d.value=l:null),size:"50%","with-header":!1},{default:r(()=>[n(U,{"page-size":20,options:a.options},null,8,["options"])]),_:1},8,["modelValue"])}}}),Y={},ee={class:"pb-4 pt-4 flex justify-center bg-gray-900 group",href:"https://github.com/heikaimu/vue3-waterfall-plugin"},oe=s("svg",{class:"h-7 w-7 fill-gray-400 transition-all duration-300 group-hover:fill-gray-200",viewBox:"0 0 16 16",version:"1.1","aria-hidden":"true"},[s("path",{d:"M8 0C3.58 0 0 3.58 0 8C0 11.54 2.29 14.53 5.47 15.59C5.87 15.66 6.02 15.42 6.02 15.21C6.02 15.02 6.01 14.39 6.01 13.72C4 14.09 3.48 13.23 3.32 12.78C3.23 12.55 2.84 11.84 2.5 11.65C2.22 11.5 1.82 11.13 2.49 11.12C3.12 11.11 3.57 11.7 3.72 11.94C4.44 13.15 5.59 12.81 6.05 12.6C6.12 12.08 6.33 11.73 6.56 11.53C4.78 11.33 2.92 10.64 2.92 7.58C2.92 6.71 3.23 5.99 3.74 5.43C3.66 5.23 3.38 4.41 3.82 3.31C3.82 3.31 4.49 3.1 6.02 4.13C6.66 3.95 7.34 3.86 8.02 3.86C8.7 3.86 9.38 3.95 10.02 4.13C11.55 3.09 12.22 3.31 12.22 3.31C12.66 4.41 12.38 5.23 12.3 5.43C12.81 5.99 13.12 6.7 13.12 7.58C13.12 10.65 11.25 11.33 9.47 11.53C9.76 11.78 10.01 12.26 10.01 13.01C10.01 14.08 10 14.94 10 15.21C10 15.42 10.15 15.67 10.55 15.59C13.71 14.53 16 11.53 16 8C16 3.58 12.42 0 8 0Z"})],-1),te=[oe];function le(a,h){return p(),b("a",ee,te)}var ne=P(Y,[["render",le]]);const ae=D(" \u6392\u7248 "),ie=D(" \u52A8\u753B "),se=w({props:{form:{type:Object,default:()=>{}}},setup(a){const t=z(a.form),d=y([{label:"fadeIn",value:"fadeIn"},{label:"fadeInUp",value:"animate__fadeInUp"},{label:"fadeInDown",value:"animate__fadeInDown"},{label:"zoomIn",value:"animate__zoomIn"}]);return(m,e)=>{const f=g("el-input"),l=g("el-form-item"),u=g("el-divider"),_=g("el-input-number"),V=g("el-switch"),c=g("el-option"),x=g("el-select"),v=g("el-color-picker"),k=g("el-form");return p(),C(k,{size:"small","label-position":"top"},{default:r(()=>[n(l,{label:"imgSelector"},{default:r(()=>[n(f,{modelValue:o(t).imgSelector,"onUpdate:modelValue":e[0]||(e[0]=i=>o(t).imgSelector=i),disabled:""},null,8,["modelValue"])]),_:1}),n(u,{"content-position":"left"},{default:r(()=>[ae]),_:1}),n(l,{label:"width"},{default:r(()=>[n(_,{modelValue:o(t).width,"onUpdate:modelValue":e[1]||(e[1]=i=>o(t).width=i),min:0,step:10,style:{width:"100%"}},null,8,["modelValue"])]),_:1}),n(l,{label:"gutter"},{default:r(()=>[n(_,{modelValue:o(t).gutter,"onUpdate:modelValue":e[2]||(e[2]=i=>o(t).gutter=i),min:0,step:2,style:{width:"100%"}},null,8,["modelValue"])]),_:1}),n(l,{label:"hasAroundGutter"},{default:r(()=>[n(V,{modelValue:o(t).hasAroundGutter,"onUpdate:modelValue":e[3]||(e[3]=i=>o(t).hasAroundGutter=i)},null,8,["modelValue"])]),_:1}),n(u,{"content-position":"left"},{default:r(()=>[ie]),_:1}),n(l,{label:"animationEffect"},{default:r(()=>[n(x,{modelValue:o(t).animationEffect,"onUpdate:modelValue":e[4]||(e[4]=i=>o(t).animationEffect=i),placeholder:"\u8BF7\u9009\u62E9",style:{width:"100%"}},{default:r(()=>[(p(!0),b(H,null,G(d.value,i=>(p(),C(c,{key:i.value,label:i.label,value:i.value},null,8,["label","value"]))),128))]),_:1},8,["modelValue"])]),_:1}),n(l,{label:"animationDuration"},{default:r(()=>[n(_,{modelValue:o(t).animationDuration,"onUpdate:modelValue":e[5]||(e[5]=i=>o(t).animationDuration=i),min:0,step:100,style:{width:"100%"}},null,8,["modelValue"])]),_:1}),n(l,{label:"animationDelay"},{default:r(()=>[n(_,{modelValue:o(t).animationDelay,"onUpdate:modelValue":e[6]||(e[6]=i=>o(t).animationDelay=i),min:0,step:100,style:{width:"100%"}},null,8,["modelValue"])]),_:1}),n(l,{label:"backgroundColor"},{default:r(()=>[n(v,{modelValue:o(t).backgroundColor,"onUpdate:modelValue":e[7]||(e[7]=i=>o(t).backgroundColor=i)},null,8,["modelValue"])]),_:1})]),_:1})}}}),re={class:"h-screen flex overflow-hidden"},ue={class:"flex-auto overflow-y-auto"},de={class:"h-full flex flex-col justify-between"},ce={class:"p-4 border-b border-b-gray-100 shadow-md"},pe=s("svg",{xmlns:"http://www.w3.org/2000/svg",class:"h-5 w-5",viewBox:"0 0 20 20",fill:"currentColor"},[s("path",{"fill-rule":"evenodd",d:"M3 5a1 1 0 011-1h12a1 1 0 110 2H4a1 1 0 01-1-1zM3 10a1 1 0 011-1h12a1 1 0 110 2H4a1 1 0 01-1-1zM3 15a1 1 0 011-1h12a1 1 0 110 2H4a1 1 0 01-1-1z","clip-rule":"evenodd"})],-1),me=[pe],fe=s("svg",{xmlns:"http://www.w3.org/2000/svg",class:"h-5 w-5",viewBox:"0 0 20 20",fill:"currentColor"},[s("path",{"fill-rule":"evenodd",d:"M3 5a1 1 0 011-1h12a1 1 0 110 2H4a1 1 0 01-1-1zM3 10a1 1 0 011-1h12a1 1 0 110 2H4a1 1 0 01-1-1zM3 15a1 1 0 011-1h12a1 1 0 110 2H4a1 1 0 01-1-1z","clip-rule":"evenodd"})],-1),ge=[fe],he={class:"p-4 flex-auto overflow-y-auto"},_e=w({setup(a){function h(){const f=y(!0);function l(u){f.value=u}return{isOpen:f,handleToggleController:l}}const{isOpen:t,handleToggleController:d}=h(),m=z({rowKey:"id",gutter:10,hasAroundGutter:!0,width:320,breakpoints:{1200:{rowPerView:4},800:{rowPerView:3},500:{rowPerView:2}},animationEffect:"animate__fadeInUp",animationDuration:1e3,animationDelay:300,backgroundColor:"#2C2E3A",imgSelector:"src.original",loadProps:{loading:j,error:E,ratioCalculator:(f,l)=>{const u=3/4,_=4/3;return Math.random()>.5?u:_}},lazyload:!0,align:"right"}),e=y(!1);return(f,l)=>(p(),b("div",re,[n(X,{visible:e.value,"onUpdate:visible":l[0]||(l[0]=u=>e.value=u),options:o(m)},null,8,["visible","options"]),s("div",ue,[n(U,{options:o(m),onCardClick:l[1]||(l[1]=u=>e.value=!0)},null,8,["options"])]),s("div",de,[s("div",ce,[o(t)?(p(),b("span",{key:0,onClick:l[2]||(l[2]=u=>o(d)(!1))},me)):(p(),b("span",{key:1,onClick:l[3]||(l[3]=u=>o(d)(!0))},ge))]),s("div",he,[o(t)?(p(),C(se,{key:0,form:o(m)},null,8,["form"])):N("",!0)]),n(ne)])]))}}),ye=w({setup(a){return(h,t)=>(p(),C(_e))}});export{ye as default}; diff --git a/docs/assets/PageA.bb9694a5.js b/docs/assets/PageA.bb9694a5.js deleted file mode 100644 index 9d3bf2c..0000000 --- a/docs/assets/PageA.bb9694a5.js +++ /dev/null @@ -1 +0,0 @@ -import{g as A,L as B,W as j,l as E,e as I}from"./api.51d0c053.js";import{g as w,l as y,m as M,o as p,c as b,b as l,w as r,a as s,u as o,t as $,n as L,p as O,r as f,d as C,q as F,s as z,v as G,F as H,f as D,x as N}from"./vendor.89609b2d.js";import{_ as P}from"./index.f6507150.js";const T={style:{width:"100%"}},K=["onClick"],W={class:"overflow-hidden"},q={class:"px-4 pt-2 pb-4 border-t border-t-gray-800"},R={class:"pb-4 text-gray-50 group-hover:text-yellow-300"},Z={class:"pt-3 flex justify-between items-center border-t border-t-gray-600 border-opacity-50"},J={class:"text-gray-50"},Q=["onClick"],U=w({props:{list:{type:Array},options:{type:Object},pageSize:{type:Number,default:100}},emits:{cardClick:null},setup(n,{emit:_}){const t=n,u=y([]),m=y(1);M(()=>{e()});function e(){A({page:m.value,pageSize:t.pageSize}).then(c=>{u.value.push(...c),m.value+=1})}function g(c,x){u.value.splice(x,1)}function a(c){_("cardClick",c)}function d(c){}function h(c){console.error(`${c}: \u52A0\u8F7D\u5931\u8D25`)}function V(c){}return(c,x)=>(p(),b("div",T,[l(o(j),{list:u.value,"row-key":n.options.rowKey,gutter:n.options.gutter,"has-around-gutter":n.options.hasAroundGutter,width:n.options.width,breakpoints:n.options.breakpoints,"img-selector":n.options.imgSelector,"background-color":n.options.backgroundColor,"animation-effect":n.options.animationEffect,"animation-duration":n.options.animationDuration,"animation-delay":n.options.animationDelay,lazyload:n.options.lazyload,"load-props":n.options.loadProps,"cross-origin":n.options.crossOrigin,align:n.options.align},{item:r(({item:v,url:k,index:i})=>[s("div",{class:"bg-gray-900 rounded-lg shadow-md overflow-hidden transition-all duration-300 ease-linear hover:shadow-lg hover:shadow-gray-600 group",onClick:S=>a(v)},[s("div",W,[l(o(B),{url:k,title:"title",alt:v.name,class:"cursor-pointer transition-all duration-300 ease-linear group-hover:scale-105",onLoad:d,onError:h,onSuccess:V},null,8,["url","alt"])]),s("div",q,[s("h2",R,$(v.name),1),s("div",Z,[s("div",J," $ "+$(v.price),1),s("div",null,[s("button",{class:"px-3 h-7 rounded-full bg-red-500 text-sm text-white shadow-lg transition-all duration-300 hover:bg-red-600",onClick:L(S=>g(v,i),["stop"])}," \u5220\u9664 ",8,Q)])])])],8,K)]),_:1},8,["list","row-key","gutter","has-around-gutter","width","breakpoints","img-selector","background-color","animation-effect","animation-duration","animation-delay","lazyload","load-props","cross-origin","align"]),s("div",{class:"flex justify-center py-10 bg-gray-900"},[s("button",{class:"px-5 py-2 rounded-full bg-gray-700 text-md text-white cursor-pointer hover:bg-gray-800 transition-all duration-300",onClick:e}," \u52A0\u8F7D\u66F4\u591A ")])]))}});const X=w({props:{visible:{type:Boolean},options:{type:Object}},emits:{"update:visible":null},setup(n,{emit:_}){const t=n,u=O({get(){return t.visible},set(m){_("update:visible",m)}});return(m,e)=>{const g=f("el-drawer");return p(),C(g,{modelValue:o(u),"onUpdate:modelValue":e[0]||(e[0]=a=>F(u)?u.value=a:null),size:"50%","with-header":!1},{default:r(()=>[l(U,{"page-size":20,options:n.options},null,8,["options"])]),_:1},8,["modelValue"])}}}),Y={},ee={class:"pb-4 pt-4 flex justify-center bg-gray-900 group",href:"https://github.com/heikaimu/vue3-waterfall-plugin"},oe=s("svg",{class:"h-7 w-7 fill-gray-400 transition-all duration-300 group-hover:fill-gray-200",viewBox:"0 0 16 16",version:"1.1","aria-hidden":"true"},[s("path",{d:"M8 0C3.58 0 0 3.58 0 8C0 11.54 2.29 14.53 5.47 15.59C5.87 15.66 6.02 15.42 6.02 15.21C6.02 15.02 6.01 14.39 6.01 13.72C4 14.09 3.48 13.23 3.32 12.78C3.23 12.55 2.84 11.84 2.5 11.65C2.22 11.5 1.82 11.13 2.49 11.12C3.12 11.11 3.57 11.7 3.72 11.94C4.44 13.15 5.59 12.81 6.05 12.6C6.12 12.08 6.33 11.73 6.56 11.53C4.78 11.33 2.92 10.64 2.92 7.58C2.92 6.71 3.23 5.99 3.74 5.43C3.66 5.23 3.38 4.41 3.82 3.31C3.82 3.31 4.49 3.1 6.02 4.13C6.66 3.95 7.34 3.86 8.02 3.86C8.7 3.86 9.38 3.95 10.02 4.13C11.55 3.09 12.22 3.31 12.22 3.31C12.66 4.41 12.38 5.23 12.3 5.43C12.81 5.99 13.12 6.7 13.12 7.58C13.12 10.65 11.25 11.33 9.47 11.53C9.76 11.78 10.01 12.26 10.01 13.01C10.01 14.08 10 14.94 10 15.21C10 15.42 10.15 15.67 10.55 15.59C13.71 14.53 16 11.53 16 8C16 3.58 12.42 0 8 0Z"})],-1),te=[oe];function le(n,_){return p(),b("a",ee,te)}var ne=P(Y,[["render",le]]);const ae=D(" \u6392\u7248 "),ie=D(" \u52A8\u753B "),se=w({props:{form:{type:Object,default:()=>{}}},setup(n){const t=z(n.form),u=y([{label:"fadeIn",value:"fadeIn"},{label:"fadeInUp",value:"animate__fadeInUp"},{label:"fadeInDown",value:"animate__fadeInDown"},{label:"zoomIn",value:"animate__zoomIn"}]);return(m,e)=>{const g=f("el-input"),a=f("el-form-item"),d=f("el-divider"),h=f("el-input-number"),V=f("el-switch"),c=f("el-option"),x=f("el-select"),v=f("el-color-picker"),k=f("el-form");return p(),C(k,{size:"small","label-position":"top"},{default:r(()=>[l(a,{label:"imgSelector"},{default:r(()=>[l(g,{modelValue:o(t).imgSelector,"onUpdate:modelValue":e[0]||(e[0]=i=>o(t).imgSelector=i),disabled:""},null,8,["modelValue"])]),_:1}),l(d,{"content-position":"left"},{default:r(()=>[ae]),_:1}),l(a,{label:"width"},{default:r(()=>[l(h,{modelValue:o(t).width,"onUpdate:modelValue":e[1]||(e[1]=i=>o(t).width=i),min:0,step:10,style:{width:"100%"}},null,8,["modelValue"])]),_:1}),l(a,{label:"gutter"},{default:r(()=>[l(h,{modelValue:o(t).gutter,"onUpdate:modelValue":e[2]||(e[2]=i=>o(t).gutter=i),min:0,step:2,style:{width:"100%"}},null,8,["modelValue"])]),_:1}),l(a,{label:"hasAroundGutter"},{default:r(()=>[l(V,{modelValue:o(t).hasAroundGutter,"onUpdate:modelValue":e[3]||(e[3]=i=>o(t).hasAroundGutter=i)},null,8,["modelValue"])]),_:1}),l(d,{"content-position":"left"},{default:r(()=>[ie]),_:1}),l(a,{label:"animationEffect"},{default:r(()=>[l(x,{modelValue:o(t).animationEffect,"onUpdate:modelValue":e[4]||(e[4]=i=>o(t).animationEffect=i),placeholder:"\u8BF7\u9009\u62E9",style:{width:"100%"}},{default:r(()=>[(p(!0),b(H,null,G(u.value,i=>(p(),C(c,{key:i.value,label:i.label,value:i.value},null,8,["label","value"]))),128))]),_:1},8,["modelValue"])]),_:1}),l(a,{label:"animationDuration"},{default:r(()=>[l(h,{modelValue:o(t).animationDuration,"onUpdate:modelValue":e[5]||(e[5]=i=>o(t).animationDuration=i),min:0,step:100,style:{width:"100%"}},null,8,["modelValue"])]),_:1}),l(a,{label:"animationDelay"},{default:r(()=>[l(h,{modelValue:o(t).animationDelay,"onUpdate:modelValue":e[6]||(e[6]=i=>o(t).animationDelay=i),min:0,step:100,style:{width:"100%"}},null,8,["modelValue"])]),_:1}),l(a,{label:"backgroundColor"},{default:r(()=>[l(v,{modelValue:o(t).backgroundColor,"onUpdate:modelValue":e[7]||(e[7]=i=>o(t).backgroundColor=i)},null,8,["modelValue"])]),_:1})]),_:1})}}}),re={class:"h-screen flex overflow-hidden"},ue={class:"flex-auto overflow-y-auto"},de={class:"h-full flex flex-col justify-between"},ce={class:"p-4 border-b border-b-gray-100 shadow-md"},pe=s("svg",{xmlns:"http://www.w3.org/2000/svg",class:"h-5 w-5",viewBox:"0 0 20 20",fill:"currentColor"},[s("path",{"fill-rule":"evenodd",d:"M3 5a1 1 0 011-1h12a1 1 0 110 2H4a1 1 0 01-1-1zM3 10a1 1 0 011-1h12a1 1 0 110 2H4a1 1 0 01-1-1zM3 15a1 1 0 011-1h12a1 1 0 110 2H4a1 1 0 01-1-1z","clip-rule":"evenodd"})],-1),me=[pe],fe=s("svg",{xmlns:"http://www.w3.org/2000/svg",class:"h-5 w-5",viewBox:"0 0 20 20",fill:"currentColor"},[s("path",{"fill-rule":"evenodd",d:"M3 5a1 1 0 011-1h12a1 1 0 110 2H4a1 1 0 01-1-1zM3 10a1 1 0 011-1h12a1 1 0 110 2H4a1 1 0 01-1-1zM3 15a1 1 0 011-1h12a1 1 0 110 2H4a1 1 0 01-1-1z","clip-rule":"evenodd"})],-1),ge=[fe],_e={class:"p-4 flex-auto overflow-y-auto"},ve=w({setup(n){function _(){const g=y(!0);function a(d){g.value=d}return{isOpen:g,handleToggleController:a}}const{isOpen:t,handleToggleController:u}=_(),m=z({rowKey:"id",gutter:10,hasAroundGutter:!0,width:320,breakpoints:{1200:{rowPerView:4},800:{rowPerView:3},500:{rowPerView:2}},animationEffect:"animate__fadeInUp",animationDuration:1e3,animationDelay:300,backgroundColor:"#2C2E3A",imgSelector:"src.original",loadProps:{loading:E,error:I},lazyload:!0,align:"right"}),e=y(!1);return(g,a)=>(p(),b("div",re,[l(X,{visible:e.value,"onUpdate:visible":a[0]||(a[0]=d=>e.value=d),options:o(m)},null,8,["visible","options"]),s("div",ue,[l(U,{options:o(m),onCardClick:a[1]||(a[1]=d=>e.value=!0)},null,8,["options"])]),s("div",de,[s("div",ce,[o(t)?(p(),b("span",{key:0,onClick:a[2]||(a[2]=d=>o(u)(!1))},me)):(p(),b("span",{key:1,onClick:a[3]||(a[3]=d=>o(u)(!0))},ge))]),s("div",_e,[o(t)?(p(),C(se,{key:0,form:o(m)},null,8,["form"])):N("",!0)]),l(ne)])]))}}),ye=w({setup(n){return(_,t)=>(p(),C(ve))}});export{ye as default}; diff --git a/docs/assets/PageB.30be8c1e.js b/docs/assets/PageB.97751dea.js similarity index 59% rename from docs/assets/PageB.30be8c1e.js rename to docs/assets/PageB.97751dea.js index 75e5495..4a4b340 100644 --- a/docs/assets/PageB.30be8c1e.js +++ b/docs/assets/PageB.97751dea.js @@ -1 +1 @@ -import{l as C,e as L,L as P,W as x,g as z}from"./api.51d0c053.js";import{_ as S}from"./index.f6507150.js";import{g as B,s as D,m as E,c as l,b as g,w as V,u as e,a as t,F as A,v as I,l as d,o as c,t as p,I as M}from"./vendor.89609b2d.js";const j={class:"page-b-content"},F={class:"bg-gray-900 rounded-lg shadow-md overflow-hidden transition-all duration-300 ease-linear hover:shadow-lg hover:shadow-gray-600 group"},G={class:"overflow-hidden"},K={class:"px-4 pt-2 pb-4 border-t border-t-gray-800"},N={class:"pb-4 text-gray-50 group-hover:text-yellow-300"},W={class:"page-menus"},$=["onClick"],O=B({setup(U){const _=function(){const r=d([1,2,3,4,5]),s=d(1),a=d([]);function n(i){s.value=i,u()}function u(){z({page:s.value,pageSize:40}).then(i=>{a.value=i})}return{list:a,page:s,pages:r,handleLoadMore:u,handleChangePage:n}},o=D({rowKey:"id",gutter:10,hasAroundGutter:!0,width:320,breakpoints:{1200:{rowPerView:4},800:{rowPerView:3},500:{rowPerView:2}},animationEffect:"animate__fadeInUp",animationDuration:1e3,animationDelay:300,backgroundColor:"#2C2E3A",imgSelector:"src.original",loadProps:{loading:C,error:L},lazyload:!0,crossOrigin:!0}),{list:h,page:m,pages:v,handleLoadMore:f,handleChangePage:w}=_();E(()=>{f()});function y(r){}function b(r){console.error(`${r}: \u52A0\u8F7D\u5931\u8D25`)}function k(r){}return(r,s)=>(c(),l("div",j,[g(e(x),{list:e(h),"row-key":e(o).rowKey,gutter:e(o).gutter,"has-around-gutter":e(o).hasAroundGutter,width:e(o).width,breakpoints:e(o).breakpoints,"img-selector":e(o).imgSelector,"background-color":e(o).backgroundColor,lazyload:e(o).lazyload,"load-props":e(o).loadProps},{item:V(({item:a,url:n})=>[t("div",F,[t("div",G,[g(e(P),{url:n,class:"cursor-pointer transition-all duration-300 ease-linear group-hover:scale-105",onLoad:y,onError:b,onSuccess:k},null,8,["url"])]),t("div",K,[t("h2",N,p(a.name),1)])])]),_:1},8,["list","row-key","gutter","has-around-gutter","width","breakpoints","img-selector","background-color","lazyload","load-props"]),t("div",W,[(c(!0),l(A,null,I(e(v),a=>(c(),l("p",{key:a,class:M(["page-menus__item",{active:a===e(m)}]),onClick:n=>e(w)(a)},p(a),11,$))),128))])]))}});var Q=S(O,[["__scopeId","data-v-2cbce89c"]]);export{Q as default}; +import{l as C,e as L,L as P,W as x,g as z}from"./api.ac58b069.js";import{_ as S}from"./index.dd4211c2.js";import{g as B,s as D,m as E,c as l,b as g,w as V,u as e,a as t,F as A,v as I,l as d,o as c,t as p,I as M}from"./vendor.89609b2d.js";const j={class:"page-b-content"},F={class:"bg-gray-900 rounded-lg shadow-md overflow-hidden transition-all duration-300 ease-linear hover:shadow-lg hover:shadow-gray-600 group"},G={class:"overflow-hidden"},K={class:"px-4 pt-2 pb-4 border-t border-t-gray-800"},N={class:"pb-4 text-gray-50 group-hover:text-yellow-300"},W={class:"page-menus"},$=["onClick"],O=B({setup(U){const _=function(){const r=d([1,2,3,4,5]),s=d(1),o=d([]);function n(i){s.value=i,u()}function u(){z({page:s.value,pageSize:40}).then(i=>{o.value=i})}return{list:o,page:s,pages:r,handleLoadMore:u,handleChangePage:n}},a=D({rowKey:"id",gutter:10,hasAroundGutter:!0,width:320,breakpoints:{1200:{rowPerView:4},800:{rowPerView:3},500:{rowPerView:2}},animationEffect:"animate__fadeInUp",animationDuration:1e3,animationDelay:300,backgroundColor:"#2C2E3A",imgSelector:"src.original",loadProps:{loading:C,error:L},lazyload:!0,crossOrigin:!0}),{list:h,page:m,pages:v,handleLoadMore:w,handleChangePage:f}=_();E(()=>{w()});function y(r){}function b(r){console.error(`${r}: \u52A0\u8F7D\u5931\u8D25`)}function k(r){}return(r,s)=>(c(),l("div",j,[g(e(x),{list:e(h),"row-key":e(a).rowKey,gutter:e(a).gutter,"has-around-gutter":e(a).hasAroundGutter,width:e(a).width,breakpoints:e(a).breakpoints,"img-selector":e(a).imgSelector,"background-color":e(a).backgroundColor,lazyload:e(a).lazyload,"load-props":e(a).loadProps},{item:V(({item:o,url:n})=>[t("div",F,[t("div",G,[g(e(P),{url:n,class:"cursor-pointer transition-all duration-300 ease-linear group-hover:scale-105",onLoad:y,onError:b,onSuccess:k},null,8,["url"])]),t("div",K,[t("h2",N,p(o.name),1)])])]),_:1},8,["list","row-key","gutter","has-around-gutter","width","breakpoints","img-selector","background-color","lazyload","load-props"]),t("div",W,[(c(!0),l(A,null,I(e(v),o=>(c(),l("p",{key:o,class:M(["page-menus__item",{active:o===e(m)}]),onClick:n=>e(f)(o)},p(o),11,$))),128))])]))}});var Q=S(O,[["__scopeId","data-v-2cbce89c"]]);export{Q as default}; diff --git a/docs/assets/api.51d0c053.js b/docs/assets/api.51d0c053.js deleted file mode 100644 index 225a1a1..0000000 --- a/docs/assets/api.51d0c053.js +++ /dev/null @@ -1 +0,0 @@ -import{l as m,y as k,p,g as N,z,A as V,B as X,C as J,o as w,c as b,F as q,v as $,a as O,D as tt,E as et,G as F,m as nt,H as rt}from"./vendor.89609b2d.js";import{_ as D}from"./index.f6507150.js";var Mt="data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAADAAAAAwCAYAAABXAvmHAAAAAXNSR0IArs4c6QAABNBJREFUaEPtmV1oXEUUx//n3g1JRGqL9k1RsFq/6IMgSky8c2YTQyONiojWYumTQrWKSNH6oO1TS1EQFcTiQwsaK4qIbVdod+/M3Y0IteJDwVr1oVYFEfFFwUY2c2TCbrhZNptNduvuQgf2Ze85M+c359w5Z84l9PigHrcflwCqHrTWsoiUmLn8f3q1bR4wxggRlZxz00EQlCowf19smLYAxHF8NxFNA/gUgAKwGsApD5GC+eNiwLQL4GUi2gNgDIA31ENEKZhzIvK5h5mZmZkeHx//uV0wbQEwxpQADDPzgvny+fyNYRhO1MB42w9674RhWIqi6IdWYFoGMMbcBuA0ER1RSk3GcbyViB4HcBTAMWb+0RtYKpXWlMvlSSKaFBFdCTP/yIrIRxWY08uFaQfAswAeAPAaMx81xhwmojVpQ0TkSxH5QGt9tvp/kiQTzrlJAOsroeYfnXPOHQrD8JhS6qtmYFoGaGaRRjKFQuF6IhononsB+N9gSv4ggENKqYSIpN48cwCFQmF3EARPt2rMcvWZ+ao4ju/TWh+r6hpjRkVkYwXIh+d8qvEw/f39Hw4NDf1T/TMN8AqA/HKNWKk8EWmlVFjZvG0iUiSiIjO/W52zWCyuLZfLm4hoE4DxlHfmQi2bze6uBbih+tKt1LBm9Ky17wN4NAXgN29uiMi/HsS/2FrrA+n5isXi7bOzsx5mdyaTWT8yMvJ9XQC/K80YshIZv2uNAOrM+bWIHKjCWGuPi8g9zDzgZesC+LJgJcYtpeOc27MCAD/taWbeYIy5i4gKzjnvnW29BLCLmfcZY54H8GoQBONRFB3vGYByuXzt2NjYeWPMJwAeTGf8rg8hIvpTKXVlHMe3AogBnNFa+1prbnQ9gIi8rbXeHsfxE0T0DhE9qZSaP526HgDACDNPW2sPicjWvr6+VcPDw3/1jAd8vJ84ceKKTCbjj1NordelT7tu98BRZt5krd0sIlNEtFcp9VLPAIjIFq31lDHmLQBPBUGwIYqiBSV3xz1gjPFlRN3MXz0ujTHf+LKbmS+rTZZdC0BEJ5VSdxYKBR0EQYGIppRSW3oGAEA1++4F8KK/ySmljvQMQDX7Wmt9ZeqP0rqXr24NoZ+Y+TpjzDoiOuvvCszM9YrFbgV4nZmfi+N4JxHtJ6JnlFJv9hLAXPY1xuQAbASwlpnrNsY67oHKlXL+RgbgAjMP5nK5/oGBgd+DIPhNKeU7F3VHxwFq80Cl/fKYMeYRAIdFZL/W+oWeAQDwMDN/7PtLADzEHcx8qmcAUtn3FxFZrbW+vNFVteMhFMexj+/7faKqxP9okiRDzrkvALzHzL5NuejoOEDasiRJJqMo+sxau19EdgZB8FAURf4auTyARgrteJZuq9SbzxhzBsBNi2XfJcvpdhjZaI5GAEmSXOOcO09EsVIqu5QtHe/M1Rpord0hIm8A2MHM/h7QcHQjQMF/P3DOXZ3NZn/teoBKJr4AYLpSPviu4HfMfPNSxvvnCzzgnNvejFKrMmEYDi/S3LWVjx37mHlXM+vUhlAzOm2RISLnu9N+slwut2pwcHCCiCZExH+5mchmsyebWWgOwBgz3+lqRqldMszsd3zByOfzt4yOjn7b7Bod/8TUrKGLyV0CaHUHW9X/D9N93V6azvezAAAAAElFTkSuQmCC",Lt="data:image/png;base64,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";const ot=({breakpoints:t,wrapperWidth:e,gutter:n,hasAroundGutter:r,initWidth:o})=>{const s=Object.keys(t).map(c=>Number(c)).sort((c,A)=>c-A);let i=e,a=!1;for(const c of s)if(e<=c){i=c,a=!0;break}if(!a)return o;const u=t[i].rowPerView;return r?(e-n)/u-n:(e-(u-1)*n)/u};function it(t){const e=m(0),n=m(null);k(n,i=>{const a=i[0],{width:u}=a.contentRect;e.value=u});const r=p(()=>ot({wrapperWidth:e.value,breakpoints:t.breakpoints,gutter:t.gutter,hasAroundGutter:t.hasAroundGutter,initWidth:t.width})),o=p(()=>{const i=t.hasAroundGutter?-t.gutter:t.gutter;return Math.floor((e.value+i)/(r.value+t.gutter))}),s=p(()=>{if(t.align==="left")return 0;if(t.align==="center"){const i=t.hasAroundGutter?t.gutter:-t.gutter,a=o.value*(r.value+t.gutter)+i;return(e.value-a)/2}else{const i=t.hasAroundGutter?t.gutter:-t.gutter,a=o.value*(r.value+t.gutter)+i;return e.value-a}});return{waterfallWrapper:n,wrapperWidth:e,colWidth:r,cols:o,offsetX:s}}function _(t,e){return new RegExp(`(^|\\s)${e}(\\s|$)`).test(t.className)}function j(t,e){if(_(t,e))return;const n=t.className.split(/\s+/);n.push(e),t.className=n.join(" ")}const st=document.createElement("div").style,R=(()=>{const t={webkit:"webkitTransform",Moz:"MozTransform",O:"OTransform",ms:"msTransform",standard:"transform"};for(const e in t){const n=t[e];if(st[n]!==void 0)return e}return!1})();function h(t){return R===!1?!1:R==="standard"?t:R+t.charAt(0).toUpperCase()+t.substr(1)}const B=h("transform"),M=h("animation-duration"),L=h("animation-delay"),x=h("transition"),C=h("animation-fill-mode");function at(t,e,n,r,o){const s=m([]),i=m(0),a=l=>{const f=t.hasAroundGutter?l+1:l;return t.gutter*f+e.value*l+r.value},u=()=>{s.value=new Array(n.value).fill(t.hasAroundGutter?t.gutter:0)},c=ut(t);return{wrapperHeight:i,layoutHandle:async()=>{u();const l=[];if(o&&o.value&&o.value.childNodes.forEach(f=>{f.className==="waterfall-item"&&l.push(f)}),l.length===0)return!1;for(let f=0;f{const Z=t.animationDuration/1e3;x&&(E[x]=`transform ${Z}s`)})}i.value=Math.max.apply(null,s.value)}}}function ut(t){return(e,n)=>{const r=e.firstChild;if(r&&!_(r,t.animationPrefix)){const o=`${t.animationDuration/1e3}s`,s=`${t.animationDelay/1e3}s`,i=r.style;i.visibility="visible",M&&(i[M]=o),L&&(i[L]=s),C&&(i[C]="both"),j(r,t.animationPrefix),j(r,t.animationEffect),n&&setTimeout(()=>{n()},t.animationDuration+t.animationDelay)}}}const ct=typeof window!="undefined"&&window!==null,P=dt(),lt=Object.prototype.propertyIsEnumerable,T=Object.getOwnPropertySymbols;function ft(t,...e){return e.map(r=>r.replace(/\[(\w+)\]/g,".$1").split(".").reduce((o,s)=>o&&o[s],t))}function dt(){return ct&&"IntersectionObserver"in window&&"IntersectionObserverEntry"in window&&"intersectionRatio"in window.IntersectionObserverEntry.prototype?("isIntersecting"in window.IntersectionObserverEntry.prototype||Object.defineProperty(window.IntersectionObserverEntry.prototype,"isIntersecting",{get(){return this.intersectionRatio>0}}),!0):!1}function y(t){return typeof t=="function"||toString.call(t)==="[object Object]"}function At(t){return typeof t=="object"?t===null:typeof t!="function"}function mt(t){return t!=="__proto__"&&t!=="constructor"&&t!=="prototype"}function gt(t,...e){if(!y(t))throw new TypeError("expected the first argument to be an object");if(e.length===0||typeof Symbol!="function"||typeof T!="function")return t;for(const n of e){const r=T(n);for(const o of r)lt.call(n,o)&&(t[o]=n[o])}return t}function G(t,...e){let n=0;for(At(t)&&(t=e[n++]),t||(t={});n{const o=new Image;o.onload=()=>{n(o)},o.onerror=()=>{r(new Error("Image load error"))},e&&(o.crossOrigin="Anonymous"),o.src=t})}var g;(function(t){t.LOADING="loading",t.LOADED="loaded",t.ERROR="error"})(g||(g={}));const ht={rootMargin:"0px",threshold:0},K="data:image/gif;base64,R0lGODlhAQABAIAAAAAAAP///yH5BAEAAAAALAAAAAABAAEAAAIBRAA7",yt="";class vt{constructor(e=!0,n,r=!0){this.lazyActive=!0,this.crossOrigin=!0,this.options={loading:K,error:yt,observerOptions:ht,log:!0},this._images=new WeakMap,this.lazyActive=e,this.crossOrigin=r,this.config(n)}config(e={}){G(this.options,e)}mount(e,n,r){const{src:o,loading:s,error:i}=this._valueFormatter(n);e.setAttribute("lazy",g.LOADING),e.setAttribute("src",s||K),this.lazyActive?(P||(this._setImageSrc(e,o,r,i),this._log(()=>{throw new Error("Not support IntersectionObserver!")})),this._initIntersectionObserver(e,o,r,i)):this._setImageSrc(e,o,r,i)}resize(e,n){const r=e.getAttribute("lazy"),o=e.getAttribute("src");r&&r===g.LOADED&&o&&H(o,this.crossOrigin).then(s=>{const{width:i,height:a}=s,u=e.width/i*a;e.height=u;const c=e.style;c.height=`${u}px`,n()})}unmount(e){const n=this._realObserver(e);n&&n.unobserve(e),this._images.delete(e)}_setImageSrc(e,n,r,o){!n||e.getAttribute("src")===n||H(n,this.crossOrigin).then(i=>{const{width:a,height:u}=i,c=u/a,A=e.parentNode.parentNode;A.style.paddingBottom=`${c*100}%`,e.setAttribute("lazy",g.LOADED),e.removeAttribute("src"),e.setAttribute("src",n),r(!0)}).catch(()=>{const i=this._realObserver(e);i&&i.disconnect(),o&&(e.setAttribute("lazy",g.ERROR),e.setAttribute("src",o),r(!1)),this._log(()=>{throw new Error(`Image failed to load!And failed src was: ${n} `)})})}_isOpenLazy(){return P&&this.lazyActive}_initIntersectionObserver(e,n,r,o){const s=this.options.observerOptions;this._images.set(e,new IntersectionObserver(a=>{Array.prototype.forEach.call(a,u=>{if(u.isIntersecting){const c=this._realObserver(e);c&&c.unobserve(u.target),this._setImageSrc(e,n,r,o)}})},s));const i=this._realObserver(e);i&&i.observe(e)}_valueFormatter(e){let n=e,r=this.options.loading,o=this.options.error;return y(e)&&(n=e.src,r=e.loading||this.options.loading,o=e.error||this.options.error),{src:n,loading:r,error:o}}_log(e){this.options.log&&e()}_realObserver(e){return this._images.get(e)}}const I=N({props:{list:{type:Array,default:()=>[]},rowKey:{type:String,default:"id"},imgSelector:{type:String,default:"src"},width:{type:Number,default:200},breakpoints:{type:Object,default:()=>({1200:{rowPerView:3},800:{rowPerView:2},500:{rowPerView:1}})},gutter:{type:Number,default:10},hasAroundGutter:{type:Boolean,default:!0},animationPrefix:{type:String,default:"animate__animated"},animationEffect:{type:String,default:"fadeIn"},animationDuration:{type:Number,default:1e3},animationDelay:{type:Number,default:300},backgroundColor:{type:String,default:"#fff"},lazyload:{type:Boolean,default:!0},loadProps:{type:Object,default:()=>{}},crossOrigin:{type:Boolean,default:!0},delay:{type:Number,default:300},align:{type:String,default:"center"}},setup(t){const e=new vt(t.lazyload,t.loadProps,t.crossOrigin);z("lazy",e);const{waterfallWrapper:n,wrapperWidth:r,colWidth:o,cols:s,offsetX:i}=it(t),{wrapperHeight:a,layoutHandle:u}=at(t,o,s,i,n),c=V(()=>{u()},t.delay);X(()=>[r,o,t.list],()=>{r.value>0&&c()},{deep:!0});const A=m(0);return z("sizeChangeTime",A),z("imgLoaded",c),{waterfallWrapper:n,wrapperHeight:a,getRenderURL:d=>ft(d,t.imgSelector)[0],getKey:(d,v)=>d[t.rowKey]||v,renderer:c}}}),Q=()=>{J(t=>({b75bd1b4:t.backgroundColor}))},Y=I.setup;I.setup=Y?(t,e)=>(Q(),Y(t,e)):Q;const wt=I,bt={class:"waterfall-card"};function Et(t,e,n,r,o,s){return w(),b("div",{ref:"waterfallWrapper",class:"waterfall-list",style:et({height:`${t.wrapperHeight}px`})},[(w(!0),b(q,null,$(t.list,(i,a)=>(w(),b("div",{key:t.getKey(i,a),class:"waterfall-item"},[O("div",bt,[tt(t.$slots,"item",{item:i,index:a,url:t.getRenderURL(i)},void 0,!0)])]))),128))],4)}var xt=D(wt,[["render",Et],["__scopeId","data-v-6a0e9c4c"]]);const pt=N({props:{url:{type:String,default:""},title:{type:String,default:""},alt:{type:String,default:""}},setup(t,e){const n=F("imgLoaded"),r=F("lazy"),o=m(null);nt(()=>{s()}),rt(()=>{i()});function s(){!o.value||r.mount(o.value,t.url,u=>{n(),u?e.emit("success",t.url):e.emit("error",t.url)})}function i(){!o.value||r.unmount(o.value)}function a(){e.emit("load",t.url)}return{lazyRef:o,imageLoad:a}}}),zt={class:"lazy__box"},Ot={class:"lazy__resource"},Rt=["title","alt"];function It(t,e,n,r,o,s){return w(),b("div",zt,[O("div",Ot,[O("img",{ref:"lazyRef",class:"lazy__img",title:t.title,alt:t.alt,onLoad:e[0]||(e[0]=(...i)=>t.imageLoad&&t.imageLoad(...i))},null,40,Rt)])])}var Ct=D(pt,[["render",It],["__scopeId","data-v-392b4abe"]]);function St(t=6){return Number(Math.random().toString().substr(3,t)+Date.now()).toString(36)}const Nt=["#409EFF","#67C23A","#E6A23C","#F56C6C","#909399"];function Ft(t,e){return Math.floor(Math.random()*(e-t+1))+t}function Dt(){return Nt[Ft(0,4)]}const _t="https://www.getphotoblanket.com",Pt=({page:t=1,pageSize:e=20})=>{const n=`${_t}/products.json?page=${t}&limit=${e}`;return fetch(n).then(r=>r.json()).then(r=>r.products).then(r=>r.map(o=>({id:St(),star:!1,price:o.variants[0].price,src:{original:Math.random()>.1?o.images[0].src:"https://www.example.com/non-existent-image.jpg"},backgroundColor:Dt(),name:o.title})))};export{Ct as L,xt as W,Lt as e,Pt as g,Mt as l}; diff --git a/docs/assets/api.ac58b069.js b/docs/assets/api.ac58b069.js new file mode 100644 index 0000000..8c698d9 --- /dev/null +++ b/docs/assets/api.ac58b069.js @@ -0,0 +1 @@ +import{l as m,y as k,p,g as N,z,A as V,B as X,C as J,o as w,c as b,F as q,v as $,a as O,D as tt,E as et,G as F,m as rt,H as nt}from"./vendor.89609b2d.js";import{_ as D}from"./index.dd4211c2.js";var Mt="data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAADAAAAAwCAYAAABXAvmHAAAAAXNSR0IArs4c6QAABNBJREFUaEPtmV1oXEUUx//n3g1JRGqL9k1RsFq/6IMgSky8c2YTQyONiojWYumTQrWKSNH6oO1TS1EQFcTiQwsaK4qIbVdod+/M3Y0IteJDwVr1oVYFEfFFwUY2c2TCbrhZNptNduvuQgf2Ze85M+c359w5Z84l9PigHrcflwCqHrTWsoiUmLn8f3q1bR4wxggRlZxz00EQlCowf19smLYAxHF8NxFNA/gUgAKwGsApD5GC+eNiwLQL4GUi2gNgDIA31ENEKZhzIvK5h5mZmZkeHx//uV0wbQEwxpQADDPzgvny+fyNYRhO1MB42w9674RhWIqi6IdWYFoGMMbcBuA0ER1RSk3GcbyViB4HcBTAMWb+0RtYKpXWlMvlSSKaFBFdCTP/yIrIRxWY08uFaQfAswAeAPAaMx81xhwmojVpQ0TkSxH5QGt9tvp/kiQTzrlJAOsroeYfnXPOHQrD8JhS6qtmYFoGaGaRRjKFQuF6IhononsB+N9gSv4ggENKqYSIpN48cwCFQmF3EARPt2rMcvWZ+ao4ju/TWh+r6hpjRkVkYwXIh+d8qvEw/f39Hw4NDf1T/TMN8AqA/HKNWKk8EWmlVFjZvG0iUiSiIjO/W52zWCyuLZfLm4hoE4DxlHfmQi2bze6uBbih+tKt1LBm9Ky17wN4NAXgN29uiMi/HsS/2FrrA+n5isXi7bOzsx5mdyaTWT8yMvJ9XQC/K80YshIZv2uNAOrM+bWIHKjCWGuPi8g9zDzgZesC+LJgJcYtpeOc27MCAD/taWbeYIy5i4gKzjnvnW29BLCLmfcZY54H8GoQBONRFB3vGYByuXzt2NjYeWPMJwAeTGf8rg8hIvpTKXVlHMe3AogBnNFa+1prbnQ9gIi8rbXeHsfxE0T0DhE9qZSaP526HgDACDNPW2sPicjWvr6+VcPDw3/1jAd8vJ84ceKKTCbjj1NordelT7tu98BRZt5krd0sIlNEtFcp9VLPAIjIFq31lDHmLQBPBUGwIYqiBSV3xz1gjPFlRN3MXz0ujTHf+LKbmS+rTZZdC0BEJ5VSdxYKBR0EQYGIppRSW3oGAEA1++4F8KK/ySmljvQMQDX7Wmt9ZeqP0rqXr24NoZ+Y+TpjzDoiOuvvCszM9YrFbgV4nZmfi+N4JxHtJ6JnlFJv9hLAXPY1xuQAbASwlpnrNsY67oHKlXL+RgbgAjMP5nK5/oGBgd+DIPhNKeU7F3VHxwFq80Cl/fKYMeYRAIdFZL/W+oWeAQDwMDN/7PtLADzEHcx8qmcAUtn3FxFZrbW+vNFVteMhFMexj+/7faKqxP9okiRDzrkvALzHzL5NuejoOEDasiRJJqMo+sxau19EdgZB8FAURf4auTyARgrteJZuq9SbzxhzBsBNi2XfJcvpdhjZaI5GAEmSXOOcO09EsVIqu5QtHe/M1Rpord0hIm8A2MHM/h7QcHQjQMF/P3DOXZ3NZn/teoBKJr4AYLpSPviu4HfMfPNSxvvnCzzgnNvejFKrMmEYDi/S3LWVjx37mHlXM+vUhlAzOm2RISLnu9N+slwut2pwcHCCiCZExH+5mchmsyebWWgOwBgz3+lqRqldMszsd3zByOfzt4yOjn7b7Bod/8TUrKGLyV0CaHUHW9X/D9N93V6azvezAAAAAElFTkSuQmCC",Ct="data:image/png;base64,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";const ot=({breakpoints:t,wrapperWidth:e,gutter:r,hasAroundGutter:n,initWidth:o})=>{const s=Object.keys(t).map(l=>Number(l)).sort((l,A)=>l-A);let i=e,a=!1;for(const l of s)if(e<=l){i=l,a=!0;break}if(!a)return o;const u=t[i].rowPerView;return n?(e-r)/u-r:(e-(u-1)*r)/u};function it(t){const e=m(0),r=m(null);k(r,i=>{const a=i[0],{width:u}=a.contentRect;e.value=u});const n=p(()=>ot({wrapperWidth:e.value,breakpoints:t.breakpoints,gutter:t.gutter,hasAroundGutter:t.hasAroundGutter,initWidth:t.width})),o=p(()=>{const i=t.hasAroundGutter?-t.gutter:t.gutter;return Math.floor((e.value+i)/(n.value+t.gutter))}),s=p(()=>{if(t.align==="left")return 0;if(t.align==="center"){const i=t.hasAroundGutter?t.gutter:-t.gutter,a=o.value*(n.value+t.gutter)+i;return(e.value-a)/2}else{const i=t.hasAroundGutter?t.gutter:-t.gutter,a=o.value*(n.value+t.gutter)+i;return e.value-a}});return{waterfallWrapper:r,wrapperWidth:e,colWidth:n,cols:o,offsetX:s}}function _(t,e){return new RegExp(`(^|\\s)${e}(\\s|$)`).test(t.className)}function j(t,e){if(_(t,e))return;const r=t.className.split(/\s+/);r.push(e),t.className=r.join(" ")}const st=document.createElement("div").style,R=(()=>{const t={webkit:"webkitTransform",Moz:"MozTransform",O:"OTransform",ms:"msTransform",standard:"transform"};for(const e in t){const r=t[e];if(st[r]!==void 0)return e}return!1})();function h(t){return R===!1?!1:R==="standard"?t:R+t.charAt(0).toUpperCase()+t.substr(1)}const B=h("transform"),M=h("animation-duration"),C=h("animation-delay"),L=h("transition"),x=h("animation-fill-mode");function at(t,e,r,n,o){const s=m([]),i=m(0),a=c=>{const d=t.hasAroundGutter?c+1:c;return t.gutter*d+e.value*c+n.value},u=()=>{s.value=new Array(r.value).fill(t.hasAroundGutter?t.gutter:0)},l=ut(t);return{wrapperHeight:i,layoutHandle:async()=>{u();const c=[];if(o&&o.value&&o.value.childNodes.forEach(d=>{d.className==="waterfall-item"&&c.push(d)}),c.length===0)return!1;for(let d=0;d{const Z=t.animationDuration/1e3;L&&(E[L]=`transform ${Z}s`)})}i.value=Math.max.apply(null,s.value)}}}function ut(t){return(e,r)=>{const n=e.firstChild;if(n&&!_(n,t.animationPrefix)){const o=`${t.animationDuration/1e3}s`,s=`${t.animationDelay/1e3}s`,i=n.style;i.visibility="visible",M&&(i[M]=o),C&&(i[C]=s),x&&(i[x]="both"),j(n,t.animationPrefix),j(n,t.animationEffect),r&&setTimeout(()=>{r()},t.animationDuration+t.animationDelay)}}}const lt=typeof window!="undefined"&&window!==null,P=ft(),ct=Object.prototype.propertyIsEnumerable,T=Object.getOwnPropertySymbols;function dt(t,...e){return e.map(n=>n.replace(/\[(\w+)\]/g,".$1").split(".").reduce((o,s)=>o&&o[s],t))}function ft(){return lt&&"IntersectionObserver"in window&&"IntersectionObserverEntry"in window&&"intersectionRatio"in window.IntersectionObserverEntry.prototype?("isIntersecting"in window.IntersectionObserverEntry.prototype||Object.defineProperty(window.IntersectionObserverEntry.prototype,"isIntersecting",{get(){return this.intersectionRatio>0}}),!0):!1}function y(t){return typeof t=="function"||toString.call(t)==="[object Object]"}function At(t){return typeof t=="object"?t===null:typeof t!="function"}function mt(t){return t!=="__proto__"&&t!=="constructor"&&t!=="prototype"}function gt(t,...e){if(!y(t))throw new TypeError("expected the first argument to be an object");if(e.length===0||typeof Symbol!="function"||typeof T!="function")return t;for(const r of e){const n=T(r);for(const o of n)ct.call(r,o)&&(t[o]=r[o])}return t}function G(t,...e){let r=0;for(At(t)&&(t=e[r++]),t||(t={});r{const o=new Image;o.onload=()=>{r(o)},o.onerror=()=>{n(new Error("Image load error"))},e&&(o.crossOrigin="Anonymous"),o.src=t})}var g;(function(t){t.LOADING="loading",t.LOADED="loaded",t.ERROR="error"})(g||(g={}));const ht={rootMargin:"0px",threshold:0},K="data:image/gif;base64,R0lGODlhAQABAIAAAAAAAP///yH5BAEAAAAALAAAAAABAAEAAAIBRAA7",yt="";class vt{constructor(e=!0,r,n=!0){this.lazyActive=!0,this.crossOrigin=!0,this.options={loading:K,error:yt,observerOptions:ht,log:!0,ratioCalculator:(o,s)=>s/o},this._images=new WeakMap,this.lazyActive=e,this.crossOrigin=n,this.config(r)}config(e={}){G(this.options,e),e.ratioCalculator&&(this.options.ratioCalculator=e.ratioCalculator)}mount(e,r,n){const{src:o,loading:s,error:i}=this._valueFormatter(r);e.setAttribute("lazy",g.LOADING),e.setAttribute("src",s||K),this.lazyActive?(P||(this._setImageSrc(e,o,n,i),this._log(()=>{throw new Error("Not support IntersectionObserver!")})),this._initIntersectionObserver(e,o,n,i)):this._setImageSrc(e,o,n,i)}resize(e,r){const n=e.getAttribute("lazy"),o=e.getAttribute("src");n&&n===g.LOADED&&o&&H(o,this.crossOrigin).then(s=>{const{width:i,height:a}=s,u=e.width/i*a;e.height=u;const l=e.style;l.height=`${u}px`,r()})}unmount(e){const r=this._realObserver(e);r&&r.unobserve(e),this._images.delete(e)}_setImageSrc(e,r,n,o){!r||e.getAttribute("src")===r||H(r,this.crossOrigin).then(i=>{var c,d;const{width:a,height:u}=i,l=((d=(c=this.options).ratioCalculator)==null?void 0:d.call(c,a,u))||u/a,A=e.parentNode.parentNode;A.style.paddingBottom=`${l*100}%`,e.setAttribute("lazy",g.LOADED),e.removeAttribute("src"),e.setAttribute("src",r),n(!0)}).catch(()=>{const i=this._realObserver(e);i&&i.disconnect(),o&&(e.setAttribute("lazy",g.ERROR),e.setAttribute("src",o),n(!1)),this._log(()=>{throw new Error(`Image failed to load!And failed src was: ${r} `)})})}_isOpenLazy(){return P&&this.lazyActive}_initIntersectionObserver(e,r,n,o){const s=this.options.observerOptions;this._images.set(e,new IntersectionObserver(a=>{Array.prototype.forEach.call(a,u=>{if(u.isIntersecting){const l=this._realObserver(e);l&&l.unobserve(u.target),this._setImageSrc(e,r,n,o)}})},s));const i=this._realObserver(e);i&&i.observe(e)}_valueFormatter(e){let r=e,n=this.options.loading,o=this.options.error;return y(e)&&(r=e.src,n=e.loading||this.options.loading,o=e.error||this.options.error),{src:r,loading:n,error:o}}_log(e){this.options.log&&e()}_realObserver(e){return this._images.get(e)}}const I=N({props:{list:{type:Array,default:()=>[]},rowKey:{type:String,default:"id"},imgSelector:{type:String,default:"src"},width:{type:Number,default:200},breakpoints:{type:Object,default:()=>({1200:{rowPerView:3},800:{rowPerView:2},500:{rowPerView:1}})},gutter:{type:Number,default:10},hasAroundGutter:{type:Boolean,default:!0},animationPrefix:{type:String,default:"animate__animated"},animationEffect:{type:String,default:"fadeIn"},animationDuration:{type:Number,default:1e3},animationDelay:{type:Number,default:300},backgroundColor:{type:String,default:"#fff"},lazyload:{type:Boolean,default:!0},loadProps:{type:Object,default:()=>{}},crossOrigin:{type:Boolean,default:!0},delay:{type:Number,default:300},align:{type:String,default:"center"}},setup(t){const e=new vt(t.lazyload,t.loadProps,t.crossOrigin);z("lazy",e);const{waterfallWrapper:r,wrapperWidth:n,colWidth:o,cols:s,offsetX:i}=it(t),{wrapperHeight:a,layoutHandle:u}=at(t,o,s,i,r),l=V(()=>{u()},t.delay);X(()=>[n,o,t.list],()=>{n.value>0&&l()},{deep:!0});const A=m(0);return z("sizeChangeTime",A),z("imgLoaded",l),{waterfallWrapper:r,wrapperHeight:a,getRenderURL:f=>dt(f,t.imgSelector)[0],getKey:(f,v)=>f[t.rowKey]||v,renderer:l}}}),Q=()=>{J(t=>({b75bd1b4:t.backgroundColor}))},Y=I.setup;I.setup=Y?(t,e)=>(Q(),Y(t,e)):Q;const wt=I,bt={class:"waterfall-card"};function Et(t,e,r,n,o,s){return w(),b("div",{ref:"waterfallWrapper",class:"waterfall-list",style:et({height:`${t.wrapperHeight}px`})},[(w(!0),b(q,null,$(t.list,(i,a)=>(w(),b("div",{key:t.getKey(i,a),class:"waterfall-item"},[O("div",bt,[tt(t.$slots,"item",{item:i,index:a,url:t.getRenderURL(i)},void 0,!0)])]))),128))],4)}var Lt=D(wt,[["render",Et],["__scopeId","data-v-6a0e9c4c"]]);const pt=N({props:{url:{type:String,default:""},title:{type:String,default:""},alt:{type:String,default:""}},setup(t,e){const r=F("imgLoaded"),n=F("lazy"),o=m(null);rt(()=>{s()}),nt(()=>{i()});function s(){!o.value||n.mount(o.value,t.url,u=>{r(),u?e.emit("success",t.url):e.emit("error",t.url)})}function i(){!o.value||n.unmount(o.value)}function a(){e.emit("load",t.url)}return{lazyRef:o,imageLoad:a}}}),zt={class:"lazy__box"},Ot={class:"lazy__resource"},Rt=["title","alt"];function It(t,e,r,n,o,s){return w(),b("div",zt,[O("div",Ot,[O("img",{ref:"lazyRef",class:"lazy__img",title:t.title,alt:t.alt,onLoad:e[0]||(e[0]=(...i)=>t.imageLoad&&t.imageLoad(...i))},null,40,Rt)])])}var xt=D(pt,[["render",It],["__scopeId","data-v-640f8d40"]]);function St(t=6){return Number(Math.random().toString().substr(3,t)+Date.now()).toString(36)}const Nt=["#409EFF","#67C23A","#E6A23C","#F56C6C","#909399"];function Ft(t,e){return Math.floor(Math.random()*(e-t+1))+t}function Dt(){return Nt[Ft(0,4)]}const _t="https://www.getphotoblanket.com",Pt=({page:t=1,pageSize:e=20})=>{const r=`${_t}/products.json?page=${t}&limit=${e}`;return fetch(r).then(n=>n.json()).then(n=>n.products).then(n=>n.map(o=>({id:St(),star:!1,price:o.variants[0].price,src:{original:Math.random()>.1?o.images[0].src:"https://www.example.com/non-existent-image.jpg"},backgroundColor:Dt(),name:o.title})))};export{xt as L,Lt as W,Ct as e,Pt as g,Mt as l}; diff --git a/docs/assets/api.1f0230ce.css b/docs/assets/api.e93543f3.css similarity index 52% rename from docs/assets/api.1f0230ce.css rename to docs/assets/api.e93543f3.css index 2700e1c..b4fe4ce 100644 --- a/docs/assets/api.1f0230ce.css +++ b/docs/assets/api.e93543f3.css @@ -1 +1 @@ -.waterfall-list[data-v-6a0e9c4c]{width:100%;position:relative;overflow:hidden;background-color:var(--b75bd1b4)}.waterfall-item[data-v-6a0e9c4c]{position:absolute;left:0;top:0;transform:translateY(3000px);visibility:hidden}@keyframes fadeIn-6a0e9c4c{0%{opacity:0}to{opacity:1}}.fadeIn[data-v-6a0e9c4c]{animation-name:fadeIn-6a0e9c4c}.lazy__box[data-v-392b4abe]{width:100%;height:0;padding-bottom:100%;overflow:hidden;position:relative}.lazy__resource[data-v-392b4abe]{display:flex;justify-content:center;align-items:center;position:absolute;left:0;top:0;bottom:0;right:0}.lazy__img[data-v-392b4abe]{display:block}.lazy__img[lazy=loading][data-v-392b4abe]{padding:5em 0;width:48px}.lazy__img[lazy=loaded][data-v-392b4abe]{width:100%;height:100%}.lazy__img[lazy=error][data-v-392b4abe]{padding:5em 0;width:48px;height:auto} +.waterfall-list[data-v-6a0e9c4c]{width:100%;position:relative;overflow:hidden;background-color:var(--b75bd1b4)}.waterfall-item[data-v-6a0e9c4c]{position:absolute;left:0;top:0;transform:translateY(3000px);visibility:hidden}@keyframes fadeIn-6a0e9c4c{0%{opacity:0}to{opacity:1}}.fadeIn[data-v-6a0e9c4c]{animation-name:fadeIn-6a0e9c4c}.lazy__box[data-v-640f8d40]{width:100%;height:0;padding-bottom:100%;overflow:hidden;position:relative}.lazy__resource[data-v-640f8d40]{display:flex;justify-content:center;align-items:center;position:absolute;left:0;top:0;bottom:0;right:0}.lazy__img[data-v-640f8d40]{display:block}.lazy__img[lazy=loading][data-v-640f8d40]{padding:5em 0;width:48px}.lazy__img[lazy=loaded][data-v-640f8d40]{width:100%;height:100%;-o-object-fit:cover;object-fit:cover}.lazy__img[lazy=error][data-v-640f8d40]{padding:5em 0;width:48px;height:auto} diff --git a/docs/assets/index.f6507150.js b/docs/assets/index.dd4211c2.js similarity index 71% rename from docs/assets/index.f6507150.js rename to docs/assets/index.dd4211c2.js index 859cc7f..2191919 100644 --- a/docs/assets/index.f6507150.js +++ b/docs/assets/index.dd4211c2.js @@ -1 +1 @@ -import{r as _,o as c,c as g,a as y,b as i,w as l,d as u,e as P,K as b,f,g as L,h as k,i as x,j as E,k as A}from"./vendor.89609b2d.js";const O=function(){const s=document.createElement("link").relList;if(s&&s.supports&&s.supports("modulepreload"))return;for(const e of document.querySelectorAll('link[rel="modulepreload"]'))t(e);new MutationObserver(e=>{for(const r of e)if(r.type==="childList")for(const n of r.addedNodes)n.tagName==="LINK"&&n.rel==="modulepreload"&&t(n)}).observe(document,{childList:!0,subtree:!0});function o(e){const r={};return e.integrity&&(r.integrity=e.integrity),e.referrerpolicy&&(r.referrerPolicy=e.referrerpolicy),e.crossorigin==="use-credentials"?r.credentials="include":e.crossorigin==="anonymous"?r.credentials="omit":r.credentials="same-origin",r}function t(e){if(e.ep)return;e.ep=!0;const r=o(e);fetch(e.href,r)}};O();var w=(a,s)=>{for(const[o,t]of s)a[o]=t;return a};const B={},C={class:"page-nav"},N=f(" \u57FA\u7840API\u5C55\u793A "),$=f(" \u6570\u636E\u5206\u9875\u5C55\u793A ");function I(a,s){const o=_("router-link"),t=_("router-view");return c(),g("div",null,[y("nav",C,[i(o,{to:"/page-a"},{default:l(()=>[N]),_:1}),i(o,{to:"/page-b"},{default:l(()=>[$]),_:1})]),i(t,null,{default:l(({Component:e})=>[(c(),u(b,null,[(c(),u(P(e)))],1024))]),_:1})])}var V=w(B,[["render",I],["__scopeId","data-v-9ecc2122"]]);const j=L({setup(a){return(s,o)=>(c(),u(V))}}),R="modulepreload",p={},W="./",m=function(s,o){return!o||o.length===0?s():Promise.all(o.map(t=>{if(t=`${W}${t}`,t in p)return;p[t]=!0;const e=t.endsWith(".css"),r=e?'[rel="stylesheet"]':"";if(document.querySelector(`link[href="${t}"]${r}`))return;const n=document.createElement("link");if(n.rel=e?"stylesheet":R,e||(n.as="script",n.crossOrigin=""),n.href=t,document.head.appendChild(n),e)return new Promise((h,v)=>{n.addEventListener("load",h),n.addEventListener("error",v)})})).then(()=>s())},D=k({history:x(),routes:[{path:"/",redirect:"/page-a"},{path:"/page-a",name:"PageA",component:()=>m(()=>import("./PageA.bb9694a5.js"),["assets/PageA.bb9694a5.js","assets/PageA.52cb6fcd.css","assets/api.51d0c053.js","assets/api.1f0230ce.css","assets/vendor.89609b2d.js"])},{path:"/page-b",name:"PageB",component:()=>m(()=>import("./PageB.30be8c1e.js"),["assets/PageB.30be8c1e.js","assets/PageB.d0650836.css","assets/api.51d0c053.js","assets/api.1f0230ce.css","assets/vendor.89609b2d.js"])}]});const d=E(j);d.use(A);d.use(D);d.mount("#app");export{w as _}; +import{r as _,o as c,c as g,a as y,b as i,w as l,d as u,e as P,K as L,f,g as k,h as x,i as E,j as b,k as A}from"./vendor.89609b2d.js";const O=function(){const s=document.createElement("link").relList;if(s&&s.supports&&s.supports("modulepreload"))return;for(const e of document.querySelectorAll('link[rel="modulepreload"]'))t(e);new MutationObserver(e=>{for(const r of e)if(r.type==="childList")for(const n of r.addedNodes)n.tagName==="LINK"&&n.rel==="modulepreload"&&t(n)}).observe(document,{childList:!0,subtree:!0});function o(e){const r={};return e.integrity&&(r.integrity=e.integrity),e.referrerpolicy&&(r.referrerPolicy=e.referrerpolicy),e.crossorigin==="use-credentials"?r.credentials="include":e.crossorigin==="anonymous"?r.credentials="omit":r.credentials="same-origin",r}function t(e){if(e.ep)return;e.ep=!0;const r=o(e);fetch(e.href,r)}};O();var w=(a,s)=>{for(const[o,t]of s)a[o]=t;return a};const B={},C={class:"page-nav"},N=f(" \u57FA\u7840API\u5C55\u793A "),$=f(" \u6570\u636E\u5206\u9875\u5C55\u793A ");function I(a,s){const o=_("router-link"),t=_("router-view");return c(),g("div",null,[y("nav",C,[i(o,{to:"/page-a"},{default:l(()=>[N]),_:1}),i(o,{to:"/page-b"},{default:l(()=>[$]),_:1})]),i(t,null,{default:l(({Component:e})=>[(c(),u(L,null,[(c(),u(P(e)))],1024))]),_:1})])}var V=w(B,[["render",I],["__scopeId","data-v-9ecc2122"]]);const j=k({setup(a){return(s,o)=>(c(),u(V))}}),R="modulepreload",p={},W="./",m=function(s,o){return!o||o.length===0?s():Promise.all(o.map(t=>{if(t=`${W}${t}`,t in p)return;p[t]=!0;const e=t.endsWith(".css"),r=e?'[rel="stylesheet"]':"";if(document.querySelector(`link[href="${t}"]${r}`))return;const n=document.createElement("link");if(n.rel=e?"stylesheet":R,e||(n.as="script",n.crossOrigin=""),n.href=t,document.head.appendChild(n),e)return new Promise((h,v)=>{n.addEventListener("load",h),n.addEventListener("error",v)})})).then(()=>s())},D=x({history:E(),routes:[{path:"/",redirect:"/page-a"},{path:"/page-a",name:"PageA",component:()=>m(()=>import("./PageA.950c057e.js"),["assets/PageA.950c057e.js","assets/PageA.52cb6fcd.css","assets/api.ac58b069.js","assets/api.e93543f3.css","assets/vendor.89609b2d.js"])},{path:"/page-b",name:"PageB",component:()=>m(()=>import("./PageB.97751dea.js"),["assets/PageB.97751dea.js","assets/PageB.d0650836.css","assets/api.ac58b069.js","assets/api.e93543f3.css","assets/vendor.89609b2d.js"])}]});const d=b(j);d.use(A);d.use(D);d.mount("#app");export{w as _}; diff --git a/docs/index.html b/docs/index.html index d4f4b56..3a195ec 100644 --- a/docs/index.html +++ b/docs/index.html @@ -11,7 +11,7 @@ Vue3瀑布流 - +