综合布局

![](/media/202404/2024-04-29_162956_110176.png)

------------
布局

------------
代码示例如下
```html
<template>
    <div style="height:600px;">
        <hi-layout :is-fit="true">
            <hi-layout-top
                title="上区"
                size="100"
                @resize="handleResize"
                style="background: rgb(255,0,0,0.1);"
                @click="handleResize"
                index="1"
            >
                <input v-model="test"/>
                <el-button size="mini" @click="handleAlert">top</el-button>
            </hi-layout-top>
            <hi-layout-bottom title="下区" size="200"> bottom</hi-layout-bottom>
            <hi-layout-left title="左区" size="100" :has-resize="false"> left</hi-layout-left>
            <hi-layout-right size="100"> right</hi-layout-right>
            <hi-layout-center> center</hi-layout-center>
        </hi-layout>
    </div>
</template>

</div>

</style>