st-common-ui-vue3
Version:
小尾巴通用 Vue3 UI 组件库
2 lines (1 loc) • 2.6 kB
JavaScript
"use strict";const e=require("vue"),i=require("../../node_modules/.pnpm/st-common-ui-utils@0.1.1/node_modules/st-common-ui-utils/es/utils/el-size-util.js"),d=require("../../node_modules/.pnpm/@vueuse_core@12.0.0_typescript@5.6.2/node_modules/@vueuse/core/index.js"),a=["src"],s={class:"st-info-card-1__title-box"},m={class:"st-info-card-1__content-box"},u={class:"st-info-card-1__content-box__content"},f=e.defineComponent({name:"StInfoCard1",__name:"StInfoCard1",props:{width:{default:"100%"},height:{default:"auto"},padding:{default:"1rem"},background:{default:"#fff"},imgSrc:{default:""},imgWidth:{default:"100%"},imgHeight:{default:"100%"},imgFillMode:{default:"cover"},imgPosition:{default:"center"},imgSpeed:{default:500},imgDelay:{default:0},title:{default:""},titleFontSize:{default:"1.25rem"},content:{default:""},contentSpeed:{default:500},contentDelay:{default:150}},setup(c){const n=e.ref(),l=e.ref(),r=e.ref();return e.onMounted(()=>{l.value=d.useElementSize(n.value).width.value,r.value=d.useElementSize(n.value).height.value}),(t,o)=>(e.openBlock(),e.createElementBlock("div",{class:"st-info-card-1-container",style:e.normalizeStyle({"--padding":e.unref(i).elSizePreHandler(t.padding),"--img-width":e.unref(i).elSizePreHandler(l.value||t.imgWidth),"--img-height":e.unref(i).elSizePreHandler(r.value||t.imgHeight),"--img-speed":e.unref(i).elSizePreHandler(t.imgSpeed,"ms"),"--img-delay":e.unref(i).elSizePreHandler(t.imgDelay,"ms"),"--content-speed":e.unref(i).elSizePreHandler(t.contentSpeed,"ms"),"--content-delay":e.unref(i).elSizePreHandler(t.contentDelay,"ms")})},[e.createElementVNode("div",{class:"st-info-card-1",style:e.normalizeStyle({width:e.unref(i).elSizePreHandler(t.width),height:e.unref(i).elSizePreHandler(t.height),background:t.background})},[o[0]||(o[0]=e.createElementVNode("div",{class:"st-info-card-1__img-placeholder"},null,-1)),e.createElementVNode("div",{ref_key:"imgBoxRef",ref:n,class:"st-info-card-1__img-box"},[e.renderSlot(t.$slots,"img",{},()=>[e.createElementVNode("img",{class:"st-info-card-1__img-box__img",style:e.normalizeStyle({objectFit:t.imgFillMode,objectPosition:t.imgPosition}),src:t.imgSrc,alt:"img"},null,12,a)],!0)],512),e.createElementVNode("div",s,[e.renderSlot(t.$slots,"title",{},()=>[e.createElementVNode("div",{class:"st-info-card-1__title-box__title",style:e.normalizeStyle({fontSize:e.unref(i).elSizePreHandler(t.titleFontSize)})},e.toDisplayString(t.title),5)],!0)]),e.createElementVNode("div",m,[e.renderSlot(t.$slots,"content",{},()=>[e.createElementVNode("div",u,e.toDisplayString(t.content),1)],!0)])],4)],4))}});module.exports=f;