| 1 |
- import{d as k,r as p,w as h,b as B,o,A as _,B as z,C as x,aE as l,a as r,c as i,F as C,P as E,f as b,E as v,aa as L,D as g,dD as j,a$ as D}from"./index-24b5bd0d.js";import{E as I}from"./el-image-614d8096.js";import"./el-image-viewer-d766f6eb.js";import{h as P}from"./spu-25b62903.js";const U={key:0,class:"absolute left-0 top-0 z-1 items-center justify-center"},A=k({name:"ProductList",__name:"index",props:{property:{}},setup(R){const a=R,s=p([]);h(()=>a.property.spuIds,async()=>{s.value=await P(a.property.spuIds)},{immediate:!0,deep:!0});const d=p(375),m=p(),t=p(2),u=p("100%"),c=p("0"),y=p("");return h(()=>[a.property,d,s.value.length],()=>{t.value=a.property.layoutType==="twoCol"?2:3;const e=(d.value-a.property.space*(t.value-1))/t.value;c.value=t.value===2?"64px":`${e}px`,a.property.layoutType==="horizSwiper"?(y.value=`repeat(auto-fill, ${e}px)`,u.value=e*s.value.length+a.property.space*(s.value.length-1)+"px"):(y.value=`repeat(${t.value}, auto)`,u.value="100%")},{immediate:!0,deep:!0}),B(()=>{var e,f;d.value=((f=(e=m.value)==null?void 0:e.wrapRef)==null?void 0:f.offsetWidth)||375}),(e,f)=>{const w=I,$=D;return o(),_($,{class:"z-1 min-h-30px","wrap-class":"w-full",ref_key:"containerRef",ref:m},{default:z(()=>[x("div",{class:"grid overflow-x-auto",style:l({gridGap:`${e.property.space}px`,gridTemplateColumns:r(y),width:r(u)})},[(o(!0),i(C,null,E(r(s),(n,T)=>(o(),i("div",{class:"relative box-content flex flex-row flex-wrap overflow-hidden bg-white",style:l({borderTopLeftRadius:`${e.property.borderRadiusTop}px`,borderTopRightRadius:`${e.property.borderRadiusTop}px`,borderBottomLeftRadius:`${e.property.borderRadiusBottom}px`,borderBottomRightRadius:`${e.property.borderRadiusBottom}px`}),key:T},[e.property.badge.show?(o(),i("div",U,[b(w,{fit:"cover",src:e.property.badge.imgUrl,class:"h-26px w-38px"},null,8,["src"])])):v("",!0),b(w,{fit:"cover",src:n.picUrl,style:l({width:r(c),height:r(c)})},null,8,["src","style"]),x("div",{class:L(["flex flex-col gap-8px p-8px box-border",{"w-[calc(100%-64px)]":r(t)===2,"w-full":r(t)===3}])},[e.property.fields.name.show?(o(),i("div",{key:0,class:"truncate text-12px",style:l({color:e.property.fields.name.color})},g(n.name),5)):v("",!0),x("div",null,[e.property.fields.price.show?(o(),i("span",{key:0,class:"text-12px",style:l({color:e.property.fields.price.color})}," \uFFE5"+g(r(j)(n.price)),5)):v("",!0)])],2)],4))),128))],4)]),_:1},512)}}});export{A as default};
|
