epic-designer
Version:
基于vue3的设计器,可视化开发页面表单
2 lines (1 loc) • 2.27 kB
JavaScript
"use strict";const e=require("vue"),u=require("../icon/icon.vue.cjs"),f=require("./collapseContext.cjs"),v={class:"ep-collapse-panel__header-content"},_={key:1,class:"ep-collapse-panel__title"},h={class:"ep-collapse-panel__content-wrapper"},m=e.defineComponent({__name:"collapsePanel",props:{bordered:{type:Boolean,default:!0},customClass:{default:""},defaultExpanded:{type:Boolean,default:!1},disabled:{type:Boolean,default:!1},name:{default:""},title:{default:""}},setup(n){const s=n,l=e.inject(f.COLLAPSE_CONTEXT_KEY),o=e.ref(s.name||Symbol("collapse-panel")),r=e.ref(),a=e.computed(()=>l?l.isPanelActive(o.value):!1),c=()=>{s.disabled||!l||l.togglePanel(o.value)},i=t=>{t.style.height="0",t.style.overflow="hidden",setTimeout(()=>{r.value&&(t.style.height=`${r.value.offsetHeight}px`)},0)},d=t=>{t.style.height="auto",t.style.overflow="visible"},p=t=>{t.style.height=`${t.offsetHeight}px`,t.style.overflow="hidden",setTimeout(()=>{t.style.height="0"},0)};return e.onMounted(()=>{l&&(l.registerPanel(o.value),(l.defaultExpandAll||s.defaultExpanded&&!a.value)&&l.togglePanel(o.value))}),e.onUnmounted(()=>{l&&l.unregisterPanel(o.value)}),(t,y)=>(e.openBlock(),e.createElementBlock("div",{class:e.normalizeClass(["ep-collapse-panel",{"ep-collapse-panel--active":a.value,"ep-collapse-panel--bordered":n.bordered}])},[e.createElementVNode("div",{class:e.normalizeClass(["ep-collapse-panel__header",{"ep-collapse-panel__header--active":a.value}]),onClick:c},[e.createElementVNode("div",v,[t.$slots.header?e.renderSlot(t.$slots,"header",{key:0,active:a.value},void 0,!0):(e.openBlock(),e.createElementBlock("span",_,e.toDisplayString(n.title),1))]),e.createElementVNode("div",{class:e.normalizeClass(["ep-collapse-panel__arrow",{"ep-collapse-panel__arrow--active":a.value}])},[e.renderSlot(t.$slots,"arrow",{},()=>[e.createVNode(e.unref(u),{name:"icon--epic--arrow-forward-ios-rounded"})],!0)],2)],2),e.createVNode(e.Transition,{name:"ep-collapse-transition",onEnter:i,onAfterEnter:d,onLeave:p},{default:e.withCtx(()=>[e.withDirectives(e.createElementVNode("div",h,[e.createElementVNode("div",{ref_key:"contentRef",ref:r,class:"ep-collapse-panel__content"},[e.renderSlot(t.$slots,"default",{},void 0,!0)],512)],512),[[e.vShow,a.value]])]),_:3})],2))}});module.exports=m;