UNPKG

vuux

Version:

Vue3 Nuxt3 Nuxt4 组件库

2 lines (1 loc) 2.68 kB
"use strict";const e=require("vue"),V=require("./hook/useSwiper.cjs"),p=require("@vuux/icons"),x=["src"],N={key:2,class:"swiper-dots"},S=["onClick"],z=e.defineComponent({name:"Swiper",__name:"index",props:{modelValue:{},width:{default:"100%"},height:{default:"420px"},autoSize:{type:Boolean,default:!1},initialIndex:{default:0},transitionDuration:{default:300},threshold:{default:.2},arrows:{type:Boolean,default:!0},dots:{type:Boolean,default:!0},loop:{type:Boolean,default:!0},images:{default:()=>[]},gap:{default:10},autoplay:{type:Boolean,default:!0},interval:{default:3e3}},emits:["update:modelValue"],setup(f,{expose:m,emit:k}){const o=f,y=k,a=e.useTemplateRef("viewportEl"),i=e.useTemplateRef("trackEl"),{slidesCount:u,currentIndex:w,isDisabledPrev:B,isDisabledNext:v,containerStyles:E,trackStyles:g,goTo:c,next:l,prev:s,onPointerDown:n}=V.useSwiper(o,a,i,y);return m({next:l,prev:s,goTo:c}),(C,r)=>(e.openBlock(),e.createElementBlock("div",{ref:"swiperEl",class:"app-swiper",style:e.normalizeStyle(e.unref(E))},[o.arrows?(e.openBlock(),e.createElementBlock("div",{key:0,class:e.normalizeClass(["is-arrows is-prev",{"is-disabled":e.unref(B)}]),onClick:r[0]||(r[0]=(...t)=>e.unref(s)&&e.unref(s)(...t))},[e.createVNode(e.unref(p.Icon),{name:"Icon3498333",size:18,opacity:.8,color:"rgba(255, 255, 255, 0.8)"})],2)):e.createCommentVNode("",!0),e.createElementVNode("div",{ref_key:"viewportEl",ref:a,class:"swiper-viewport",onMousedown:r[1]||(r[1]=(...t)=>e.unref(n)&&e.unref(n)(...t)),onTouchstartPassive:r[2]||(r[2]=(...t)=>e.unref(n)&&e.unref(n)(...t))},[e.createElementVNode("div",{ref_key:"trackEl",ref:i,class:"swiper-track",style:e.normalizeStyle(e.unref(g))},[o.images&&o.images.length?(e.openBlock(!0),e.createElementBlock(e.Fragment,{key:0},e.renderList(o.images,(t,d)=>(e.openBlock(),e.createElementBlock("div",{key:d,class:"swiper-images"},[e.createElementVNode("img",{src:t,draggable:"false"},null,8,x)]))),128)):e.renderSlot(C.$slots,"default",{key:1})],4)],544),o.arrows?(e.openBlock(),e.createElementBlock("div",{key:1,class:e.normalizeClass(["is-arrows is-next",{"is-disabled":e.unref(v)}]),onClick:r[3]||(r[3]=(...t)=>e.unref(l)&&e.unref(l)(...t))},[e.createVNode(e.unref(p.Icon),{name:"Icon6657361",size:18,opacity:.8,color:"rgba(255, 255, 255, 0.8)"})],2)):e.createCommentVNode("",!0),o.dots&&e.unref(u)>1?(e.openBlock(),e.createElementBlock("div",N,[(e.openBlock(!0),e.createElementBlock(e.Fragment,null,e.renderList(e.unref(u),t=>(e.openBlock(),e.createElementBlock("div",{key:t-1,class:e.normalizeClass(["swiper-dot",{"is-active":e.unref(w)===t-1}]),onClick:d=>e.unref(c)(t-1)},null,10,S))),128))])):e.createCommentVNode("",!0)],4))}});module.exports=z;