yuliang
/
yvan-rcs-web
1
0
Fork 0
Code Issues Pull Requests Projects Releases Wiki Activity
Browse Source

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

- 调整 bay-info 和 bay-empty 的布局结构
- 添加 bay-empty 样式，用于显示空状态提示
- 优化 level heights部分的样式
master
lizw-2015 6 months ago
parent
edf833099d
commit
f3d2a49ec5
1 changed files with 33 additions and 22 deletions
Whitespace
Show all changes Ignore whitespace when comparing lines Ignore changes in amount of whitespace Ignore changes in whitespace at EOL
Unified View
Diff Options
Show Stats Download Patch File Download Diff File
  1. 55
      src/editor/propEditors/BayEditor.vue

55
src/editor/propEditors/BayEditor.vue
View File

@ -152,28 +152,29 @@ export type {
</div> </div>
</div> </div>
</div> </div>
<div class="flex-item-fill flex-column-container bay-editor-bay-info"> <div v-if="selectDay" class="flex-item-fill flex-column-container bay-editor-bay-info">
<template v-if="selectDay"> <div class="flex-item-fixed">
<div class="flex-item-fixed"> <ElFormItem label="Bay Width" :labelWidth="80">
<ElFormItem label="Bay Width" :labelWidth="80"> <ElInputNumber :controls="false" :modelValue="selectDay.bayWidth"/>
<ElInputNumber :controls="false" :modelValue="selectDay.bayWidth"/> </ElFormItem>
</ElFormItem> <div style="height: 8px;"/>
<div style="height: 8px;"/> <ElFormItem label="Bay Offset" :labelWidth="80">
<ElFormItem label="Bay Offset" :labelWidth="80"> <ElInputNumber :controls="false" :modelValue="selectDay.offset"/>
<ElInputNumber :controls="false" :modelValue="selectDay.offset"/> </ElFormItem>
</ElFormItem> </div>
</div> <div>Level Heights</div>
<div>Level Heights</div> <div class="flex-item-fill bay-editor-bay-info-level-height">
<div class="flex-item-fill bay-editor-bay-info-level-height"> <ElFormItem
<ElFormItem v-for="(levelHeight, idx) in selectDay.levelHeight"
v-for="(levelHeight, idx) in selectDay.levelHeight" :label="`Level ${idx+1}`"
:label="`Level ${idx+1}`" :labelWidth="64"
:labelWidth="64" >
> <ElInputNumber :controls="false" :modelValue="levelHeight"/>
<ElInputNumber :controls="false" :modelValue="levelHeight"/> </ElFormItem>
</ElFormItem> </div>
</div> </div>
</template> <div v-else class="flex-item-fill bay-editor-bay-empty">
Select One Bay
</div> </div>
</div> </div>
</div> </div>
@ -299,4 +300,14 @@ export type {
.bay-editor-bay-info-level-height :deep(input[type=number].el-input__inner) { .bay-editor-bay-info-level-height :deep(input[type=number].el-input__inner) {
text-align: left; 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> </style>

Write Preview
Loading…
Cancel
Save