fix : 风机区域细节优化

This commit is contained in:
2024-02-27 16:09:03 +08:00
parent e2afbbc011
commit bc3e7ddaea
3 changed files with 33 additions and 14 deletions

View File

@@ -15,7 +15,7 @@
<!-- 功能 -->
<div class="option-nav">
<div>
<div class="state" :class="{changeMargin: item.showTooltip}">
<div class="state">
<div class="blue-state" :class="{ stopColor: item.breakdown }">
<div :style="{ backgroundImage: 'url(' +getImageUrl(item.breakdown)+')' }" class="state-icon"></div>
状态<span class="fan-state">{{ item.breakdown ? '故障' : '运行' }}</span>
@@ -44,7 +44,7 @@
<el-radio :label="false">手动</el-radio>
</el-radio-group>
</div>
<div class="edit-power">
<div class="edit-power" title="输入完成后, 请回车进行修改">
<div>
<span style="color: white">给定频率</span>
<!-- <span class="units"-->
@@ -55,16 +55,16 @@
<!-- onchange="changeFrequency(item)"-->
<!-- :disabled="item.autoMode"-->
<!-- /></span>-->
<el-input type="number" min="0" v-model="item.frequencySetting" :disabled="item.autoMode" title=""
@change="changeFrequency(item)" @focus="item.showTooltip=true" @blur="item.showTooltip=false">
<el-input type="number" min="0" v-model="item.frequencySetting" :disabled="item.autoMode" title="输入完成后, 请回车进行修改"
@change="changeFrequency(item)" @focus="item.showTooltip=true" @blur="item.showTooltip=false" :class="{changeMargin: item.showTooltip}">
<template #suffix>
<span>Hz</span>
</template>
</el-input>
</div>
<span v-if="item.showTooltip">
正在输入中...
</span>
<!-- <span v-if="item.showTooltip">-->
<!-- 正在输入中...-->
<!-- </span>-->
</div>
</div>
@@ -820,9 +820,7 @@ input[type="number"] {
margin-top: 48px;
display: flex;
align-items: center;
.changeMargin{
margin-top: -40px;
}
.state {
flex: 1;
display: flex;
@@ -902,7 +900,9 @@ input[type="number"] {
margin-top: 10px;
display: flex;
flex-direction: column;
.changeMargin{
}
> div:first-child {
display: flex;
@@ -910,6 +910,12 @@ input[type="number"] {
white-space: pre;
margin-right: 14px;
}
:deep(.is-focus) {
.el-input__inner {
font-weight: normal!important;
color: #fff!important;
}
}
:deep(.el-input__wrapper) {
width: 160px;
height: 44px;