NEZ-3129 fix:Record rule 编辑页面 interval 样式错误

This commit is contained in:
zhangyu
2023-08-24 18:02:38 +08:00
parent 2d3ea18dac
commit 06b18cf58b
5 changed files with 47 additions and 11 deletions

View File

@@ -41,4 +41,24 @@
width: 48px;
}
}
.append_unit{
display: flex;
.el-input--small .el-input__inner {
border-radius: 4px 0 0 4px;
border-right: none;
}
&::after{
content: attr(data-unit);
//position: absolute;
display: inline-block;
top: 0;
right: 100%;
padding: 0 20px;
color: $--color-text-secondary;
background-color: $--background-color-base;
border: 1px solid $--border-color-light;
border-radius:0 4px 4px 0;
width: auto;
}
}

View File

@@ -30,13 +30,13 @@ export default {
]
}
// 左y轴
const leftData = chartData.filter(item => !item[0].yAxisIndex)
const leftData = chartData.filter(item => item[0] && !item[0].yAxisIndex)
const leftInfo = this.getMinMaxFromData(leftData, chartInfo.unit, chartInfo.param) //
console.log(leftData, leftInfo)
chartOption.yAxis[0].minInterval = chartDataFormat.Interval(leftInfo.maxValue, leftInfo.copies, leftInfo.unit.type, 'min')
chartOption.yAxis[0].maxInterval = chartDataFormat.Interval(leftInfo.maxValue, leftInfo.copies, leftInfo.unit.type, 'max') * Math.ceil(this.series.length / 5)
if (chartInfo.param.stack) {
chartOption.yAxis[0].maxInterval = chartOption.yAxis[0].maxInterval * (Math.ceil(chartOption.series.length / 5) + 1)
chartOption.yAxis[0].maxInterval = chartOption.yAxis[0].maxInterval * (Math.ceil(leftData.length / 5) + 1)
}
if (leftInfo.unit.type === 'Time' || leftInfo.unit.type === 'Date & Time') {
delete chartOption.yAxis[0].minInterval
@@ -64,13 +64,13 @@ export default {
const unit = chartDataFormat.getUnit(lodash.get(chartInfo, 'param.rightYAxis.unit', 2))
const allRight = this.series.every(item => item.yAxisIndex == 1)
chartOption.yAxis[1].splitLine.show = allRight
const rightData = chartData.filter(item => item[0].yAxisIndex)
const rightData = chartData.filter(item => item[0] && item[0].yAxisIndex)
console.log(rightData, unit)
const rightInfo = this.getMinMaxFromData(rightData, lodash.get(chartInfo, 'param.rightYAxis.unit', 2), lodash.get(chartInfo, 'param.rightYAxis', {}))//
chartOption.yAxis[1].minInterval = chartDataFormat.Interval(rightInfo.maxValue, rightInfo.copies, rightInfo.unit.type, 'min')
chartOption.yAxis[1].maxInterval = chartDataFormat.Interval(rightInfo.maxValue, rightInfo.copies, rightInfo.unit.type, 'max') * Math.ceil(this.series.length / 5)
if (chartInfo.param.stack) {
chartOption.yAxis[1].maxInterval = chartOption.yAxis[1].maxInterval * (Math.ceil(chartOption.series.length / 5) + 1)
chartOption.yAxis[1].maxInterval = chartOption.yAxis[1].maxInterval * (Math.ceil(rightData.length / 5) + 1)
}
if (unit.type === 'Time' || unit.type === 'Date & Time') {
delete chartOption.yAxis[1].minInterval

View File

@@ -124,7 +124,22 @@
</div>
<!--inr-->
<el-form-item v-if="showSnmpTrap" :label="$t('alert.config.inr')" prop="inr" class="half-form-item">
<el-input-number :min="15" :max="86400" id="alert-box-input-inr" :controls="false" v-model="editAlertRule.inr" :placeholder="$t('alert.config.inrPlaceholder')" size="small" type="text" :disabled="!showSnmpTrap"></el-input-number>
<el-input-number
:min="15"
:max="86400"
id="alert-box-input-inr"
:controls="false"
v-model="editAlertRule.inr"
:placeholder="$t('alert.config.inrPlaceholder')"
size="small"
type="text"
:disabled="!showSnmpTrap"
class="append_unit"
:data-unit="$t('overall.seconds')"
>
</el-input-number>
</el-form-item>
<!--last-->
<el-form-item v-if="showSnmpTrap" :label="$t('alert.config.for')" prop="last" class="half-form-item alert-box-duration" :rules=" [
@@ -132,7 +147,7 @@
]"
>
<el-input id="alert-box-input-last" :controls="false" v-model.number="editAlertRule.last" placeholder="" size="small" :disabled="!showSnmpTrap" type="text">
<template slot="append">{{$t('alert.config.second')}}</template>
<template slot="append">{{$t('overall.seconds')}}</template>
</el-input>
</el-form-item>
<!--unit-->

View File

@@ -69,7 +69,8 @@
</el-form-item>
<!-- inr -->
<el-form-item :label='$t("config.assetLabel.interval")' prop="inr">
<el-input v-model="editRecordRule.inr" maxlength="10" show-word-limit :placeholder="''" size="small"></el-input>
<el-input-number v-model="editRecordRule.inr" size="small" style="width: 100%" :placeholder="$t('recordRule.defalutInterval')" :max="9999999999" :precision="0" :min="1" :controls="false" class="append_unit" :data-unit="$t('overall.seconds')">
</el-input-number>
</el-form-item>
<!--state-->
<el-form-item :label="$t('overall.state')" prop="state" >

View File

@@ -39,10 +39,10 @@
<div class="notificationMessage">
<i class="nz-icon nz-icon-info-normal"></i>
<div style="margin-left: 15px">
<div>. Please make sure the script file exists and has executable permissions</div>
<div>. The script file receives two parameters:</div>
<div>&nbsp;&nbsp;&nbsp;&nbsp; Notification account</div>
<div>&nbsp;&nbsp;&nbsp;&nbsp; Alert message(json)
<div>. {{$t('noftiyMethod.permissions')}}</div>
<div>. {{$t('noftiyMethod.parameters')}}</div>
<div>&nbsp;&nbsp;&nbsp;&nbsp; {{$t('noftiyMethod.account')}}</div>
<div>&nbsp;&nbsp;&nbsp;&nbsp; {{$t('noftiyMethod.json')}}
<el-tooltip placement="top" effect="light">
<pre slot="content" style="word-break: break-all">
{