drip-public/iview
6
1
Fork 0
Code Issues Pull requests Projects Releases Packages Wiki Activity Actions

Split code format

Browse source
This commit is contained in:
梁灏 2018-06-30 16:06:25 +08:00
parent 8fe474b951
commit cd397a6f46
3 changed files with 245 additions and 236 deletions
Show stats Download patch file Download diff file Expand all files Collapse all files

1
examples/routers/split.vue
View file

@ -39,6 +39,7 @@ export default {
top: 50%;
transform: translate(-50%, -50%);
}
.split-pane-page-wrapper {
height: 600px;
.pane {

16
src/components/split/split.vue
View file

@ -1,22 +1,30 @@
<template>
<div ref="outerWrapper" :class="wrapperClasses">
<div v-if="isHorizontal" :class="`${prefix}-horizontal`">
<div :style="{right: `${anotherOffset}%`}" :class="[`${prefix}-pane`, 'left-pane']"><slot name="left"/></div>
<div :style="{right: `${anotherOffset}%`}" :class="[`${prefix}-pane`, 'left-pane']">
<slot name="left"/>
</div>
<div :class="`${prefix}-trigger-con`" :style="{left: `${offset}%`}" @mousedown="handleMousedown">
<slot name="trigger">
<trigger mode="vertical"/>
</slot>
</div>
<div :style="{left: `${offset}%`}" :class="[`${prefix}-pane`, 'right-pane']"><slot name="right"/></div>
<div :style="{left: `${offset}%`}" :class="[`${prefix}-pane`, 'right-pane']">
<slot name="right"/>
</div>
</div>
<div v-else :class="`${prefix}-vertical`">
<div :style="{bottom: `${anotherOffset}%`}" :class="[`${prefix}-pane`, 'top-pane']"><slot name="top"/></div>
<div :style="{bottom: `${anotherOffset}%`}" :class="[`${prefix}-pane`, 'top-pane']">
<slot name="top"/>
</div>
<div :class="`${prefix}-trigger-con`" :style="{top: `${offset}%`}" @mousedown="handleMousedown">
<slot name="trigger">
<trigger mode="horizontal"/>
</slot>
</div>
<div :style="{top: `${offset}%`}" :class="[`${prefix}-pane`, 'bottom-pane']"><slot name="bottom"/></div>
<div :style="{top: `${offset}%`}" :class="[`${prefix}-pane`, 'bottom-pane']">
<slot name="bottom"/>
</div>
</div>
</div>
</template>