dd8d79676b
Former-commit-id: fd7950a8a68a49c53f36d423fe0b298593a52b9b Former-commit-id: 3f101ce3fd1393a4e218fa29cb6074ef1b7adc79 Former-commit-id: 801c1e8b41b3f15cffba421160b2b0529084dcbb Former-commit-id: 1da627eb3dba8426f5134112bdac6a0d7ae995f1 [formerly eed4473502064e2953411e965e4c4db6986870b6] Former-commit-id: 6521ed46633aa4c4f9c4f48b7059b1e42d0b5c8f Former-commit-id: 2ae023459c3201e66f65c8d650ef302abe52d001 Former-commit-id: 9d06f049d6ebf6171ef56ca9608cf9ed9032ad00 Former-commit-id: e326a6c04f10b64f232367b0759499acbe0d4cdf Former-commit-id: 8d4564fc2f1d7eb7b23d84429f780761110ca3da
38 lines
1.0 KiB
Vue
38 lines
1.0 KiB
Vue
<template>
|
|
<d2-container type="card">
|
|
<template slot="header">区域划分</template>
|
|
<div style="height: 400px; margin: -16px;">
|
|
<SplitPane :min-percent='20' :default-percent='30' split="vertical">
|
|
<template slot="paneL"><div style="margin: 10px;">左</div></template>
|
|
<template slot="paneR">
|
|
<SplitPane split="horizontal">
|
|
<template slot="paneL"><div style="margin: 10px;">右上</div></template>
|
|
<template slot="paneR"><div style="margin: 10px;">右下</div></template>
|
|
</SplitPane>
|
|
</template>
|
|
</SplitPane>
|
|
</div>
|
|
</d2-container>
|
|
</template>
|
|
|
|
<script>
|
|
import Vue from 'vue'
|
|
import SplitPane from 'vue-splitpane'
|
|
Vue.component('SplitPane', SplitPane)
|
|
export default {
|
|
mounted () {
|
|
// 加载完成后显示提示
|
|
this.showInfo()
|
|
},
|
|
methods: {
|
|
// 显示提示
|
|
showInfo () {
|
|
this.$notify({
|
|
title: '提示',
|
|
message: '在横向或者纵向的分割线上拖拽调整分区大小'
|
|
})
|
|
}
|
|
}
|
|
}
|
|
</script>
|