You can not select more than 25 topics
Topics must start with a letter or number, can include dashes ('-') and can be up to 35 characters long.
98 lines
3.2 KiB
98 lines
3.2 KiB
9 months ago
|
<template>
|
||
|
|
<div class="box">
|
||
|
|
<a-tabs default-active-key="1" @change="callback">
|
||
|
|
<a-tab-pane key="1" tab="通知管理">
|
||
|
|
<ns-view-list-table v-bind="notificationConfig" ref="mainRef" @switch="changeUse" />
|
||
|
|
</a-tab-pane>
|
||
|
|
<a-tab-pane key="2" tab="设备告警" force-render>
|
||
|
|
<ns-view-list-table v-show="equipmentAlarm" class="table" v-bind="equipmentAlarmConfig" />
|
||
|
|
<a-button
|
||
|
|
v-if="!equipmentAlarm"
|
||
|
|
type="primary"
|
||
|
|
style="position: absolute; right: 130px; z-index: 99; top: 75px"
|
||
|
|
@click="backequipmentAlarm"
|
||
|
|
>返回</a-button
|
||
|
|
>
|
||
|
|
<!-- 新增 或 编辑 设备告警 -->
|
||
|
|
<editeEquipmentAlarm ref="editEquipmentAlarm" @editObject="editObject" />
|
||
|
|
<!-- 配置设备告警-->
|
||
|
|
<configureDeviceAlarms v-show="!equipmentAlarm" ref="configureDeviceAlarms" />
|
||
|
|
</a-tab-pane>
|
||
|
|
<a-tab-pane key="3" tab="能源告警">
|
||
|
|
<energyAlarm class="full-height" />
|
||
|
|
</a-tab-pane>
|
||
|
|
</a-tabs>
|
||
|
|
</div>
|
||
|
|
</template>
|
||
|
|
<script lang="ts">
|
||
|
|
import { notificationtableConfig } from './ts/notificationManagementConfig';
|
||
|
|
import { equipmentAlarmTableConfig } from './ts/equipmentAlarmConfig';
|
||
|
|
import { ref } from 'vue';
|
||
|
|
import energyAlarm from './components/energyAlarm.vue';
|
||
|
|
import editeEquipmentAlarm from './equipmentAlarm/editeEquipmentAlarm.vue';
|
||
|
|
import configureDeviceAlarms from './equipmentAlarm/configureDeviceAlarms.vue';
|
||
|
|
export default {
|
||
|
|
name: 'AlarmSettings',
|
||
|
|
components: { energyAlarm, editeEquipmentAlarm, configureDeviceAlarms },
|
||
|
|
setup() {
|
||
|
|
const mainRef = ref();
|
||
|
|
const editEquipmentAlarm = ref();
|
||
|
|
const configureDeviceAlarms = ref();
|
||
|
|
const equipmentAlarm = ref(true);
|
||
|
|
const notificationConfig = notificationtableConfig(null, null, null);
|
||
|
|
const equipmentAlarmConfig = equipmentAlarmTableConfig(
|
||
|
|
editEquipmentAlarm,
|
||
|
|
null,
|
||
|
|
equipmentAlarm,
|
||
|
|
configureDeviceAlarms,
|
||
|
|
);
|
||
|
|
const callback = (key: any) => {
|
||
|
|
console.log(key);
|
||
|
|
};
|
||
|
|
//返回设备告警
|
||
|
|
const backequipmentAlarm = () => {
|
||
|
|
equipmentAlarm.value = !equipmentAlarm.value;
|
||
|
|
configureDeviceAlarms.value.show = false;
|
||
|
|
};
|
||
|
|
const changeUse = () => {
|
||
|
|
console.log(mainRef.value);
|
||
|
|
mainRef.value?.nsTableRef.reload();
|
||
|
|
// console.log(newList.value.formFinish, '数据');
|
||
|
|
};
|
||
|
|
// 编辑或添加成功 刷新列表
|
||
|
|
const editObject = () => {
|
||
|
|
console.log('添加成功 刷新列表');
|
||
|
|
mainRef.value?.nsTableRef.reload();
|
||
|
|
// console.log(newList.value.formFinish, '数据');
|
||
|
|
};
|
||
|
|
return {
|
||
|
|
callback,
|
||
|
|
notificationConfig,
|
||
|
|
equipmentAlarmConfig,
|
||
|
|
changeUse,
|
||
|
|
editObject,
|
||
|
|
editEquipmentAlarm,
|
||
|
|
configureDeviceAlarms,
|
||
|
|
equipmentAlarm,
|
||
|
|
backequipmentAlarm,
|
||
|
|
mainRef,
|
||
|
|
};
|
||
|
|
},
|
||
|
|
};
|
||
|
|
</script>
|
||
|
|
<style lang="less" scoped>
|
||
|
|
/deep/ .ant-tabs-nav {
|
||
|
|
width: 100%;
|
||
|
|
}
|
||
|
|
.box {
|
||
|
|
width: 100%;
|
||
|
|
height: 100%;
|
||
|
|
display: flex;
|
||
|
|
flex-direction: column;
|
||
|
|
justify-content: space-between;
|
||
|
|
}
|
||
|
|
.full-height {
|
||
|
|
height: 100%; /* 设置高度为父容器高度 */
|
||
|
|
}
|
||
|
|
</style>
|