41 lines
1.0 KiB
Vue
41 lines
1.0 KiB
Vue
|
<template>
|
||
|
|
<div class="editor-container">
|
||
|
|
<div class="left-editor">
|
||
|
|
<!-- 左侧编辑区域内容 -->
|
||
|
|
<canvas ref="canvas" width="600" height="165"></canvas>
|
||
|
|
</div>
|
||
|
|
<div class="right-editor">
|
||
|
|
<!-- 右侧编辑区域内容 -->
|
||
|
|
<el-form-item label="设定幅度(%)">
|
||
|
|
<el-input v-model="input1" />
|
||
|
|
</el-form-item>
|
||
|
|
<el-form-item label="持续时间(周波)">
|
||
|
|
<el-input v-model="input2" />
|
||
|
|
</el-form-item>
|
||
|
|
</div>
|
||
|
|
</div>
|
||
|
|
</template>
|
||
|
|
|
||
|
|
<script setup lang="ts">
|
||
|
|
|
||
|
|
</script>
|
||
|
|
|
||
|
|
<style scoped>
|
||
|
|
canvas {
|
||
|
|
border: 1px solid #ccc;
|
||
|
|
}
|
||
|
|
|
||
|
|
.editor-container {
|
||
|
|
display: flex;
|
||
|
|
height: 100%;
|
||
|
|
}
|
||
|
|
|
||
|
|
.left-editor {
|
||
|
|
flex: 3; /* 左侧区域占据 3/4 的宽度 */
|
||
|
|
margin-right: 10px; /* 可选：添加间距 */
|
||
|
|
}
|
||
|
|
|
||
|
|
.right-editor {
|
||
|
|
flex: 1; /* 右侧区域占据 1/4 的宽度 */
|
||
|
|
}
|
||
|
|
</style>
|