1 |
- import{_ as h}from"./_plugin-vue_export-helper-1b428a4d.js";import{e as n,r as m,b as y,h as b,o as v,c as f,C as s,aE as l,aL as x,n as w}from"./index-24b5bd0d.js";const S=["src"],C=h({__name:"ImageCard",props:{url:{type:String,required:!0},width:{type:[String,Number],required:!0},height:{type:[String,Number],required:!0},radius:{type:[String,Number],default:5},containerStyle:{type:Object,default:()=>({})},imgContainerStyle:{type:Object,default:()=>({})},textContainerStyle:{type:Object,default:()=>({})}},setup(t){const e=t,d=n(()=>`min(${e.width}px, 80vw)`),c=n(()=>typeof e.height=="number"?`${e.height}px`:e.height),u=n(()=>typeof e.radius=="number"?`${e.radius}px`:e.radius),p=m(),r=()=>{w(()=>{const a=document.querySelectorAll(".card-img");let i=1/0;a.forEach(g=>{const o=g.clientWidth;o<i&&(i=o)}),i!==1/0&&(p.value=i)})};return y(()=>{r(),window.addEventListener("resize",r)}),b(()=>{window.removeEventListener("resize",r)}),(a,i)=>(v(),f("div",{class:"",style:l([{display:"flex","align-items":"center"},{...t.containerStyle}])},[s("div",{class:"img-container",style:l({width:d.value,height:c.value,marginRight:"10px",border:"1px solid rgb(220 223 231)",borderRadius:u.value,display:"flex",alignItems:"center",justifyContent:"center",overflow:"hidden",...t.imgContainerStyle})},[s("img",{src:t.url,class:"card-img",style:{width:"100%",height:"100%",objectFit:"cover",objectPosition:"center"}},null,8,S)],4),s("div",{class:"text-container",style:l([{"flex-grow":"1","min-width":"50px","line-height":"25px"},{...t.textContainerStyle}])},[x(a.$slots,"label",{},void 0,!0)],4)],4))}},[["__scopeId","data-v-95b62e62"]]);export{C as I};
|