Browse Source

refactor(editor): 优化 BayEditor 组件布局和样式

- 调整 bay-info 和 bay-empty 的布局结构
- 添加 bay-empty 样式,用于显示空状态提示
- 优化 level heights部分的样式
master
lizw-2015 6 months ago
parent
commit
f3d2a49ec5
  1. 17
      src/editor/propEditors/BayEditor.vue

17
src/editor/propEditors/BayEditor.vue

@ -152,8 +152,7 @@ export type {
</div>
</div>
</div>
<div class="flex-item-fill flex-column-container bay-editor-bay-info">
<template v-if="selectDay">
<div v-if="selectDay" class="flex-item-fill flex-column-container bay-editor-bay-info">
<div class="flex-item-fixed">
<ElFormItem label="Bay Width" :labelWidth="80">
<ElInputNumber :controls="false" :modelValue="selectDay.bayWidth"/>
@ -173,7 +172,9 @@ export type {
<ElInputNumber :controls="false" :modelValue="levelHeight"/>
</ElFormItem>
</div>
</template>
</div>
<div v-else class="flex-item-fill bay-editor-bay-empty">
Select One Bay
</div>
</div>
</div>
@ -299,4 +300,14 @@ export type {
.bay-editor-bay-info-level-height :deep(input[type=number].el-input__inner) {
text-align: left;
}
.bay-editor-bay-empty {
height: 100%;
display: flex;
justify-content: center;
align-items: center;
color: #595959;
background: #f5f5f5;
margin-left: 8px;
}
</style>

Loading…
Cancel
Save