@seresweb/website-component 2.1.0 → 2.2.0
This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
- package/dist/cjs/horizontal-viewer.cjs +1 -1
- package/dist/cjs/image-indicator.cjs +1 -1
- package/dist/cjs/index.cjs +1 -1
- package/dist/cjs/swiper-normal.cjs +1 -1
- package/dist/cjs/swiper-showcase.cjs +1 -0
- package/dist/cjs/swiper-vehicle.cjs +1 -1
- package/dist/css/swiper-showcase.css +1 -0
- package/dist/es/horizontal-viewer.mjs +1 -1
- package/dist/es/image-indicator.mjs +1 -1
- package/dist/es/index.mjs +18 -16
- package/dist/es/swiper-normal.mjs +1 -1
- package/dist/es/swiper-showcase.mjs +263 -0
- package/dist/es/swiper-vehicle.mjs +158 -2
- package/dist/global.d.ts +1 -0
- package/dist/index-C_05OlSq.cjs +1 -0
- package/dist/{index-C6ZSfMR8.js → index-DfK8Ib64.js} +22 -20
- package/dist/index.css +1 -1
- package/dist/scss/index.scss +1 -0
- package/dist/scss/swiper-showcase.scss +128 -0
- package/dist/{index-BrggpRcU.js → swiper-bundle-DTJcHqdp.js} +1109 -1266
- package/dist/swiper-bundle-l31DJOK1.cjs +5 -0
- package/dist/types/components/index.d.ts +1 -0
- package/dist/types/components/swiper-showcase/index.d.ts +6 -0
- package/dist/types/components/swiper-showcase/swiper-showcase.vue.d.ts +10 -0
- package/dist/types/components/swiper-showcase/type.d.ts +33 -0
- package/package.json +1 -1
- package/dist/index-BVX78e_m.cjs +0 -1
- package/dist/index-DrnEpWXW.cjs +0 -5
|
@@ -1 +1 @@
|
|
|
1
|
-
"use strict";Object.defineProperty(exports,Symbol.toStringTag,{value:"Module"});const e=require("../index-
|
|
1
|
+
"use strict";Object.defineProperty(exports,Symbol.toStringTag,{value:"Module"});const e=require("../index-C_05OlSq.cjs");exports.ScHorizontalViewer=e.ScHorizontalViewer;
|
|
@@ -1 +1 @@
|
|
|
1
|
-
"use strict";Object.defineProperty(exports,Symbol.toStringTag,{value:"Module"});const e=require("../index-
|
|
1
|
+
"use strict";Object.defineProperty(exports,Symbol.toStringTag,{value:"Module"});const e=require("../index-C_05OlSq.cjs");exports.ScImageIndicator=e.ScImageIndicator;
|
package/dist/cjs/index.cjs
CHANGED
|
@@ -1 +1 @@
|
|
|
1
|
-
"use strict";Object.defineProperties(exports,{__esModule:{value:!0},[Symbol.toStringTag]:{value:"Module"}});const l=require("./accordion-info-panel.cjs"),
|
|
1
|
+
"use strict";Object.defineProperties(exports,{__esModule:{value:!0},[Symbol.toStringTag]:{value:"Module"}});const l=require("./accordion-info-panel.cjs"),u=require("./animated-number.cjs"),d=require("./drawer.cjs"),m=require("./dropdown.cjs"),p=require("./gradual-highlight.cjs"),c=require("../index-C_05OlSq.cjs"),w=require("./input.cjs"),h=require("./layz-image.cjs"),f=require("./parameter-box.cjs"),I=require("./radio.cjs"),g=require("./swiper-showcase.cjs"),q=require("./swiper-vehicle.cjs"),b=require("./tab-indicator.cjs"),y=require("./video.cjs"),S="@seresweb/website-component",N=(o={})=>{const i=o.prefix||"Sc",e=o.importStyle??"css";return{type:"component",resolve:n=>{if(!n.startsWith(i))return;const s=n.slice(i.length).replace(/([a-z])([A-Z])/g,"$1-$2").toLowerCase(),V=`${S}/dist/es/${s}`;let t;const a=r=>{if(r==="scss")return`${S}/dist/scss/${s}.scss`;if(r==="css")return`${S}/dist/css/${s}.css`};if(typeof e=="function"){const r=e(s);r==="css"||r==="scss"?t=a(r):r===!0&&(t=a("css"))}else(e===!0||e==="css"||e==="scss")&&(t=a(e===!0?"css":e));return{name:n,from:V,sideEffects:t?[t]:void 0}}}},P=[l.ScAccordionInfoPanel,u.ScAnimatedNumber,d.ScDrawer,m.ScDropdown,p.ScGradualHighlight,c.ScHorizontalViewer,c.ScImageIndicator,w.ScInput,h.ScLayzImage,f.ScParameterBox,I.ScRadio,c.ScSwiperNormal,g.ScSwiperShowcase,q.ScSwiperVehicle,b.ScTabIndicator,y.ScVideo],v={install:o=>(P.forEach(i=>{o.use(i)}),o)};exports.ScAccordionInfoPanel=l.ScAccordionInfoPanel;exports.ScAnimatedNumber=u.ScAnimatedNumber;exports.ScDrawer=d.ScDrawer;exports.ScDropdown=m.ScDropdown;exports.ScGradualHighlight=p.ScGradualHighlight;exports.ScHorizontalViewer=c.ScHorizontalViewer;exports.ScImageIndicator=c.ScImageIndicator;exports.ScSwiperNormal=c.ScSwiperNormal;exports.ScInput=w.ScInput;exports.ScLayzImage=h.ScLayzImage;exports.ScParameterBox=f.ScParameterBox;exports.ScRadio=I.ScRadio;exports.ScSwiperShowcase=g.ScSwiperShowcase;exports.ScSwiperVehicle=q.ScSwiperVehicle;exports.ScTabIndicator=b.ScTabIndicator;exports.ScVideo=y.ScVideo;exports.ComponentsResolver=N;exports.default=v;
|
|
@@ -1 +1 @@
|
|
|
1
|
-
"use strict";Object.defineProperty(exports,Symbol.toStringTag,{value:"Module"});const e=require("../index-
|
|
1
|
+
"use strict";Object.defineProperty(exports,Symbol.toStringTag,{value:"Module"});const e=require("../index-C_05OlSq.cjs");exports.ScSwiperNormal=e.ScSwiperNormal;
|
|
@@ -0,0 +1 @@
|
|
|
1
|
+
"use strict";Object.defineProperty(exports,Symbol.toStringTag,{value:"Module"});const e=require("vue"),C=require("../swiper-bundle-l31DJOK1.cjs"),s=require("../_vars-CyrPevgT.cjs"),g=require("./layz-image.cjs"),V={class:"swiper-wrapper"},k=["disabled"],B=["disabled"],w=e.defineComponent({__name:"swiper-showcase",props:{dataList:{default:()=>[]},slidesPerView:{default:4},spaceBetween:{default:24},swiperOptions:{default:()=>({})},placeholder:{}},setup(l){const t=l;let a=null;const o=e.ref(),c=e.ref(!0),d=e.ref(!0),p=e.computed(()=>t.dataList&&t.dataList.length>0),u=i=>[`${s.PREFIX}-swiper-showcase__nav-btn`,i?`${s.PREFIX}-swiper-showcase__nav-btn--prev`:`${s.PREFIX}-swiper-showcase__nav-btn--next`],h=()=>{if(!a){c.value=!0,d.value=!0;return}c.value=a.isBeginning,d.value=a.isEnd},m=()=>{a&&(a.destroy(),a=null)},f=()=>{var r;if(m(),!o.value||!p.value)return;const i={0:{slidesPerView:1,spaceBetween:12},768:{slidesPerView:Math.min(2,t.slidesPerView),spaceBetween:16},1024:{slidesPerView:t.slidesPerView,spaceBetween:t.spaceBetween}};a=new C.Swiper(o.value,{slidesPerView:t.slidesPerView,spaceBetween:t.spaceBetween,observer:!0,observeParents:!0,...t.swiperOptions,breakpoints:{...i,...((r=t.swiperOptions)==null?void 0:r.breakpoints)||{}}}),a.on("slideChange",h),h()},v=()=>{a&&a.slideNext()},E=()=>{a&&a.slidePrev()};return e.watch(()=>[t.dataList,t.slidesPerView,t.spaceBetween,t.swiperOptions],()=>{e.nextTick(f)},{deep:!0}),e.onMounted(()=>{f()}),e.onBeforeUnmount(()=>{m()}),(i,r)=>p.value?(e.openBlock(),e.createElementBlock("div",{key:0,class:e.normalizeClass(`${e.unref(s.PREFIX)}-swiper-showcase`)},[e.createElementVNode("div",{ref_key:"swiperRef",ref:o,class:e.normalizeClass(`${e.unref(s.PREFIX)}-swiper-showcase__main`)},[e.createElementVNode("div",V,[(e.openBlock(!0),e.createElementBlock(e.Fragment,null,e.renderList(i.dataList,(n,_)=>(e.openBlock(),e.createElementBlock("div",{key:`${n.title}-${_}`,class:"swiper-slide"},[e.createElementVNode("div",{class:e.normalizeClass(`${e.unref(s.PREFIX)}-swiper-showcase__card`)},[e.createElementVNode("div",{class:e.normalizeClass(`${e.unref(s.PREFIX)}-swiper-showcase__media`)},[e.createVNode(e.unref(g.ScLayzImage),{src:n.url||i.placeholder||"",alt:n.alt||n.title||"",class:e.normalizeClass(`${e.unref(s.PREFIX)}-swiper-showcase__image`),"img-class":"sc-swiper-showcase__img"},null,8,["src","alt","class"])],2),e.createElementVNode("div",{class:e.normalizeClass(`${e.unref(s.PREFIX)}-swiper-showcase__info`)},[e.createElementVNode("div",{class:e.normalizeClass(`${e.unref(s.PREFIX)}-swiper-showcase__title`)},e.toDisplayString(n.title),3),n.desc?(e.openBlock(),e.createElementBlock("div",{key:0,class:e.normalizeClass(`${e.unref(s.PREFIX)}-swiper-showcase__desc`)},e.toDisplayString(n.desc),3)):e.createCommentVNode("v-if",!0)],2)],2)]))),128))])],2),e.createElementVNode("div",{class:e.normalizeClass(`${e.unref(s.PREFIX)}-swiper-showcase__nav`)},[e.createElementVNode("button",{type:"button",class:e.normalizeClass(u(!0)),disabled:c.value,"aria-label":"previous",onClick:E},[(e.openBlock(),e.createElementBlock("svg",{"aria-hidden":"true",class:e.normalizeClass(`${e.unref(s.PREFIX)}-swiper-showcase__nav-icon ${e.unref(s.PREFIX)}-swiper-showcase__nav-icon--prev`),width:"48",height:"48",viewBox:"0 0 48 48",fill:"none",xmlns:"http://www.w3.org/2000/svg"},[...r[0]||(r[0]=[e.createElementVNode("g",{id:"right"},[e.createElementVNode("path",{d:"M24 48C37.2548 48 48 37.2548 48 24C48 10.7452 37.2548 2.2267e-10 24 4.97351e-10C10.7452 7.72026e-10 0 10.7452 0 24C0 37.2548 10.7452 48 24 48Z",fill:"white","fill-opacity":"0.3"}),e.createElementVNode("path",{d:"M47.5 24C47.5 11.0213 36.9787 0.5 24 0.5C11.0213 0.5 0.5 11.0213 0.5 24C0.5 36.9787 11.0213 47.5 24 47.5C36.9787 47.5 47.5 36.9787 47.5 24Z",stroke:"white","stroke-opacity":"0.1"}),e.createElementVNode("path",{id:"Rectangle 302 (Stroke)",d:"M20.8076 14.8076L20.679 17.6098L27.0692 24L20.679 30.3902L20.8076 33.1924L30 24L20.8076 14.8076Z",fill:"white"})],-1)])],2))],10,k),e.createElementVNode("button",{type:"button",class:e.normalizeClass(u(!1)),disabled:d.value,"aria-label":"next",onClick:v},[(e.openBlock(),e.createElementBlock("svg",{"aria-hidden":"true",class:e.normalizeClass(`${e.unref(s.PREFIX)}-swiper-showcase__nav-icon`),width:"48",height:"48",viewBox:"0 0 48 48",fill:"none",xmlns:"http://www.w3.org/2000/svg"},[...r[1]||(r[1]=[e.createElementVNode("g",{id:"right"},[e.createElementVNode("path",{d:"M24 48C37.2548 48 48 37.2548 48 24C48 10.7452 37.2548 2.2267e-10 24 4.97351e-10C10.7452 7.72026e-10 0 10.7452 0 24C0 37.2548 10.7452 48 24 48Z",fill:"white","fill-opacity":"0.3"}),e.createElementVNode("path",{d:"M47.5 24C47.5 11.0213 36.9787 0.5 24 0.5C11.0213 0.5 0.5 11.0213 0.5 24C0.5 36.9787 11.0213 47.5 24 47.5C36.9787 47.5 47.5 36.9787 47.5 24Z",stroke:"white","stroke-opacity":"0.1"}),e.createElementVNode("path",{id:"Rectangle 302 (Stroke)",d:"M20.8076 14.8076L20.679 17.6098L27.0692 24L20.679 30.3902L20.8076 33.1924L30 24L20.8076 14.8076Z",fill:"white"})],-1)])],2))],10,B)],2)],2)):e.createCommentVNode("v-if",!0)}});w.install=l=>(l.component("ScSwiperShowcase",w),l);const P=w;exports.ScSwiperShowcase=P;
|
|
@@ -1 +1 @@
|
|
|
1
|
-
"use strict";Object.defineProperty(exports,Symbol.toStringTag,{value:"Module"});const e=require("../
|
|
1
|
+
"use strict";Object.defineProperty(exports,Symbol.toStringTag,{value:"Module"});const e=require("vue"),B=require("../swiper-bundle-l31DJOK1.cjs"),n=require("../_vars-CyrPevgT.cjs"),f=require("./layz-image.cjs"),b={class:"swiper-wrapper"},y=["onClick"],u=e.defineComponent({__name:"swiper-vehicle",props:{modelValue:{default:0},backgroundImgUrl:{},backgroundImgAlt:{},dataList:{},imgFullHeightInMobile:{type:Boolean},swiperOptions:{default:()=>({})},effect:{default:"fade"},indicatorClass:{},tabIndicatorBottom:{},showTextBackground:{type:Boolean}},emits:["change","update:modelValue"],setup(s,{emit:v}){const o=s,d=v;let l=null;const r=e.ref(o.modelValue),c=e.ref(),g=e.computed(()=>{const t={};return o.tabIndicatorBottom&&(t.position="absolute",t.zIndex=1,t.left="50%",t.bottom=typeof o.tabIndicatorBottom=="number"?`${o.tabIndicatorBottom}px`:o.tabIndicatorBottom,t.transform="translateX(-50%)"),t}),k=e.computed(()=>o.dataList[r.value].text);e.watch(()=>o.modelValue,t=>{r.value!==t&&(r.value=t,p(r.value))});const p=t=>{l==null||l.slideTo(t)},i=()=>{l==null||l.destroy(),c.value&&(l=new B.Swiper(c.value,{slidesPerView:1,allowTouchMove:!1,effect:o.effect,autoplay:!0,...o.swiperOptions}),l.on("realIndexChange",t=>{r.value=t.realIndex,d("change",t.realIndex),d("update:modelValue",t.realIndex)}))},I=()=>{(l==null?void 0:l.params.autoplay).enabled&&(l==null||l.autoplay.start())},h=()=>{(l==null?void 0:l.params.autoplay).enabled&&(l==null||l.autoplay.stop())};return e.onMounted(()=>{i(),window.addEventListener("resize",i)}),e.onBeforeUnmount(()=>{l==null||l.destroy(),window.removeEventListener("resize",i)}),(t,_)=>(e.openBlock(),e.createElementBlock("div",{class:e.normalizeClass([`${e.unref(n.PREFIX)}-swiper-vehicle`])},[t.backgroundImgUrl?(e.openBlock(),e.createBlock(e.unref(f.ScLayzImage),{key:0,class:e.normalizeClass(`${e.unref(n.PREFIX)}-swiper-vehicle__bg`),src:t.backgroundImgUrl,alt:t.backgroundImgAlt},null,8,["class","src","alt"])):e.createCommentVNode("v-if",!0),e.createElementVNode("div",{ref_key:"swiperRef",ref:c,class:e.normalizeClass([`${e.unref(n.PREFIX)}-swiper-vehicle__main`])},[e.createElementVNode("div",b,[(e.openBlock(!0),e.createElementBlock(e.Fragment,null,e.renderList(t.dataList,a=>(e.openBlock(),e.createElementBlock("div",{key:a.url,class:"swiper-slide"},[t.showTextBackground?(e.openBlock(),e.createElementBlock("span",{key:0,class:e.normalizeClass(`${e.unref(n.PREFIX)}-swiper-vehicle__text-bg`)},e.toDisplayString(a.text),3)):e.createCommentVNode("v-if",!0),e.createVNode(e.unref(f.ScLayzImage),{class:e.normalizeClass(t.imgFullHeightInMobile?`${e.unref(n.PREFIX)}-swiper-vehicle__full-height`:""),src:a.url,alt:a.alt},null,8,["class","src","alt"])]))),128))])],2),e.createElementVNode("div",{class:e.normalizeClass([`${e.unref(n.PREFIX)}-swiper-vehicle__indicator`,t.indicatorClass]),style:e.normalizeStyle(g.value)},[e.createElementVNode("div",{class:e.normalizeClass(`${e.unref(n.PREFIX)}-swiper-vehicle__indicator-control`)},[(e.openBlock(!0),e.createElementBlock(e.Fragment,null,e.renderList(t.dataList,(a,m)=>(e.openBlock(),e.createElementBlock("div",{key:a.color,class:e.normalizeClass([r.value===m&&"active","color-stroke"]),style:e.normalizeStyle({"background-color":a.color,"border-color":a.color}),onClick:w=>p(m),onMouseenter:h,onMouseleave:I},null,46,y))),128))],2),e.createElementVNode("div",{class:e.normalizeClass(`${e.unref(n.PREFIX)}-swiper-vehicle__indicator-text`)},e.toDisplayString(k.value),3)],6)],2))}});u.install=s=>(s.component("ScSwiperVehicle",u),s);const E=u;exports.ScSwiperVehicle=E;
|
|
@@ -0,0 +1 @@
|
|
|
1
|
+
.sc-swiper-showcase{width:100%;color:#fff;display:flex;flex-direction:column;gap:16px}.sc-swiper-showcase__main{width:100%}.sc-swiper-showcase .swiper-slide{height:auto}.sc-swiper-showcase__card{display:flex;flex-direction:column;overflow:hidden;height:100%}.sc-swiper-showcase__media{position:relative;width:100%}.sc-swiper-showcase__image{width:100%;height:100%;display:block}.sc-swiper-showcase .sc-img{width:100%;height:100%;object-fit:contain;background-color:transparent}.sc-swiper-showcase__info{margin-top:24px;display:flex;flex-direction:column;gap:6px}.sc-swiper-showcase__title{font-size:18px;line-height:26px;font-weight:600;letter-spacing:.2px}.sc-swiper-showcase__desc{color:#cfcfd6;font-size:14px;line-height:20px}.sc-swiper-showcase__nav{display:flex;gap:12px;justify-content:flex-end}.sc-swiper-showcase__nav-btn{width:48px;height:48px;border:none;background:transparent;padding:0;cursor:pointer;display:inline-flex;align-items:center;justify-content:center;transition:opacity .2s ease}.sc-swiper-showcase__nav-btn:hover:not(:disabled){opacity:.85}.sc-swiper-showcase__nav-btn:disabled{cursor:not-allowed;opacity:.35}.sc-swiper-showcase__nav-icon{width:48px;height:48px;display:block}.sc-swiper-showcase__nav-icon--prev{transform:rotate(180deg)}@media (max-width: 1024px){.sc-swiper-showcase__title{font-size:16px}.sc-swiper-showcase__desc{font-size:13px}.sc-swiper-showcase__nav{justify-content:center;padding-bottom:4px}}@media (max-width: 640px){.sc-swiper-showcase{gap:12px}.sc-swiper-showcase__info{padding:12px}}
|
package/dist/es/index.mjs
CHANGED
|
@@ -1,17 +1,18 @@
|
|
|
1
|
-
import { ScAccordionInfoPanel as
|
|
2
|
-
import { ScAnimatedNumber as
|
|
1
|
+
import { ScAccordionInfoPanel as p } from "./accordion-info-panel.mjs";
|
|
2
|
+
import { ScAnimatedNumber as f } from "./animated-number.mjs";
|
|
3
3
|
import { ScDrawer as S } from "./drawer.mjs";
|
|
4
4
|
import { ScDropdown as l } from "./dropdown.mjs";
|
|
5
5
|
import { ScGradualHighlight as d } from "./gradual-highlight.mjs";
|
|
6
|
-
import { S as u, a as h, b as w } from "../index-
|
|
6
|
+
import { S as u, a as h, b as w } from "../index-DfK8Ib64.js";
|
|
7
7
|
import { ScInput as y } from "./input.mjs";
|
|
8
8
|
import { ScLayzImage as g } from "./layz-image.mjs";
|
|
9
9
|
import { ScParameterBox as I } from "./parameter-box.mjs";
|
|
10
10
|
import { ScRadio as $ } from "./radio.mjs";
|
|
11
|
-
import {
|
|
12
|
-
import {
|
|
13
|
-
import {
|
|
14
|
-
|
|
11
|
+
import { ScSwiperShowcase as b } from "./swiper-showcase.mjs";
|
|
12
|
+
import { ScSwiperVehicle as v } from "./swiper-vehicle.mjs";
|
|
13
|
+
import { ScTabIndicator as x } from "./tab-indicator.mjs";
|
|
14
|
+
import { ScVideo as N } from "./video.mjs";
|
|
15
|
+
const n = "@seresweb/website-component", k = (t = {}) => {
|
|
15
16
|
const s = t.prefix || "Sc", o = t.importStyle ?? "css";
|
|
16
17
|
return {
|
|
17
18
|
type: "component",
|
|
@@ -34,15 +35,15 @@ const n = "@seresweb/website-component", Z = (t = {}) => {
|
|
|
34
35
|
};
|
|
35
36
|
}
|
|
36
37
|
};
|
|
37
|
-
},
|
|
38
|
-
install: (t) => (
|
|
38
|
+
}, P = [p, f, S, l, d, u, h, y, g, I, $, w, b, v, x, N], q = {
|
|
39
|
+
install: (t) => (P.forEach((s) => {
|
|
39
40
|
t.use(s);
|
|
40
41
|
}), t)
|
|
41
42
|
};
|
|
42
43
|
export {
|
|
43
|
-
|
|
44
|
-
|
|
45
|
-
|
|
44
|
+
k as ComponentsResolver,
|
|
45
|
+
p as ScAccordionInfoPanel,
|
|
46
|
+
f as ScAnimatedNumber,
|
|
46
47
|
S as ScDrawer,
|
|
47
48
|
l as ScDropdown,
|
|
48
49
|
d as ScGradualHighlight,
|
|
@@ -53,8 +54,9 @@ export {
|
|
|
53
54
|
I as ScParameterBox,
|
|
54
55
|
$ as ScRadio,
|
|
55
56
|
w as ScSwiperNormal,
|
|
56
|
-
b as
|
|
57
|
-
v as
|
|
58
|
-
x as
|
|
59
|
-
|
|
57
|
+
b as ScSwiperShowcase,
|
|
58
|
+
v as ScSwiperVehicle,
|
|
59
|
+
x as ScTabIndicator,
|
|
60
|
+
N as ScVideo,
|
|
61
|
+
q as default
|
|
60
62
|
};
|
|
@@ -0,0 +1,263 @@
|
|
|
1
|
+
import { defineComponent as y, ref as v, computed as P, watch as V, nextTick as x, onMounted as M, onBeforeUnmount as E, createElementBlock as c, createCommentVNode as k, openBlock as w, normalizeClass as i, unref as a, createElementVNode as e, Fragment as Z, renderList as N, createVNode as R, toDisplayString as b } from "vue";
|
|
2
|
+
import { S as O } from "../swiper-bundle-DTJcHqdp.js";
|
|
3
|
+
import { P as s } from "../_vars-BV4QQF-p.js";
|
|
4
|
+
import { ScLayzImage as z } from "./layz-image.mjs";
|
|
5
|
+
const D = { class: "swiper-wrapper" }, F = ["disabled"], I = ["disabled"], _ = /* @__PURE__ */ y({
|
|
6
|
+
__name: "swiper-showcase",
|
|
7
|
+
props: {
|
|
8
|
+
dataList: { default: () => [] },
|
|
9
|
+
slidesPerView: { default: 4 },
|
|
10
|
+
spaceBetween: { default: 24 },
|
|
11
|
+
swiperOptions: { default: () => ({}) },
|
|
12
|
+
placeholder: {}
|
|
13
|
+
},
|
|
14
|
+
setup(d) {
|
|
15
|
+
const t = d;
|
|
16
|
+
let r = null;
|
|
17
|
+
const p = v(), u = v(!0), h = v(!0), f = P(() => t.dataList && t.dataList.length > 0), g = (o) => [
|
|
18
|
+
`${s}-swiper-showcase__nav-btn`,
|
|
19
|
+
o ? `${s}-swiper-showcase__nav-btn--prev` : `${s}-swiper-showcase__nav-btn--next`
|
|
20
|
+
], m = () => {
|
|
21
|
+
if (!r) {
|
|
22
|
+
u.value = !0, h.value = !0;
|
|
23
|
+
return;
|
|
24
|
+
}
|
|
25
|
+
u.value = r.isBeginning, h.value = r.isEnd;
|
|
26
|
+
}, C = () => {
|
|
27
|
+
r && (r.destroy(), r = null);
|
|
28
|
+
}, L = () => {
|
|
29
|
+
var n;
|
|
30
|
+
if (C(), !p.value || !f.value) return;
|
|
31
|
+
const o = {
|
|
32
|
+
0: { slidesPerView: 1, spaceBetween: 12 },
|
|
33
|
+
768: { slidesPerView: Math.min(2, t.slidesPerView), spaceBetween: 16 },
|
|
34
|
+
1024: { slidesPerView: t.slidesPerView, spaceBetween: t.spaceBetween }
|
|
35
|
+
};
|
|
36
|
+
r = new O(p.value, {
|
|
37
|
+
slidesPerView: t.slidesPerView,
|
|
38
|
+
spaceBetween: t.spaceBetween,
|
|
39
|
+
observer: !0,
|
|
40
|
+
observeParents: !0,
|
|
41
|
+
...t.swiperOptions,
|
|
42
|
+
breakpoints: {
|
|
43
|
+
...o,
|
|
44
|
+
...((n = t.swiperOptions) == null ? void 0 : n.breakpoints) || {}
|
|
45
|
+
}
|
|
46
|
+
}), r.on("slideChange", m), m();
|
|
47
|
+
}, B = () => {
|
|
48
|
+
r && r.slideNext();
|
|
49
|
+
}, $ = () => {
|
|
50
|
+
r && r.slidePrev();
|
|
51
|
+
};
|
|
52
|
+
return V(
|
|
53
|
+
() => [t.dataList, t.slidesPerView, t.spaceBetween, t.swiperOptions],
|
|
54
|
+
() => {
|
|
55
|
+
x(L);
|
|
56
|
+
},
|
|
57
|
+
{ deep: !0 }
|
|
58
|
+
), M(() => {
|
|
59
|
+
L();
|
|
60
|
+
}), E(() => {
|
|
61
|
+
C();
|
|
62
|
+
}), (o, n) => f.value ? (w(), c(
|
|
63
|
+
"div",
|
|
64
|
+
{
|
|
65
|
+
key: 0,
|
|
66
|
+
class: i(`${a(s)}-swiper-showcase`)
|
|
67
|
+
},
|
|
68
|
+
[
|
|
69
|
+
e(
|
|
70
|
+
"div",
|
|
71
|
+
{
|
|
72
|
+
ref_key: "swiperRef",
|
|
73
|
+
ref: p,
|
|
74
|
+
class: i(`${a(s)}-swiper-showcase__main`)
|
|
75
|
+
},
|
|
76
|
+
[
|
|
77
|
+
e("div", D, [
|
|
78
|
+
(w(!0), c(
|
|
79
|
+
Z,
|
|
80
|
+
null,
|
|
81
|
+
N(o.dataList, (l, S) => (w(), c("div", {
|
|
82
|
+
key: `${l.title}-${S}`,
|
|
83
|
+
class: "swiper-slide"
|
|
84
|
+
}, [
|
|
85
|
+
e(
|
|
86
|
+
"div",
|
|
87
|
+
{
|
|
88
|
+
class: i(`${a(s)}-swiper-showcase__card`)
|
|
89
|
+
},
|
|
90
|
+
[
|
|
91
|
+
e(
|
|
92
|
+
"div",
|
|
93
|
+
{
|
|
94
|
+
class: i(`${a(s)}-swiper-showcase__media`)
|
|
95
|
+
},
|
|
96
|
+
[
|
|
97
|
+
R(a(z), {
|
|
98
|
+
src: l.url || o.placeholder || "",
|
|
99
|
+
alt: l.alt || l.title || "",
|
|
100
|
+
class: i(`${a(s)}-swiper-showcase__image`),
|
|
101
|
+
"img-class": "sc-swiper-showcase__img"
|
|
102
|
+
}, null, 8, ["src", "alt", "class"])
|
|
103
|
+
],
|
|
104
|
+
2
|
|
105
|
+
/* CLASS */
|
|
106
|
+
),
|
|
107
|
+
e(
|
|
108
|
+
"div",
|
|
109
|
+
{
|
|
110
|
+
class: i(`${a(s)}-swiper-showcase__info`)
|
|
111
|
+
},
|
|
112
|
+
[
|
|
113
|
+
e(
|
|
114
|
+
"div",
|
|
115
|
+
{
|
|
116
|
+
class: i(`${a(s)}-swiper-showcase__title`)
|
|
117
|
+
},
|
|
118
|
+
b(l.title),
|
|
119
|
+
3
|
|
120
|
+
/* TEXT, CLASS */
|
|
121
|
+
),
|
|
122
|
+
l.desc ? (w(), c(
|
|
123
|
+
"div",
|
|
124
|
+
{
|
|
125
|
+
key: 0,
|
|
126
|
+
class: i(`${a(s)}-swiper-showcase__desc`)
|
|
127
|
+
},
|
|
128
|
+
b(l.desc),
|
|
129
|
+
3
|
|
130
|
+
/* TEXT, CLASS */
|
|
131
|
+
)) : k("v-if", !0)
|
|
132
|
+
],
|
|
133
|
+
2
|
|
134
|
+
/* CLASS */
|
|
135
|
+
)
|
|
136
|
+
],
|
|
137
|
+
2
|
|
138
|
+
/* CLASS */
|
|
139
|
+
)
|
|
140
|
+
]))),
|
|
141
|
+
128
|
|
142
|
+
/* KEYED_FRAGMENT */
|
|
143
|
+
))
|
|
144
|
+
])
|
|
145
|
+
],
|
|
146
|
+
2
|
|
147
|
+
/* CLASS */
|
|
148
|
+
),
|
|
149
|
+
e(
|
|
150
|
+
"div",
|
|
151
|
+
{
|
|
152
|
+
class: i(`${a(s)}-swiper-showcase__nav`)
|
|
153
|
+
},
|
|
154
|
+
[
|
|
155
|
+
e("button", {
|
|
156
|
+
type: "button",
|
|
157
|
+
class: i(g(!0)),
|
|
158
|
+
disabled: u.value,
|
|
159
|
+
"aria-label": "previous",
|
|
160
|
+
onClick: $
|
|
161
|
+
}, [
|
|
162
|
+
(w(), c(
|
|
163
|
+
"svg",
|
|
164
|
+
{
|
|
165
|
+
"aria-hidden": "true",
|
|
166
|
+
class: i(`${a(s)}-swiper-showcase__nav-icon ${a(s)}-swiper-showcase__nav-icon--prev`),
|
|
167
|
+
width: "48",
|
|
168
|
+
height: "48",
|
|
169
|
+
viewBox: "0 0 48 48",
|
|
170
|
+
fill: "none",
|
|
171
|
+
xmlns: "http://www.w3.org/2000/svg"
|
|
172
|
+
},
|
|
173
|
+
[...n[0] || (n[0] = [
|
|
174
|
+
e(
|
|
175
|
+
"g",
|
|
176
|
+
{ id: "right" },
|
|
177
|
+
[
|
|
178
|
+
e("path", {
|
|
179
|
+
d: "M24 48C37.2548 48 48 37.2548 48 24C48 10.7452 37.2548 2.2267e-10 24 4.97351e-10C10.7452 7.72026e-10 0 10.7452 0 24C0 37.2548 10.7452 48 24 48Z",
|
|
180
|
+
fill: "white",
|
|
181
|
+
"fill-opacity": "0.3"
|
|
182
|
+
}),
|
|
183
|
+
e("path", {
|
|
184
|
+
d: "M47.5 24C47.5 11.0213 36.9787 0.5 24 0.5C11.0213 0.5 0.5 11.0213 0.5 24C0.5 36.9787 11.0213 47.5 24 47.5C36.9787 47.5 47.5 36.9787 47.5 24Z",
|
|
185
|
+
stroke: "white",
|
|
186
|
+
"stroke-opacity": "0.1"
|
|
187
|
+
}),
|
|
188
|
+
e("path", {
|
|
189
|
+
id: "Rectangle 302 (Stroke)",
|
|
190
|
+
d: "M20.8076 14.8076L20.679 17.6098L27.0692 24L20.679 30.3902L20.8076 33.1924L30 24L20.8076 14.8076Z",
|
|
191
|
+
fill: "white"
|
|
192
|
+
})
|
|
193
|
+
],
|
|
194
|
+
-1
|
|
195
|
+
/* CACHED */
|
|
196
|
+
)
|
|
197
|
+
])],
|
|
198
|
+
2
|
|
199
|
+
/* CLASS */
|
|
200
|
+
))
|
|
201
|
+
], 10, F),
|
|
202
|
+
e("button", {
|
|
203
|
+
type: "button",
|
|
204
|
+
class: i(g(!1)),
|
|
205
|
+
disabled: h.value,
|
|
206
|
+
"aria-label": "next",
|
|
207
|
+
onClick: B
|
|
208
|
+
}, [
|
|
209
|
+
(w(), c(
|
|
210
|
+
"svg",
|
|
211
|
+
{
|
|
212
|
+
"aria-hidden": "true",
|
|
213
|
+
class: i(`${a(s)}-swiper-showcase__nav-icon`),
|
|
214
|
+
width: "48",
|
|
215
|
+
height: "48",
|
|
216
|
+
viewBox: "0 0 48 48",
|
|
217
|
+
fill: "none",
|
|
218
|
+
xmlns: "http://www.w3.org/2000/svg"
|
|
219
|
+
},
|
|
220
|
+
[...n[1] || (n[1] = [
|
|
221
|
+
e(
|
|
222
|
+
"g",
|
|
223
|
+
{ id: "right" },
|
|
224
|
+
[
|
|
225
|
+
e("path", {
|
|
226
|
+
d: "M24 48C37.2548 48 48 37.2548 48 24C48 10.7452 37.2548 2.2267e-10 24 4.97351e-10C10.7452 7.72026e-10 0 10.7452 0 24C0 37.2548 10.7452 48 24 48Z",
|
|
227
|
+
fill: "white",
|
|
228
|
+
"fill-opacity": "0.3"
|
|
229
|
+
}),
|
|
230
|
+
e("path", {
|
|
231
|
+
d: "M47.5 24C47.5 11.0213 36.9787 0.5 24 0.5C11.0213 0.5 0.5 11.0213 0.5 24C0.5 36.9787 11.0213 47.5 24 47.5C36.9787 47.5 47.5 36.9787 47.5 24Z",
|
|
232
|
+
stroke: "white",
|
|
233
|
+
"stroke-opacity": "0.1"
|
|
234
|
+
}),
|
|
235
|
+
e("path", {
|
|
236
|
+
id: "Rectangle 302 (Stroke)",
|
|
237
|
+
d: "M20.8076 14.8076L20.679 17.6098L27.0692 24L20.679 30.3902L20.8076 33.1924L30 24L20.8076 14.8076Z",
|
|
238
|
+
fill: "white"
|
|
239
|
+
})
|
|
240
|
+
],
|
|
241
|
+
-1
|
|
242
|
+
/* CACHED */
|
|
243
|
+
)
|
|
244
|
+
])],
|
|
245
|
+
2
|
|
246
|
+
/* CLASS */
|
|
247
|
+
))
|
|
248
|
+
], 10, I)
|
|
249
|
+
],
|
|
250
|
+
2
|
|
251
|
+
/* CLASS */
|
|
252
|
+
)
|
|
253
|
+
],
|
|
254
|
+
2
|
|
255
|
+
/* CLASS */
|
|
256
|
+
)) : k("v-if", !0);
|
|
257
|
+
}
|
|
258
|
+
});
|
|
259
|
+
_.install = (d) => (d.component("ScSwiperShowcase", _), d);
|
|
260
|
+
const q = _;
|
|
261
|
+
export {
|
|
262
|
+
q as ScSwiperShowcase
|
|
263
|
+
};
|
|
@@ -1,4 +1,160 @@
|
|
|
1
|
-
import {
|
|
1
|
+
import { defineComponent as M, ref as b, computed as I, watch as E, onMounted as T, onBeforeUnmount as A, createElementBlock as c, openBlock as n, normalizeClass as l, unref as o, createBlock as F, createCommentVNode as k, createElementVNode as u, Fragment as _, renderList as w, createVNode as U, toDisplayString as y, normalizeStyle as B } from "vue";
|
|
2
|
+
import { S as N } from "../swiper-bundle-DTJcHqdp.js";
|
|
3
|
+
import { P as s } from "../_vars-BV4QQF-p.js";
|
|
4
|
+
import { ScLayzImage as V } from "./layz-image.mjs";
|
|
5
|
+
const P = { class: "swiper-wrapper" }, R = ["onClick"], f = /* @__PURE__ */ M({
|
|
6
|
+
__name: "swiper-vehicle",
|
|
7
|
+
props: {
|
|
8
|
+
modelValue: { default: 0 },
|
|
9
|
+
backgroundImgUrl: {},
|
|
10
|
+
backgroundImgAlt: {},
|
|
11
|
+
dataList: {},
|
|
12
|
+
imgFullHeightInMobile: { type: Boolean },
|
|
13
|
+
swiperOptions: { default: () => ({}) },
|
|
14
|
+
effect: { default: "fade" },
|
|
15
|
+
indicatorClass: {},
|
|
16
|
+
tabIndicatorBottom: {},
|
|
17
|
+
showTextBackground: { type: Boolean }
|
|
18
|
+
},
|
|
19
|
+
emits: ["change", "update:modelValue"],
|
|
20
|
+
setup(d, { emit: $ }) {
|
|
21
|
+
const a = d, m = $;
|
|
22
|
+
let t = null;
|
|
23
|
+
const i = b(a.modelValue), p = b(), C = I(() => {
|
|
24
|
+
const e = {};
|
|
25
|
+
return a.tabIndicatorBottom && (e.position = "absolute", e.zIndex = 1, e.left = "50%", e.bottom = typeof a.tabIndicatorBottom == "number" ? `${a.tabIndicatorBottom}px` : a.tabIndicatorBottom, e.transform = "translateX(-50%)"), e;
|
|
26
|
+
}), L = I(() => a.dataList[i.value].text);
|
|
27
|
+
E(
|
|
28
|
+
() => a.modelValue,
|
|
29
|
+
(e) => {
|
|
30
|
+
i.value !== e && (i.value = e, g(i.value));
|
|
31
|
+
}
|
|
32
|
+
);
|
|
33
|
+
const g = (e) => {
|
|
34
|
+
t == null || t.slideTo(e);
|
|
35
|
+
}, v = () => {
|
|
36
|
+
t == null || t.destroy(), p.value && (t = new N(p.value, {
|
|
37
|
+
slidesPerView: 1,
|
|
38
|
+
allowTouchMove: !1,
|
|
39
|
+
effect: a.effect,
|
|
40
|
+
autoplay: !0,
|
|
41
|
+
...a.swiperOptions
|
|
42
|
+
}), t.on("realIndexChange", (e) => {
|
|
43
|
+
i.value = e.realIndex, m("change", e.realIndex), m("update:modelValue", e.realIndex);
|
|
44
|
+
}));
|
|
45
|
+
}, x = () => {
|
|
46
|
+
(t == null ? void 0 : t.params.autoplay).enabled && (t == null || t.autoplay.start());
|
|
47
|
+
}, z = () => {
|
|
48
|
+
(t == null ? void 0 : t.params.autoplay).enabled && (t == null || t.autoplay.stop());
|
|
49
|
+
};
|
|
50
|
+
return T(() => {
|
|
51
|
+
v(), window.addEventListener("resize", v);
|
|
52
|
+
}), A(() => {
|
|
53
|
+
t == null || t.destroy(), window.removeEventListener("resize", v);
|
|
54
|
+
}), (e, H) => (n(), c(
|
|
55
|
+
"div",
|
|
56
|
+
{
|
|
57
|
+
class: l([`${o(s)}-swiper-vehicle`])
|
|
58
|
+
},
|
|
59
|
+
[
|
|
60
|
+
e.backgroundImgUrl ? (n(), F(o(V), {
|
|
61
|
+
key: 0,
|
|
62
|
+
class: l(`${o(s)}-swiper-vehicle__bg`),
|
|
63
|
+
src: e.backgroundImgUrl,
|
|
64
|
+
alt: e.backgroundImgAlt
|
|
65
|
+
}, null, 8, ["class", "src", "alt"])) : k("v-if", !0),
|
|
66
|
+
u(
|
|
67
|
+
"div",
|
|
68
|
+
{
|
|
69
|
+
ref_key: "swiperRef",
|
|
70
|
+
ref: p,
|
|
71
|
+
class: l([`${o(s)}-swiper-vehicle__main`])
|
|
72
|
+
},
|
|
73
|
+
[
|
|
74
|
+
u("div", P, [
|
|
75
|
+
(n(!0), c(
|
|
76
|
+
_,
|
|
77
|
+
null,
|
|
78
|
+
w(e.dataList, (r) => (n(), c("div", {
|
|
79
|
+
key: r.url,
|
|
80
|
+
class: "swiper-slide"
|
|
81
|
+
}, [
|
|
82
|
+
e.showTextBackground ? (n(), c(
|
|
83
|
+
"span",
|
|
84
|
+
{
|
|
85
|
+
key: 0,
|
|
86
|
+
class: l(`${o(s)}-swiper-vehicle__text-bg`)
|
|
87
|
+
},
|
|
88
|
+
y(r.text),
|
|
89
|
+
3
|
|
90
|
+
/* TEXT, CLASS */
|
|
91
|
+
)) : k("v-if", !0),
|
|
92
|
+
U(o(V), {
|
|
93
|
+
class: l(e.imgFullHeightInMobile ? `${o(s)}-swiper-vehicle__full-height` : ""),
|
|
94
|
+
src: r.url,
|
|
95
|
+
alt: r.alt
|
|
96
|
+
}, null, 8, ["class", "src", "alt"])
|
|
97
|
+
]))),
|
|
98
|
+
128
|
|
99
|
+
/* KEYED_FRAGMENT */
|
|
100
|
+
))
|
|
101
|
+
])
|
|
102
|
+
],
|
|
103
|
+
2
|
|
104
|
+
/* CLASS */
|
|
105
|
+
),
|
|
106
|
+
u(
|
|
107
|
+
"div",
|
|
108
|
+
{
|
|
109
|
+
class: l([`${o(s)}-swiper-vehicle__indicator`, e.indicatorClass]),
|
|
110
|
+
style: B(C.value)
|
|
111
|
+
},
|
|
112
|
+
[
|
|
113
|
+
u(
|
|
114
|
+
"div",
|
|
115
|
+
{
|
|
116
|
+
class: l(`${o(s)}-swiper-vehicle__indicator-control`)
|
|
117
|
+
},
|
|
118
|
+
[
|
|
119
|
+
(n(!0), c(
|
|
120
|
+
_,
|
|
121
|
+
null,
|
|
122
|
+
w(e.dataList, (r, h) => (n(), c("div", {
|
|
123
|
+
key: r.color,
|
|
124
|
+
class: l([i.value === h && "active", "color-stroke"]),
|
|
125
|
+
style: B({ "background-color": r.color, "border-color": r.color }),
|
|
126
|
+
onClick: (O) => g(h),
|
|
127
|
+
onMouseenter: z,
|
|
128
|
+
onMouseleave: x
|
|
129
|
+
}, null, 46, R))),
|
|
130
|
+
128
|
|
131
|
+
/* KEYED_FRAGMENT */
|
|
132
|
+
))
|
|
133
|
+
],
|
|
134
|
+
2
|
|
135
|
+
/* CLASS */
|
|
136
|
+
),
|
|
137
|
+
u(
|
|
138
|
+
"div",
|
|
139
|
+
{
|
|
140
|
+
class: l(`${o(s)}-swiper-vehicle__indicator-text`)
|
|
141
|
+
},
|
|
142
|
+
y(L.value),
|
|
143
|
+
3
|
|
144
|
+
/* TEXT, CLASS */
|
|
145
|
+
)
|
|
146
|
+
],
|
|
147
|
+
6
|
|
148
|
+
/* CLASS, STYLE */
|
|
149
|
+
)
|
|
150
|
+
],
|
|
151
|
+
2
|
|
152
|
+
/* CLASS */
|
|
153
|
+
));
|
|
154
|
+
}
|
|
155
|
+
});
|
|
156
|
+
f.install = (d) => (d.component("ScSwiperVehicle", f), d);
|
|
157
|
+
const G = f;
|
|
2
158
|
export {
|
|
3
|
-
|
|
159
|
+
G as ScSwiperVehicle
|
|
4
160
|
};
|
package/dist/global.d.ts
CHANGED
|
@@ -4,6 +4,7 @@ declare module 'vue' {
|
|
|
4
4
|
ScVideo: typeof import("@seresweb/website-component")["ScVideo"];
|
|
5
5
|
ScTabIndicator: typeof import("@seresweb/website-component")["ScTabIndicator"];
|
|
6
6
|
ScSwiperVehicle: typeof import("@seresweb/website-component")["ScSwiperVehicle"];
|
|
7
|
+
ScSwiperShowcase: typeof import("@seresweb/website-component")["ScSwiperShowcase"];
|
|
7
8
|
ScSwiperNormal: typeof import("@seresweb/website-component")["ScSwiperNormal"];
|
|
8
9
|
ScRadio: typeof import("@seresweb/website-component")["ScRadio"];
|
|
9
10
|
ScParameterBox: typeof import("@seresweb/website-component")["ScParameterBox"];
|
|
@@ -0,0 +1 @@
|
|
|
1
|
+
"use strict";const e=require("vue"),H=require("./swiper-bundle-l31DJOK1.cjs"),r=require("./_vars-CyrPevgT.cjs");require("./cjs/accordion-info-panel.cjs");require("./cjs/animated-number.cjs");require("./cjs/drawer.cjs");require("./cjs/dropdown.cjs");require("./cjs/gradual-highlight.cjs");const X=require("@vavt/util");require("./cjs/input.cjs");const V=require("./cjs/layz-image.cjs");require("./cjs/parameter-box.cjs");require("./cjs/radio.cjs");require("./cjs/swiper-showcase.cjs");require("./cjs/swiper-vehicle.cjs");const q=require("./cjs/tab-indicator.cjs"),$=require("./cjs/video.cjs"),W=["innerHTML"],O=["innerHTML"],U=["innerHTML"],D=["innerHTML"],A=e.defineComponent({__name:"pc-viewer",props:{title:{},desc:{},dataList:{},extraTopSpacing:{default:0},extraBottomSpacing:{default:0}},setup(l){const p=l,a=e.ref(),v=e.ref(),o=e.ref(),d=e.ref(),f=e.ref(),i=e.ref(),h=e.reactive({container:"",root:"",item:""}),u=n=>typeof n!="number"||Number.isNaN(n)?0:n,g=(n,s,c)=>{const k=Math.min(Math.max(n,0),c),_=Math.min(Math.max(s,0),Math.max(c-k,0));return{safeTop:k,safeBottom:_}},B=()=>{var b;if(!o.value)return;const n=o.value.offsetHeight,s=window.innerHeight,c=((b=i.value)==null?void 0:b.offsetHeight)||0,k=m(i.value),_=u(p.extraTopSpacing),E=u(p.extraBottomSpacing),{safeTop:I,safeBottom:L}=g(_,E,s),C=Math.max(s-I-L,0),z=Math.max((C-c-n-k)/2,0),M=I+z,N=L+z;h.container=`padding-top: ${M}px; padding-bottom: ${N}px; min-height: ${s}px;`;const x=o.value.scrollWidth;h.root=`height: ${Math.max(x,s)}px`},t=()=>{const n=document.documentElement.getAttribute("dir")||"ltr",s=n==="rtl"?"right":"left";if(!a.value||!o.value||!d.value||!f.value)return;const k=a.value.clientHeight-window.innerHeight,{offsetTop:_}=X.getRootOffset(a.value),E=document.documentElement.scrollTop-_;if(E<0){o.value.scrollTo({left:0}),f.value.style[s]="0px";return}if(E>k){const z=o.value.scrollWidth-window.innerWidth;o.value.scrollTo({left:n==="rtl"?-z:z}),f.value.style[s]=d.value.clientWidth-f.value.clientWidth+"px";return}const I=E/k,L=I*(o.value.scrollWidth-window.innerWidth),C=I*(d.value.clientWidth*2/3);o.value.scrollTo({left:n==="rtl"?-L:L}),f.value.style[s]=`${C}px`},w=()=>{h.container="",B()},m=n=>{if(!(n instanceof HTMLElement))return 0;const s=window.getComputedStyle(n),c=parseFloat(s.marginTop)||0,k=parseFloat(s.marginBottom)||0;return c+k};let y;return e.watch(()=>[p.extraTopSpacing,p.extraBottomSpacing],()=>{h.container="",B()}),e.onMounted(()=>{y=new IntersectionObserver(n=>{n.forEach(s=>{s.isIntersecting&&(h.container="",B())})},{root:null,rootMargin:"200px 0px 200px 0px",threshold:0}),window.addEventListener("scroll",t),window.addEventListener("resize",w),a.value&&y.observe(a.value)}),e.onBeforeUnmount(()=>{window.removeEventListener("scroll",t),window.removeEventListener("resize",w),y&&y.disconnect()}),(n,s)=>(e.openBlock(),e.createElementBlock("div",{ref_key:"rootRef",ref:a,class:e.normalizeClass(`${e.unref(r.PREFIX)}-horizontal-viewer`),style:e.normalizeStyle(h.root)},[e.createElementVNode("div",{ref_key:"containerRef",ref:v,class:e.normalizeClass([`${e.unref(r.PREFIX)}-horizontal-viewer__container`,(n.title||n.desc)&&"has-header"]),style:e.normalizeStyle(h.container)},[n.title||n.desc?(e.openBlock(),e.createElementBlock("div",{key:0,class:e.normalizeClass(`${e.unref(r.PREFIX)}-horizontal-viewer__header`),ref_key:"headerRef",ref:i},[n.title?(e.openBlock(),e.createElementBlock("p",{key:0,innerHTML:n.title},null,8,W)):e.createCommentVNode("v-if",!0),n.desc?(e.openBlock(),e.createElementBlock("p",{key:1,innerHTML:n.desc},null,8,O)):e.createCommentVNode("v-if",!0)],2)):e.createCommentVNode("v-if",!0),e.createElementVNode("div",{ref_key:"scrollerRef",ref:o,class:e.normalizeClass(`${e.unref(r.PREFIX)}-horizontal-viewer__scroller`)},[e.createElementVNode("div",{class:e.normalizeClass(`${e.unref(r.PREFIX)}-horizontal-viewer__content`)},[(e.openBlock(!0),e.createElementBlock(e.Fragment,null,e.renderList(n.dataList,c=>(e.openBlock(),e.createElementBlock("div",{key:c.title,class:e.normalizeClass(`${e.unref(r.PREFIX)}-horizontal-viewer__content-item`)},[c.type==="img"?(e.openBlock(),e.createBlock(e.unref(V.ScLayzImage),{key:0,src:c.url,alt:c.alt},null,8,["src","alt"])):(e.openBlock(),e.createBlock(e.unref($.ScVideo),{key:1,url:c.url,poster:c.poster,"auto-play":!1},null,8,["url","poster"])),e.createElementVNode("div",{class:e.normalizeClass(`${e.unref(r.PREFIX)}-horizontal-viewer__content-item-footer`)},[e.createElementVNode("p",{innerHTML:c.title},null,8,U),e.createElementVNode("p",{innerHTML:c.desc},null,8,D)],2)],2))),128))],2)],2),e.createElementVNode("div",{ref_key:"paginationRef",ref:d,class:e.normalizeClass(`${e.unref(r.PREFIX)}-horizontal-viewer__pagination`)},[e.createElementVNode("div",{class:e.normalizeClass(`${e.unref(r.PREFIX)}-horizontal-viewer__scrollbar`)},[e.createElementVNode("div",{ref_key:"scrollbarDragRef",ref:f,class:e.normalizeClass(`${e.unref(r.PREFIX)}-horizontal-viewer__scrollbar-drag`)},null,2)],2)],2)],6)],6))}}),Y=e.defineComponent({__name:"mb-viewer",props:{title:{},desc:{},isMobile:{type:Boolean},extraTopSpacing:{},extraBottomSpacing:{},modelValue:{},dataList:{},swiperOptions:{},effect:{},showIntro:{type:Boolean},videoProps:{},indicatorClass:{},tabIndicatorBottom:{},widthType:{},indicatorType:{},showIndicator:{type:Boolean},indicatorPosition:{}},setup(l){const p=l,a=e.ref();return(v,o)=>(e.openBlock(),e.createElementBlock("div",{ref_key:"rootRef",ref:a,class:e.normalizeClass(`${e.unref(r.PREFIX)}-horizontal-viewer-mb`)},[e.createVNode(e.unref(F),e.mergeProps(p,{indicatorType:"image"}),null,16)],2))}}),R=e.defineComponent({__name:"horizontal-viewer",props:{title:{},desc:{},isMobile:{type:Boolean},extraTopSpacing:{},extraBottomSpacing:{},modelValue:{},dataList:{},swiperOptions:{},effect:{},showIntro:{type:Boolean},videoProps:{},indicatorClass:{},tabIndicatorBottom:{},widthType:{},indicatorType:{},showIndicator:{type:Boolean,default:!0},indicatorPosition:{}},setup(l){const p=l;return(a,v)=>a.isMobile?(e.openBlock(),e.createBlock(Y,e.normalizeProps(e.mergeProps({key:0},p)),null,16)):(e.openBlock(),e.createBlock(A,e.normalizeProps(e.mergeProps({key:1},p)),null,16))}});R.install=l=>(l.component("ScHorizontalViewer",R),l);const Z=R,j=["onClick"],G=["innerHTML"],J=["innerHTML"],P=e.defineComponent({__name:"image-indicator",props:{dataList:{},showIntro:{type:Boolean,default:!0}},emits:["change"],setup(l,{emit:p}){const a=p,v=e.ref(0),o=e.ref([]),d=e.computed(()=>{const i=o.value[v.value];return{height:`${i==null?void 0:i.offsetHeight}px`}}),f=i=>{v.value=i,a("change",i)};return(i,h)=>(e.openBlock(),e.createElementBlock("div",{class:e.normalizeClass(`${e.unref(r.PREFIX)}-image-indicator`)},[e.createElementVNode("div",{class:e.normalizeClass(`${e.unref(r.PREFIX)}-image-indicator__list`)},[(e.openBlock(!0),e.createElementBlock(e.Fragment,null,e.renderList(i.dataList,(u,g)=>(e.openBlock(),e.createElementBlock("div",{key:u.url,class:e.normalizeClass([`${e.unref(r.PREFIX)}-image-indicator__list-item`,v.value===g?`${e.unref(r.PREFIX)}-image-indicator__active`:""]),onClick:B=>f(g)},[e.createVNode(e.unref(V.ScLayzImage),{src:u.url,alt:u.alt},null,8,["src","alt"])],10,j))),128))],2),i.showIntro?(e.openBlock(),e.createElementBlock("div",{key:0,class:e.normalizeClass(`${e.unref(r.PREFIX)}-image-indicator__intro`),style:e.normalizeStyle(d.value)},[(e.openBlock(!0),e.createElementBlock(e.Fragment,null,e.renderList(i.dataList,(u,g)=>(e.openBlock(),e.createElementBlock("div",{key:u.url,ref_for:!0,ref_key:"introItemRef",ref:o,class:e.normalizeClass([`${e.unref(r.PREFIX)}-image-indicator__intro-item`,v.value===g&&`${e.unref(r.PREFIX)}-image-indicator__active`])},[u.title?(e.openBlock(),e.createElementBlock("p",{key:0,class:e.normalizeClass(`${e.unref(r.PREFIX)}-image-indicator__intro-title`),innerHTML:u.title},null,10,G)):e.createCommentVNode("v-if",!0),u.desc?(e.openBlock(),e.createElementBlock("p",{key:1,class:e.normalizeClass(`${e.unref(r.PREFIX)}-image-indicator__intro-desc`),innerHTML:u.desc},null,10,J)):e.createCommentVNode("v-if",!0)],2))),128))],6)):e.createCommentVNode("v-if",!0)],2))}});P.install=l=>(l.component("ScImageIndicator",P),l);const T=P,K={class:"swiper-wrapper"},S=e.defineComponent({__name:"swiper-normal",props:{modelValue:{default:0},dataList:{},swiperOptions:{default:()=>({})},effect:{},showIntro:{type:Boolean,default:!0},videoProps:{},indicatorClass:{},tabIndicatorBottom:{},widthType:{default:"full"},indicatorType:{default:"tab"},showIndicator:{type:Boolean,default:!0},indicatorPosition:{default:"relative"}},emits:["change","update:modelValue"],setup(l,{emit:p}){const a=l,v=p;let o=null;const d=e.ref(a.modelValue),f=e.ref(),i=e.computed(()=>{const t=[`${r.PREFIX}-swiper-main`];return a.widthType==="middle"?t.push(`${r.PREFIX}-swiper-main__middle`):t.push(`${r.PREFIX}-swiper-main__full`),t}),h=e.computed(()=>{const t={};return a.tabIndicatorBottom&&(t.position="absolute",t.zIndex=1,t.bottom=typeof a.tabIndicatorBottom=="number"?`${a.tabIndicatorBottom}px`:a.tabIndicatorBottom),t});e.watch(()=>a.modelValue,()=>{d.value=a.modelValue,g(d.value)});const u=e.computed(()=>a.dataList.map(t=>({...t,url:t.type==="img"?t.url||"":t.poster||""}))),g=t=>{o==null||o.slideTo(t)},B=()=>{o==null||o.destroy(),f.value&&(o=new H.Swiper(f.value,{slidesPerView:1,allowTouchMove:!1,effect:a.effect,navigation:{nextEl:".swiper-button-next",prevEl:".swiper-button-prev"},...a.swiperOptions}),o.on("slideChange",t=>{d.value=t.activeIndex,v("change",t.activeIndex),v("update:modelValue",t.activeIndex)}))};return e.onMounted(()=>{B(),window.addEventListener("resize",B)}),e.onBeforeUnmount(()=>{o==null||o.destroy(),window.removeEventListener("resize",B)}),(t,w)=>(e.openBlock(),e.createElementBlock("div",{class:e.normalizeClass(`${e.unref(r.PREFIX)}-swiper`)},[e.createElementVNode("div",{ref_key:"swiperRef",ref:f,class:e.normalizeClass(i.value)},[e.createElementVNode("div",K,[(e.openBlock(!0),e.createElementBlock(e.Fragment,null,e.renderList(t.dataList,(m,y)=>(e.openBlock(),e.createElementBlock("div",{key:m.title,class:"swiper-slide"},[m.type==="img"?(e.openBlock(),e.createBlock(e.unref(V.ScLayzImage),{key:0,src:m.url,alt:m.alt},null,8,["src","alt"])):(e.openBlock(),e.createBlock(e.unref($.ScVideo),e.mergeProps({key:1,ref_for:!0},t.videoProps,{url:m.url,poster:m.poster,playable:d.value===y}),null,16,["url","poster","playable"])),m.mask?(e.openBlock(),e.createElementBlock("div",{key:2,class:e.normalizeClass(`${e.unref(r.PREFIX)}-swiper-mask`)},null,2)):e.createCommentVNode("v-if",!0)]))),128))]),w[2]||(w[2]=e.createStaticVNode('<div class="swiper-button-next"><svg xmlns="http://www.w3.org/2000/svg" width="25" height="24" viewBox="0 0 25 24" fill="none"><path d="M9.64299 3.12871L9.51887 5.83301L15.6859 12L9.51887 18.167L9.64299 20.8713L18.5143 12L9.64299 3.12871Z" fill="white"></path></svg></div><div class="swiper-button-prev"><svg xmlns="http://www.w3.org/2000/svg" width="24" height="24" viewBox="0 0 24 24" fill="none"><path d="M15.1289 3.12871L15.2531 5.83301L9.08609 12L15.2531 18.167L15.1289 20.8713L6.25766 12L15.1289 3.12871Z" fill="white"></path></svg></div>',2))],2),t.showIndicator?(e.openBlock(),e.createElementBlock(e.Fragment,{key:0},[t.indicatorType==="tab"?(e.openBlock(),e.createBlock(e.unref(q.ScTabIndicator),{key:0,modelValue:d.value,"onUpdate:modelValue":w[0]||(w[0]=m=>d.value=m),class:e.normalizeClass([t.indicatorClass,t.indicatorPosition==="absolute"&&`${e.unref(r.PREFIX)}-swiper-indicator-absolute`]),dataList:t.dataList,"show-intro":t.showIntro,style:e.normalizeStyle(h.value),onChange:g},null,8,["modelValue","class","dataList","show-intro","style"])):(e.openBlock(),e.createBlock(e.unref(T),{key:1,modelValue:d.value,"onUpdate:modelValue":w[1]||(w[1]=m=>d.value=m),dataList:u.value,onChange:g},null,8,["modelValue","dataList"]))],64)):e.createCommentVNode("v-if",!0)],2))}});S.install=l=>(l.component("ScSwiperNormal",S),l);const F=S;exports.ScHorizontalViewer=Z;exports.ScImageIndicator=T;exports.ScSwiperNormal=F;
|