st-common-ui-vue3
Version:
小尾巴通用 Vue3 UI 组件库
2 lines (1 loc) • 5.75 kB
JavaScript
"use strict";const e=require("vue"),A=require("../../node_modules/.pnpm/swiper@11.1.15/node_modules/swiper/swiper-vue.js"),M=require("../../node_modules/.pnpm/swiper@11.1.15/node_modules/swiper/modules/mousewheel.js"),P=require("../../node_modules/.pnpm/swiper@11.1.15/node_modules/swiper/modules/controller.js");;/* empty css */const s=require("../../node_modules/.pnpm/st-common-ui-utils@0.1.1/node_modules/st-common-ui-utils/es/utils/el-size-util.js"),C=require("../StIconIconify/StIconIconify.vue.js"),V=require("../../node_modules/.pnpm/@iconify-icons_tabler@1.2.95/node_modules/@iconify-icons/tabler/chevron-compact-left.js"),B=require("../../node_modules/.pnpm/@iconify-icons_tabler@1.2.95/node_modules/@iconify-icons/tabler/chevron-compact-right.js"),N=require("../../node_modules/.pnpm/@iconify-icons_tabler@1.2.95/node_modules/@iconify-icons/tabler/chevron-compact-up.js"),x=require("../../node_modules/.pnpm/@iconify-icons_tabler@1.2.95/node_modules/@iconify-icons/tabler/chevron-compact-down.js"),E=e.defineComponent({name:"StSwiper",__name:"StSwiper",props:e.mergeModels({width:{default:"100%"},height:{default:"100vh"},initialSlide:{default:0},direction:{default:"horizontal"},slidesPerView:{default:1},slidesOffsetBefore:{},slidesOffsetAfter:{},mousewheel:{type:Boolean,default:!0},navigation:{type:Boolean,default:!1},navDirection:{default:"horizontal"},navAlign:{default:"center"},navSize:{default:"3rem"},navColor:{default:"#efefef"},navDisabledColor:{default:"#9c9c9c9f"},transitionFun:{default:"initial"},transitionSpeed:{default:500},transitionDelay:{default:0},controlSwiper:{},swiperOverflow:{default:"hidden"},enableSlideClick:{type:Boolean,default:!0},slideClickHandler:{type:Function,default:r=>{r.slideTo(r.clickedIndex)}}},{activeSlideIdx:{default:void 0},activeSlideIdxModifiers:{}}),emits:["update:activeSlideIdx"],setup(r,{expose:I}){const g=r,l=e.useModel(r,"activeSlideIdx"),d=e.ref(null),y=i=>{d.value=i};I({swiper:d});const z=[P,M],o=e.ref(g.initialSlide),p=e.ref(),a=e.ref(0);e.onMounted(()=>{const i=p.value;a.value=i.querySelectorAll(".swiper-slide").length,(o.value>=a.value||o.value<0)&&(o.value=0)});const S=e.ref(!0),t=e.ref(o.value),v=e.ref(!1),u=e.ref(-1),c=e.ref(0),D=i=>{v.value=!0,u.value=i.previousIndex,c.value=i.activeIndex,S.value=!1},k=()=>{v.value=!1},H=i=>{t.value=i.activeIndex,l.value=i.activeIndex,u.value=i.previousIndex,c.value=i.activeIndex},w={horizontal:{center:{top:"50%",bottom:"initial",transform:"translateY(-50%)"},start:{top:0,bottom:"initial"},end:{top:"initial",bottom:0}},vertical:{center:{left:"50%",right:"initial",transform:"translateX(-50%)"},start:{left:0,right:"initial"},end:{left:"initial",right:0}}},m={horizontal:{prev:{left:0,right:"initial"},next:{left:"initial",right:0}},vertical:{prev:{top:0,bottom:"initial"},next:{top:"initial",bottom:0}}},h={horizontal:{prev:V,next:B},vertical:{prev:N,next:x}},b=()=>{var n;const i=(l.value===void 0?t.value:l.value)+1;(n=d.value)==null||n.slideTo(i)},q=()=>{var n;const i=(l.value===void 0?t.value:l.value)-1;(n=d.value)==null||n.slideTo(i)};return e.provide("isInitial",S),e.provide("initialSlideIdx",o),e.provide("isSlideChange",v),e.provide("enterSlideIdx",c),e.provide("leaveSlideIdx",u),e.provide("nowSlideIdx",l.value===void 0?t:l),(i,n)=>(e.openBlock(),e.createElementBlock("div",{ref_key:"stSwiperContainerRef",ref:p,class:"st-swiper-container",style:e.normalizeStyle({"--transition-fun":i.transitionFun,"--transition-delay":e.unref(s).elSizePreHandler(i.transitionDelay,"ms")})},[e.createVNode(e.unref(A.Swiper),{class:"st-swiper",style:e.normalizeStyle({"--swiper-overflow":i.swiperOverflow,width:e.unref(s).elSizePreHandler(i.width),height:e.unref(s).elSizePreHandler(i.height)}),"initial-slide":o.value,direction:i.direction,"slides-per-view":i.slidesPerView,"slides-offset-before":i.slidesOffsetBefore,"slides-offset-after":i.slidesOffsetAfter,modules:z,mousewheel:{enabled:i.mousewheel},controller:{control:i.controlSwiper},speed:i.transitionSpeed,onSwiper:y,onSlideChangeTransitionStart:D,onSlideChangeTransitionEnd:k,onActiveIndexChange:H,onClick:n[0]||(n[0]=f=>i.enableSlideClick&&i.slideClickHandler(f))},{"wrapper-start":e.withCtx(()=>[e.renderSlot(i.$slots,"default",{currentSlideIdx:t.value,activeSlideIdx:l.value})]),_:3},8,["style","initial-slide","direction","slides-per-view","slides-offset-before","slides-offset-after","mousewheel","controller","speed"]),i.navigation?(e.openBlock(),e.createElementBlock("div",{key:0,class:"st-swiper__nav st-swiper__nav-prev",style:e.normalizeStyle({...m[i.navDirection].prev,...w[i.navDirection][i.navAlign]}),onPointerdown:n[1]||(n[1]=f=>t.value>0&&q())},[e.renderSlot(i.$slots,"prev",{},()=>[e.createElementVNode("div",{class:"st-swiper__nav__content",style:e.normalizeStyle({fontSize:e.unref(s).elSizePreHandler(i.navSize),color:t.value<=0?i.navDisabledColor:i.navColor,cursor:t.value<=0?"no-drop":"pointer"})},[e.createVNode(e.unref(C),{icon:h[i.navDirection].prev},null,8,["icon"])],4)])],36)):e.createCommentVNode("",!0),i.navigation?(e.openBlock(),e.createElementBlock("div",{key:1,class:"st-swiper__nav st-swiper__nav-next",style:e.normalizeStyle({...m[i.navDirection].next,...w[i.navDirection][i.navAlign]}),onPointerdown:n[2]||(n[2]=f=>t.value<a.value-1&&b())},[e.renderSlot(i.$slots,"next",{},()=>[e.createElementVNode("div",{class:"st-swiper__nav__content",style:e.normalizeStyle({fontSize:e.unref(s).elSizePreHandler(i.navSize),color:t.value>=a.value-1?i.navDisabledColor:i.navColor,cursor:t.value>=a.value-1?"no-drop":"pointer"})},[e.createVNode(e.unref(C),{icon:h[i.navDirection].next},null,8,["icon"])],4)])],36)):e.createCommentVNode("",!0)],4))}});module.exports=E;