import{e as D,f as H,q as T,p as j,C as f,c as l,a,g as t,t as I,n as R,b as J,w as O,T as Q,H as P,K as V,F as z,s as F,h as k,v as _,o as n,_ as U}from"./pu4nfACZ.js";const X={class:"product-carousel"},Y={class:"product-carousel__left"},tt={class:"product-carousel__title-wrapper"},et={key:0,class:"product-carousel__title-skeleton","aria-hidden":"true"},at={key:1,class:"product-carousel__title"},st={class:"product-carousel__main"},ot={class:"product-carousel__image-wrapper"},rt={key:0,class:"product-carousel__skeleton","aria-hidden":"true"},lt=["src","alt"],nt={class:"product-carousel__thumbnails-wrapper"},it=["disabled"],ct={key:0,class:"product-carousel__thumbs-skeleton","aria-hidden":"true"},ut=["onClick"],dt=["src","alt"],ft=["disabled"],_t={class:"product-carousel__right"},gt={class:"product-carousel__right-title"},vt={class:"product-carousel__right-content"},ht=D({__name:"ProductCarousel",props:{items:{},introTitleKey:{},introContentKey:{}},setup(K){const g=K,{t:C}=H(),s=_(0),v=k(()=>g.items[s.value]),h=k(()=>{const o=v.value?.img;return Array.isArray(o)?o:[o]}),c=_(0),u=_(!0),y=_(null),m=_(!0);function B(){u.value=!1,m.value=!1}T([h,c],()=>{u.value=!0,f(()=>{y.value?.complete&&(u.value=!1,m.value&&(m.value=!1))})}),j(()=>{f(()=>{y.value?.complete&&(u.value=!1,m.value=!1)})});function S(){c.value<h.value.length-1&&c.value++}function W(){c.value>0&&c.value--}T(s,()=>{c.value=0});const b=_(null),q=k(()=>s.value>0),E=k(()=>s.value<g.items.length-1);function p(o,e="auto"){if(!b.value)return;const d=b.value.querySelectorAll(".product-carousel__thumb")[o];if(!d)return;const r=b.value,w=12,M=r.getBoundingClientRect(),$=d.getBoundingClientRect(),L=$.left-M.left+r.scrollLeft,x=$.right-M.left+r.scrollLeft;if(e==="left")r.scrollTo({left:L-w,behavior:"smooth"});else if(e==="right")r.scrollTo({left:x-r.clientWidth+w,behavior:"smooth"});else{const N=r.scrollLeft,Z=N+r.clientWidth;L<N?r.scrollTo({left:L-w,behavior:"smooth"}):x>Z&&r.scrollTo({left:x-r.clientWidth+w,behavior:"smooth"})}}function A(o){o==="left"&&s.value>0?(s.value--,f(()=>p(s.value,"left"))):o==="right"&&s.value<g.items.length-1&&(s.value++,f(()=>p(s.value,"right")))}function G(o){s.value=o,f(()=>p(o,"auto"))}return T(s,()=>{f(()=>p(s.value,"auto"))}),(o,e)=>(n(),l("div",X,[a("div",Y,[a("div",tt,[t(u)?(n(),l("div",et)):(n(),l("span",at,I(t(v)?.titleKey?t(C)(t(v).titleKey):""),1))]),a("div",st,[t(h).length>1?(n(),l("button",{key:0,class:"product-carousel__arrow product-carousel__arrow--left",onClick:W},[...e[2]||(e[2]=[a("span",{class:"product-carousel__arrow-icon"},"<",-1)])])):R("",!0),a("div",ot,[J(Q,{name:"skeleton-fade"},{default:O(()=>[t(u)?(n(),l("div",rt)):R("",!0)]),_:1}),a("img",{ref_key:"mainImgRef",ref:y,src:t(h)[t(c)]||"",alt:t(v)?.titleKey?t(C)(t(v).titleKey):"",class:P(["product-carousel__image",{"is-loaded":!t(u)}]),draggable:"false",onLoad:B,onError:B},null,42,lt)]),t(h).length>1?(n(),l("button",{key:1,class:"product-carousel__arrow product-carousel__arrow--right",onClick:S},[...e[3]||(e[3]=[a("span",{class:"product-carousel__arrow-icon"},">",-1)])])):R("",!0)]),a("div",nt,[a("button",{class:"product-carousel__thumb-arrow product-carousel__thumb-arrow--left",disabled:!t(q),onClick:e[0]||(e[0]=i=>A("left"))},[...e[4]||(e[4]=[V('<svg width="0.5rem" height="0.75rem" viewBox="0 0 8 11.8748036" version="1.1" xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink" data-v-8012bf6b><g id="0512" stroke="none" stroke-width="1" fill="none" fill-rule="evenodd" data-v-8012bf6b><g id="产品中心方案-曲轴" transform="translate(-280, -1334)" data-v-8012bf6b><g id="编组-21" transform="translate(260, 658)" data-v-8012bf6b><g id="编组-19" transform="translate(0, 628)" data-v-8012bf6b><g id="编组-5" transform="translate(0, 30)" data-v-8012bf6b><g id="up" transform="translate(24, 24) rotate(-270) translate(-24, -24)translate(16, 16)" data-v-8012bf6b><rect id="矩形" opacity="0" fill-rule="nonzero" x="0" y="0" width="16" height="16" data-v-8012bf6b></rect><path id="路径" d="M13.7501979,4 L12.5783229,4 C12.4986354,4 12.4236354,4.0390625 12.3767604,4.103125 L7.9376979,10.221875 L3.4986354,4.103125 C3.4517604,4.0390625 3.3767604,4 3.2970729,4 L2.1251979,4 C2.0236354,4 1.9642604,4.115625 2.0236354,4.1984375 L7.5330104,11.79375 C7.7330104,12.06875 8.1423854,12.06875 8.3408229,11.79375 L13.8501979,4.1984375 C13.9111354,4.115625 13.8517604,4 13.7501979,4 Z" fill="#000000" data-v-8012bf6b></path></g></g></g></g></g></g></svg>',1)])],8,it),t(m)?(n(),l("div",ct,[(n(),l(z,null,F(4,i=>a("div",{key:i,class:"product-carousel__thumbs-skeleton-item"})),64))])):(n(),l("div",{key:1,ref_key:"thumbContainerRef",ref:b,class:"product-carousel__thumbnails"},[(n(!0),l(z,null,F(K.items,(i,d)=>(n(),l("div",{key:d,class:P(["product-carousel__thumb",{"product-carousel__thumb--active":t(s)===d}]),onClick:r=>G(d)},[a("img",{src:Array.isArray(i.img)?i.img[0]:i.img,alt:t(C)(i.titleKey),class:"product-carousel__thumb-img",draggable:"false"},null,8,dt)],10,ut))),128))],512)),a("button",{class:"product-carousel__thumb-arrow product-carousel__thumb-arrow--right",disabled:!t(E),onClick:e[1]||(e[1]=i=>A("right"))},[...e[5]||(e[5]=[V('<svg width="0.5rem" height="0.75rem" viewBox="0 0 8 11.8748036" version="1.1" xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink" data-v-8012bf6b><g id="0512" stroke="none" stroke-width="1" fill="none" fill-rule="evenodd" data-v-8012bf6b><g id="产品中心方案-曲轴" transform="translate(-1058, -1334.1252)" data-v-8012bf6b><g id="编组-21" transform="translate(260, 658)" data-v-8012bf6b><g id="编组-19" transform="translate(0, 628)" data-v-8012bf6b><g id="编组-8" transform="translate(778, 30)" data-v-8012bf6b><g id="up" transform="translate(24, 24) rotate(-90) translate(-24, -24)translate(16, 16)" data-v-8012bf6b><rect id="矩形" opacity="0" fill-rule="nonzero" x="0" y="0" width="16" height="16" data-v-8012bf6b></rect><path id="路径" d="M13.7501979,4 L12.5783229,4 C12.4986354,4 12.4236354,4.0390625 12.3767604,4.103125 L7.9376979,10.221875 L3.4986354,4.103125 C3.4517604,4.0390625 3.3767604,4 3.2970729,4 L2.1251979,4 C2.0236354,4 1.9642604,4.115625 2.0236354,4.1984375 L7.5330104,11.79375 C7.7330104,12.06875 8.1423854,12.06875 8.3408229,11.79375 L13.8501979,4.1984375 C13.9111354,4.115625 13.8517604,4 13.7501979,4 Z" fill="#000000" data-v-8012bf6b></path></g></g></g></g></g></g></svg>',1)])],8,ft)])]),a("div",_t,[a("div",gt,I(o.$t(g.introTitleKey)),1),a("div",vt,I(o.$t(g.introContentKey)),1)])]))}}),bt=U(ht,[["__scopeId","data-v-8012bf6b"]]);export{bt as default};
