fix:修改设备告警ui
This commit is contained in:
zhaohy
@@ -92,40 +92,64 @@
|
||||
:showSearch="false"
|
||||
placeholder="请选择对比类型" />
|
||||
</a-form-item>
|
||||
<template v-for="index in infoObject.alarmList?.length" :key="index">
|
||||
<div style="width: 100%; display: flex; margin-left: 42px; padding: 12px">
|
||||
<span style="line-height: 32px">{{ `逻辑${index}:` }}</span>
|
||||
<a-select
|
||||
v-model:value="infoObject.alarmList[index - 1].logic"
|
||||
style="width: 70px; margin-left: 12px"
|
||||
:options="logicEnum" />
|
||||
<span style="line-height: 32px; margin-left: 32px">{{ `数值${index}:` }}</span>
|
||||
<a-input
|
||||
style="width: 65px; margin-left: 6px"
|
||||
type="number"
|
||||
v-model:value="infoObject.alarmList[index - 1].num" />
|
||||
<div
|
||||
style="width: 70px; align-items: center; cursor: pointer"
|
||||
@click="deleteAlarmList(index - 1)">
|
||||
<img style="width: 14px; margin: 0 12px" src="../../../../../src/icon/del.svg" />
|
||||
<div class="card-log">
|
||||
<template v-for="index in infoObject.alarmList?.length" :key="index">
|
||||
<div style="width: 100%; display: flex; margin-left: 22px; padding: 12px 14px 12px 0px">
|
||||
<span class="title-name" style="line-height: 32px">{{ `逻辑${index}:` }}</span>
|
||||
<a-select
|
||||
v-model:value="infoObject.alarmList[index - 1].logic"
|
||||
style="width: 110px; margin-left: 12px"
|
||||
placeholder="请选择逻辑"
|
||||
:options="logicEnum" />
|
||||
<span class="title-name" style="line-height: 32px; margin-left: 32px">{{
|
||||
`数值${index}:`
|
||||
}}</span>
|
||||
<a-input
|
||||
style="width: 110px; margin-left: 6px"
|
||||
type="number"
|
||||
placeholder="请输入数值"
|
||||
v-model:value="infoObject.alarmList[index - 1].num" />
|
||||
<div
|
||||
v-if="index > 1 && index === infoObject.alarmList?.length"
|
||||
style="
|
||||
cursor: pointer;
|
||||
width: 20px;
|
||||
height: 32px;
|
||||
display: flex;
|
||||
align-items: center;
|
||||
margin-left: 16px;
|
||||
"
|
||||
@click="addAlarmList">
|
||||
<img style="width: 16px" src="../../../../../src/icon/add.png" />
|
||||
</div>
|
||||
<div
|
||||
v-if="index > 1 && infoObject.alarmList?.length > 2"
|
||||
style="
|
||||
cursor: pointer;
|
||||
width: 20px;
|
||||
height: 32px;
|
||||
display: flex;
|
||||
align-items: center;
|
||||
margin-left: 16px;
|
||||
"
|
||||
@click="deleteAlarmList(index - 1)">
|
||||
<img style="width: 16px" src="../../../../../src/icon/del.png" />
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
<div
|
||||
v-if="
|
||||
infoObject.alarmList[index - 1]?.num === '' ||
|
||||
infoObject.alarmList[index - 1]?.logic === null
|
||||
"
|
||||
style="width: 100%; color: #ff4d4f; text-align: center; margin-bottom: 5px">
|
||||
请选择正确的逻辑{{ index }} 或 输入正确的数值{{ index }}
|
||||
</div>
|
||||
</template>
|
||||
<div
|
||||
v-if="
|
||||
infoObject.alarmList[index - 1]?.num === null ||
|
||||
infoObject.alarmList[index - 1]?.logic === null
|
||||
"
|
||||
v-if="infoObject.alarmList?.length < 2"
|
||||
style="width: 100%; color: #ff4d4f; text-align: center; margin-bottom: 5px">
|
||||
请选择正确的逻辑{{ index }} 或 输入正确的数值{{ index }}
|
||||
逻辑至少2条
|
||||
</div>
|
||||
</template>
|
||||
<div
|
||||
v-if="infoObject.alarmList?.length < 2"
|
||||
style="width: 100%; color: #ff4d4f; text-align: center; margin-bottom: 5px">
|
||||
逻辑至少2条
|
||||
</div>
|
||||
<div style="width: 100%; margin-top: 12px; display: flex; justify-content: flex-end">
|
||||
<a-button type="primary" @click="addAlarmList"> 新增</a-button>
|
||||
</div>
|
||||
</a-form>
|
||||
</div>
|
||||
@@ -157,7 +181,10 @@
|
||||
abnormalDescription: null,
|
||||
dataSources: null,
|
||||
enableRules: 0,
|
||||
alarmList: [{ id: null, logic: null, num: null, isDelete: 0 }],
|
||||
alarmList: [
|
||||
{ id: null, logic: null, num: '', isDelete: 0 },
|
||||
{ id: null, logic: null, num: '', isDelete: 0 },
|
||||
],
|
||||
});
|
||||
const emit = defineEmits(['editObject']);
|
||||
//删除的逻辑列表
|
||||
@@ -346,7 +373,10 @@
|
||||
abnormalDescription: null,
|
||||
dataSources: null,
|
||||
enableRules: 0,
|
||||
alarmList: [{ id: null, logic: null, num: null, isDelete: 0 }],
|
||||
alarmList: [
|
||||
{ id: null, logic: null, num: '', isDelete: 0 },
|
||||
{ id: null, logic: null, num: '', isDelete: 0 },
|
||||
],
|
||||
};
|
||||
infoObject.value.site = orgId.value;
|
||||
}
|
||||
@@ -374,61 +404,68 @@
|
||||
},
|
||||
],
|
||||
};
|
||||
// 确认按钮
|
||||
const btnClick = () => {
|
||||
infoObject.value.alarmList.forEach((item) => {
|
||||
if (item.logic === null || item.num === null) {
|
||||
return;
|
||||
const getBoolean = () => {
|
||||
for (const item of infoObject.value.alarmList) {
|
||||
if (item.logic === null || item.num === '') {
|
||||
return false;
|
||||
}
|
||||
});
|
||||
}
|
||||
|
||||
if (infoObject.value.alarmList.length < 2) {
|
||||
NsMessage.error('请选择逻辑和数值');
|
||||
return;
|
||||
return false;
|
||||
}
|
||||
return true;
|
||||
};
|
||||
// 确认按钮
|
||||
const btnClick = async () => {
|
||||
let formBoolean = await getBoolean();
|
||||
//数据是否验证通过
|
||||
formRef.value.validate().then(() => {
|
||||
//处理数据
|
||||
let data = { ...infoObject.value };
|
||||
if (!data.orgId) {
|
||||
data.orgId = orgId.value;
|
||||
}
|
||||
//关联能耗告警id
|
||||
data.energyConsumptionAlarmId = energyAlarm.value.id;
|
||||
data.errorCode = energyAlarm.value.errorCode;
|
||||
data.dataSourcesType = data.dataSources[0];
|
||||
data.dataSourcesWay = data.dataSources[1];
|
||||
delete data.dataSources;
|
||||
data.hxAlarmRuleLogicList = [...infoObject.value.alarmList, ...delAlarmList.value];
|
||||
data.comparisonType = data.comparisonType.toString();
|
||||
data.hxAlarmRuleLogicList.forEach((item) => {
|
||||
const num = Number(item.num);
|
||||
if (!isNaN(num)) {
|
||||
item.num = Number(num.toFixed(2));
|
||||
} else {
|
||||
item.num = 0; // 可以设置为0或其他默认值
|
||||
if (formBoolean) {
|
||||
formRef.value.validate().then(() => {
|
||||
//处理数据
|
||||
let data = { ...infoObject.value };
|
||||
if (!data.orgId) {
|
||||
data.orgId = orgId.value;
|
||||
}
|
||||
});
|
||||
data.ruleType = Number(data.ruleType);
|
||||
delete data.alarmList;
|
||||
http
|
||||
.post(energyAlarms.configAddOrUpNewData, data)
|
||||
.then((res) => {
|
||||
if (res.msg === 'success') {
|
||||
// 操作成功时的处理
|
||||
if (data.id) {
|
||||
NsMessage.success('告警规则编辑成功');
|
||||
} else {
|
||||
NsMessage.success('告警规则新增成功');
|
||||
}
|
||||
emit('editObject', null);
|
||||
handleClose();
|
||||
//关联能耗告警id
|
||||
data.energyConsumptionAlarmId = energyAlarm.value.id;
|
||||
data.errorCode = energyAlarm.value.errorCode;
|
||||
data.dataSourcesType = data.dataSources[0];
|
||||
data.dataSourcesWay = data.dataSources[1];
|
||||
delete data.dataSources;
|
||||
data.hxAlarmRuleLogicList = [...infoObject.value.alarmList, ...delAlarmList.value];
|
||||
data.comparisonType = data.comparisonType.toString();
|
||||
data.hxAlarmRuleLogicList.forEach((item) => {
|
||||
const num = Number(item.num);
|
||||
if (!isNaN(num)) {
|
||||
item.num = Number(num.toFixed(2));
|
||||
} else {
|
||||
item.num = 0; // 可以设置为0或其他默认值
|
||||
}
|
||||
})
|
||||
.catch((error) => {
|
||||
// 错误处理
|
||||
console.error('请求失败：', error);
|
||||
});
|
||||
});
|
||||
data.ruleType = Number(data.ruleType);
|
||||
delete data.alarmList;
|
||||
http
|
||||
.post(energyAlarms.configAddOrUpNewData, data)
|
||||
.then((res) => {
|
||||
if (res.msg === 'success') {
|
||||
// 操作成功时的处理
|
||||
if (data.id) {
|
||||
NsMessage.success('告警规则编辑成功');
|
||||
} else {
|
||||
NsMessage.success('告警规则新增成功');
|
||||
}
|
||||
emit('editObject', null);
|
||||
handleClose();
|
||||
}
|
||||
})
|
||||
.catch((error) => {
|
||||
// 错误处理
|
||||
console.error('请求失败：', error);
|
||||
});
|
||||
});
|
||||
}
|
||||
};
|
||||
//取消按钮
|
||||
const handleClose = () => {
|
||||
@@ -443,7 +480,10 @@
|
||||
abnormalDescription: null,
|
||||
dataSources: null,
|
||||
enableRules: 0,
|
||||
alarmList: [{ id: null, logic: null, num: null, isDelete: 0 }],
|
||||
alarmList: [
|
||||
{ id: null, logic: null, num: '', isDelete: 0 },
|
||||
{ id: null, logic: null, num: '', isDelete: 0 },
|
||||
],
|
||||
};
|
||||
visible.value = false;
|
||||
delAlarmList.value = [];
|
||||
@@ -451,9 +491,9 @@
|
||||
// 新增逻辑列表
|
||||
const addAlarmList = () => {
|
||||
if (infoObject.value.alarmList) {
|
||||
infoObject.value.alarmList.push({ id: null, logic: null, num: null, isDelete: 0 });
|
||||
infoObject.value.alarmList.push({ id: null, logic: null, num: '', isDelete: 0 });
|
||||
} else {
|
||||
infoObject.value.alarmList = [{ id: null, logic: null, num: null, isDelete: 0 }];
|
||||
infoObject.value.alarmList = [{ id: null, logic: null, num: '', isDelete: 0 }];
|
||||
}
|
||||
};
|
||||
// 删除 逻辑列表、
|
||||
@@ -522,4 +562,20 @@
|
||||
text-align: right;
|
||||
width: 20%;
|
||||
}
|
||||
.card-log {
|
||||
width: 100%;
|
||||
height: auto;
|
||||
border-radius: 4px;
|
||||
background: rgba(250, 250, 250, 1);
|
||||
padding-bottom: 12px;
|
||||
.title-name::before {
|
||||
display: inline-block;
|
||||
margin-right: 4px;
|
||||
color: #ff4d4f;
|
||||
font-size: 14px;
|
||||
font-family: SimSun, sans-serif;
|
||||
line-height: 1;
|
||||
content: '*';
|
||||
}
|
||||
}
|
||||
</style>
|
||||
|
||||
Reference in New Issue
Block a user