xuziqiang/SaaS-lib
1
0
Fork 0
Code Issues Pull Requests Projects Releases Wiki Activity

Merge branch 'temp' of http://123.60.103.97:3000/xuziqiang/SaaS-lib into temp

Browse Source
This commit is contained in:
xuziqiang
2024-07-08 10:02:30 +08:00
parent 9316629faa a16b26370f
commit f39fb299c4
15 changed files with 1958 additions and 1 deletions
Download Patch File Download Diff File Expand all files Collapse all files

12
hx-ai-intelligent/src/icon/gaojingguanli.svg Normal file
View File

@@ -0,0 +1,12 @@
<?xml version="1.0" encoding="UTF-8" standalone="no"?>
<!DOCTYPE svg PUBLIC "-//W3C//DTD SVG 1.1//EN" "http://www.w3.org/Graphics/SVG/1.1/DTD/svg11.dtd">
<svg version="1.1" id="Layer_1" xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink" x="0px" y="0px" width="36px" height="36px" viewBox="0 0 36 36" enable-background="new 0 0 36 36" xml:space="preserve"> <image id="image0" width="36" height="36" x="0" y="0"
xlink:href="data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAACQAAAAkBAMAAAATLoWrAAAAIGNIUk0AAHomAACAhAAA+gAAAIDo
AAB1MAAA6mAAADqYAAAXcJy6UTwAAAASUExURQAAAI2Vo46Wo4uXo42Wo////3MrvScAAAAEdFJO
UwCAv0BHJ479AAAAAWJLR0QF+G/pxwAAAAd0SU1FB+gHBAISL9sg4ewAAABSSURBVCjPY2CgCxBU
cVJGFRFxAQIUMUYXMBBAV+Ti4ogQYXZxQVfGBBNygAuZwIQQOlXwCDnBhVzgAL+QA8vQFcIELi4Y
nsQUcnHBEMMiREsAALpDPLVxCYzSAAAAJXRFWHRkYXRlOmNyZWF0ZQAyMDI0LTA3LTA0VDAyOjE4
OjQ3KzAwOjAwPdooNQAAACV0RVh0ZGF0ZTptb2RpZnkAMjAyNC0wNy0wNFQwMjoxODo0NyswMDow
MEyHkIkAAAAodEVYdGRhdGU6dGltZXN0YW1wADIwMjQtMDctMDRUMDI6MTg6NDcrMDA6MDAbkrFW
AAAAAElFTkSuQmCC" />
</svg>
Side by Side

After

Width:  |  Height:  |  Size: 1.0 KiB

50
hx-ai-intelligent/src/router/alarmManagement.ts Normal file
View File

@@ -0,0 +1,50 @@
const Base = () => import('/nerv-lib/saas/view/system/layout/content.vue');
const alarmManagement = {
path: '/alarmManagement',
name: 'AlarmManagement',
meta: { title: '告警管理', icon: 'gaojingguanli', index: 4 },
redirect: { name: 'alarmManagement' },
children: [
{
path: 'alarmOverview',
name: 'AlarmOverview',
meta: { title: '告警总览', hideChildren: true, icon: 'gaojingguanli' },
component: Base,
redirect: { name: 'alarmOverviewIndex' },
children: [
{
path: 'index',
name: 'alarmOverviewIndex',
// component: () => import('/nerv-lib/saas/view/menuManage/index.vue'),
component: () => import('/@/view/alarmManagement/alarmOverview/index.vue'),
meta: {
title: '告警总览',
keepAlive: true,
// backApi: [],
},
},
],
},
{
path: 'alarmSettings',
name: 'AlarmSettings',
meta: { title: '告警设置', hideChildren: true, icon: 'gaojingguanli' },
component: Base,
redirect: { name: 'alarmSettingsIndex' },
children: [
{
path: 'index',
name: 'alarmSettingsIndex',
// component: () => import('/nerv-lib/saas/view/menuManage/index.vue'),
component: () => import('/@/view/alarmManagement/alarmSettings/index.vue'),
meta: {
title: '告警设置',
keepAlive: true,
// backApi: [],
},
},
],
},
],
};
export default alarmManagement;

101
hx-ai-intelligent/src/view/alarmManagement/alarmOverview/index.vue Normal file
View File

@@ -0,0 +1,101 @@
<template>
<div class="box">
<div class="box-top">
<div v-for="index in 3" :key="index" class="box-top-item">
<div class="item-box">
<div class="item-box-left">
<div class="item-box-left-title">设备告警 (今日处理 / 总数) </div>
<div class="iem-box-left-number">
10 / 13
<span
style="
color: #04d919;
font-size: 14px;
margin-left: 5px;
font-weight: 700;
font-style: normal;
"
>+10%</span
>
</div>
</div>
<div class="item-box-right">
<img width="54px" height="54px" src="../../../../src/icon/gaojingguanli.svg" />
</div>
</div>
</div>
</div>
<div style="flex: 4; width: 100%">2</div>
<div style="flex: 4; width: 100%">3</div>
</div>
</template>
<script lang="ts" setup>
import { ref, onMounted } from 'vue'; // 从 Vue 中导入 ref、onMounted 和 watchEffect
defineOptions({
name: 'alarmOverview', // 与页面路由name一致缓存才可生效
});
const info = ref({});
onMounted(() => {});
</script>
<style lang="less" scoped>
.box {
width: 100%;
height: 100%;
// border: 1px solid red;
display: flex;
flex-direction: column;
gap: 5px;
background-color: #f0f1f4;
box-sizing: border-box;
.box-top {
flex: 1;
width: 100%;
height: 100%;
display: flex;
flex-direction: row;
gap: 5px;
.box-top-item {
height: 100%;
flex: 1;
gap: 5px;
background-color: white;
border-radius: 4px;
padding: 20px;
.item-box {
width: 100%;
height: 100%;
display: flex;
.item-box-left {
flex: 9;
height: 100%;
padding: 0px !important;
.item-box-left-title {
color: rgba(0, 0, 0, 0.45);
font-weight: 400;
font-style: normal;
font-size: 14px;
color: #aaaaaa;
font-kerning: normal;
font-family: '微软雅黑', sans-serif;
}
.iem-box-left-number {
color: #000000;
font-weight: 700;
font-family: 'Arial Negreta', 'Arial Normal', 'Arial', sans-serif;
font-style: normal;
font-size: 30px;
}
}
.item-box-right {
flex: 1;
height: 100%;
display: grid;
place-items: center;
}
}
}
}
}
</style>

170
hx-ai-intelligent/src/view/alarmManagement/alarmSettings/components/energyAlarm.vue Normal file
View File

@@ -0,0 +1,170 @@
<template>
<a-form class="ns-form">
<div class="ns-form-title ns-title-extra-box">
<span>查询</span>
<a-button type="link" class="ns-operate-expand" @click="expandAll = !expandAll">
<template v-if="expandAll">
收起筛选
<UpOutlined />
</template>
<template v-else>
展开筛选
<DownOutlined />
</template>
</a-button>
</div>
<template v-if="expandAll">
<a-row :gutter="24">
<a-col :span="6">
<a-select v-model:value="select.yx" style="width: 100%" placeholder="请选择告警优先级">
<a-select-option v-for="(val, index) in 60" :key="index" :value="index">{{
index
}}</a-select-option>
</a-select>
</a-col>
<a-col :span="6">
<a-input v-model:value="select.tilte" placeholder="请输入告警标题关键字" />
</a-col>
<a-col :span="6">
<a-input v-model:value="select.tilte" placeholder="请输入告警标题关键字" />
</a-col>
<a-col :span="6">
<a-select
v-model:value="select.yx"
style="width: 100%"
:autoClearSearchValue="true"
placeholder="请选择启用状态">
<a-select-option :key="1" :value="1"> 启用 </a-select-option>
<a-select-option :key="0" :value="0"> 关闭 </a-select-option>
</a-select>
</a-col>
</a-row>
<a-row :span="24">
<a-col :span="24" class="ns-operate">
<a-button @click="reset">重置</a-button>
<a-button type="primary" @click="search">搜索</a-button>
</a-col>
</a-row>
</template>
</a-form>
<div class="ns-table-header">
<div class="ns-table-title ns-title-extra-box">告警规则</div>
</div>
</template>
<script lang="ts">
import { computed, defineComponent, nextTick, provide, ref, toRefs, watch } from 'vue';
import { DownOutlined, UpOutlined } from '@ant-design/icons-vue';
export default {
components: { DownOutlined, UpOutlined },
setup() {
const expandAll = ref(true);
const loading = ref(false);
const select = ref({
title: '',
yx: null,
});
const reset = () => {
console.log(select);
};
const search = () => {
console.log(select);
};
return {
expandAll,
select,
loading,
search,
reset,
};
},
};
</script>
<style lang="less" scoped>
@gap: 16px;
.ns-form {
padding: 16px;
background-color: white;
// border-radius: 8px;
border-bottom-left-radius: 12px;
border-bottom-right-radius: 12px;
.ant-row {
flex: 1;
}
.ns-operate {
text-align: right;
margin-left: auto;
margin-top: 16px;
.ns-operate-expand {
display: inline-block;
padding: 4px 2px;
border: unset !important;
.anticon {
margin-left: 4px;
}
&:hover {
border: unset !important;
}
&:focus {
border: unset !important;
}
}
.ant-btn {
margin-left: 6px;
}
}
.ns-form-title {
text-align: left;
height: 22px;
// line-height: 32px;
//font-size: 16px;
font-weight: bold;
user-select: text;
margin-bottom: calc(@gap - 0px);
display: flex;
justify-content: space-between;
align-items: center;
:deep(.ant-btn) {
padding: 0;
}
}
}
.ns-table-header {
min-width: fit-content;
user-select: none;
// padding: 16px 0;
padding-top: 16px;
text-align: right;
position: relative;
height: 48px;
display: flex;
align-items: center;
justify-content: space-between;
margin-top: 20px;
padding: 0 16px;
display: flex;
.ns-table-header::before {
position: absolute;
top: -20px; /* 与 margin-top 的值相反，以覆盖 margin-top 的区域 */
left: 0;
width: 100%;
height: 20px; /* 与 margin-top 的值相同 */
background-color: gray; /* 设置灰色背景 */
}
.ns-table-title {
text-align: left;
height: 32px;
line-height: 32px;
//font-size: 16px;
font-weight: bold;
user-select: text;
}
.ant-btn {
margin-left: 6px;
}
:first-child.ant-btn {
margin-left: 0;
}
}
</style>

224
hx-ai-intelligent/src/view/alarmManagement/alarmSettings/equipmentAlarm/configureDeviceAlarms.vue Normal file
View File

@@ -0,0 +1,224 @@
<!-- 配置设备告警 -->
<template>
<ns-view-list-table v-if="show" class="table" v-bind="tableConfig" />
<!-- 新增or编辑界面 -->
<editConfigureDeviceAlarm ref="editConfigureDeviceAlarms" />
</template>
<script lang="ts">
import { ref } from 'vue';
import data from '../notificationManagementMock.json';
import editConfigureDeviceAlarm from '../equipmentAlarm/editConfigureDeviceAlarm.vue';
export default {
components: { editConfigureDeviceAlarm },
setup() {
//设备告警数据
const configureDeviceAlarmsData = ref({});
const show = ref(false);
const tableConfig = ref({});
const editConfigureDeviceAlarms = ref({});
const mockData = ref(data.listData);
const doWnload = (url) => {
const a = document.createElement('a');
document.body.appendChild(a);
a.href = encodeURI(url);
//设置下载的文件名
// a.download = fileName.value;
//触发a标签的点击事件，进行下载
a.click();
};
const setconfigureDeviceAlarmsData = (value: any) => {
configureDeviceAlarmsData.value = value;
show.value = true;
tableConfig.value = {
title: '告警规则',
// api: '/carbon_emission/device/getDeviceList',
value: mockData.value,
headerActions: [
{
label: '新增',
name: 'RoleTypeAdd',
type: 'primary',
handle: () => {
console.log('新增xxxxxxx');
editConfigureDeviceAlarms.value.toggle();
},
},
{
label: '导入',
name: 'groupImport',
type: 'primary',
extra: {
// api: props.postImportApi, // 导入接口名
title: '设备信息', // 弹窗title
templateName: 'whiteListUser', // 所使用的文件名称
indexName: '设备id', // 匹配类型字段
message: [
{ label: '1、若必填项未填写，则不能进行导入操作' },
{ label: `2、当重复时，则更新数据。` },
{ label: '3、数据将从模版的第五行进行导入。' },
{ label: '4、文件导入勿超过5MB。' },
],
},
},
{
label: '导出',
name: 'groupExports',
type: 'primary',
handle: () => {
doWnload('/hx-ai-intelligent/asset/file/whiteListUser.xlsx');
},
},
{
label: '批量删除',
type: 'primary',
name: 'userBatchDel',
dynamicDisabled: (data: any) => {
return data.list.length === 0;
},
confirm: true,
isReload: true,
isClearCheck: true,
// api: origanizemanage.batchDel,
dynamicParams: { userIds: 'userId[]' },
},
],
columns: [
{
title: '序号',
dataIndex: 'address',
customRender: (text: any) => {
return text.index + 1;
},
},
{
title: '规则id',
dataIndex: 'id',
},
{
title: '设备信息',
dataIndex: 'deviceCode',
},
{
title: '告警点位',
dataIndex: 'deviceName',
},
{
title: '判断条件',
dataIndex: 'position',
},
{
title: '取值类型',
dataIndex: 'position',
textEllipsis: true,
},
{
title: '异常描述',
dataIndex: 'position',
},
{
title: '启用通知',
dataIndex: 'isUse',
},
],
params: {
page: 0,
pageSize: 10,
},
// rowSelection: null, 选择按钮
columnActions: {
title: '操作',
actions: [
{
label: '编辑',
name: 'FeedBackDetail',
dynamicParams: ['uuid', 'appealType'],
handle: (data: any) => {
console.log(data, 'xxxxxxx');
},
},
{
label: '删除',
name: 'FeedBackDetail',
dynamicParams: ['uuid', 'appealType'],
confirm: true,
handle: () => {
// mockData.value.splice(0, 1);
console.log(data, 'xxxxxxx');
},
},
],
},
formConfig: {
title: value.position,
schemas: [
{
field: 'provider',
label: '设备名称',
component: 'NsInput',
componentProps: {
placeholder: '请输入设备名称',
},
},
{
field: 'provider',
label: '设备点位',
component: 'NsSelect',
componentProps: {
placeholder: '请选择告警优先级',
options: [
{
label: '电流',
value: '1',
},
{
label: '电压',
value: '0',
},
],
},
},
{
field: 'payWay',
label: '启用状态',
component: 'NsSelect',
componentProps: {
placeholder: '请选择启用状态',
options: [
{
label: '启用',
value: '1',
},
{
label: '关闭',
value: '0',
},
],
},
},
{
field: 'provider',
label: '异常描述',
component: 'NsInput',
componentProps: {
placeholder: '请输入异常描述关键字',
},
},
],
},
// pagination: { pageSizeOptions: false },
rowKey: 'id',
};
};
return {
configureDeviceAlarmsData,
show,
doWnload,
tableConfig,
editConfigureDeviceAlarms,
setconfigureDeviceAlarmsData,
};
},
};
</script>

339
hx-ai-intelligent/src/view/alarmManagement/alarmSettings/equipmentAlarm/editConfigureDeviceAlarm.vue Normal file
View File

@@ -0,0 +1,339 @@
<template>
<ns-drawer
v-model:visible="visible"
width="520"
:title="infoObject?.id ? '编辑' : '新增'"
:ok="btnClick"
:cancel="handleClose"
placement="right">
<div style="padding: 18px">
<a-form ref="formRef" :model="infoObject" :rules="rules">
<a-form-item ref="name" label="站点" name="name">
<a-tree-select
v-model:value="infoObject.name"
show-search
style="width: 100%"
:dropdown-style="{ maxHeight: '400px', overflow: 'auto' }"
placeholder="请选择站点"
allow-clear
tree-default-expand-all
:tree-data="zdTreeData"
tree-node-filter-prop="label">
<!-- 特殊处理情况 -->
<!-- <template #title="{ value: val, label }">
<b v-if="val === 'parent 1-1'" style="color: #08c">sss</b>
<template v-else>{{ label }}</template>
</template> -->
</a-tree-select>
</a-form-item>
<a-form-item label="设备类型" name="sbtype">
<a-cascader
v-model:value="infoObject.sbtype"
:options="sbOptions"
:show-search="{ filter }"
placeholder="请选择设备类型" />
</a-form-item>
<a-form-item label="设备名称" name="sbName">
<a-select
v-model:value="infoObject.sbName"
style="width: 100%"
:autoClearSearchValue="true"
placeholder="请选择设备名称">
<a-select-option :key="1" :value="1"> AC001电表 </a-select-option>
<a-select-option :key="2" :value="2"> AC002电表 </a-select-option>
</a-select>
</a-form-item>
<a-form-item label="设备点位" name="sbAdress">
<a-select
v-model:value="infoObject.sbAdress"
show-search
placeholder="请选择设备点位"
style="width: 100%"
:options="dwOptions"
:filter-option="filterOption"
@focus="handleFocus"
@change="handleChange" />
</a-form-item>
<a-form-item label="启用规则" name="delivery">
<a-switch
v-model:checked="infoObject.delivery"
:class="{
'blue-background': infoObject.delivery,
'grey-background': !infoObject.delivery,
}" />
</a-form-item>
<a-form-item label="取值类型" name="qzType">
<a-select
v-model:value="infoObject.qzType"
show-search
placeholder="请选择设备点位"
style="width: 100%"
:options="qzOptions"
:filter-option="filterOption"
@change="handleQzChange" />
</a-form-item>
<a-form-item label="规则类型" name="resource">
<a-radio-group v-model:value="infoObject.resource">
<a-radio value="1">且(and)</a-radio>
<a-radio value="2">或(or)</a-radio>
</a-radio-group>
</a-form-item>
<a-form-item label="异常描述" name="desc">
<a-textarea
v-model:value="infoObject.desc"
style="height: 32px"
:autoSize="{ minRows: 1, maxRows: 1 }"
show-count
:maxlength="30" />
</a-form-item>
<template v-for="index in infoObject.alarmList?.length" :key="index">
<a-form-item :label="`逻辑${index}`" name="alarm">
<a-input style="width: 60px" v-model:value="infoObject.alarmList[index - 1].alarm" />
</a-form-item>
<a-form-item :label="`数值${index}`" name="number">
<a-input
style="width: 60px"
type="number"
v-model:value="infoObject.alarmList[index - 1].number" />
</a-form-item>
</template>
</a-form>
</div>
</ns-drawer>
</template>
<script lang="ts" setup>
import { NsMessage } from '/nerv-lib/component';
import { ref, toRaw } from 'vue';
import type { CascaderProps, TreeSelectProps, SelectProps } from 'ant-design-vue';
import type { ShowSearchType } from 'ant-design-vue/es/cascader';
import type { Rule } from 'ant-design-vue/es/form';
const visible = ref(false);
//表单数据
const infoObject = ref({
id: null,
name: null,
resource: null,
desc: null,
sbtype: null,
delivery: null,
alarmList: [{ alarm: null, number: null }],
});
const formRef = ref();
//站点数
const zdTreeData = ref<TreeSelectProps['treeData']>([
{
label: '铁路总局(T01)',
value: 'T01',
children: [
{
label: '济阳站(T0101)',
value: 'T0101',
},
],
},
]);
//设备类型树
const sbOptions: CascaderProps['options'] = [
{
value: '3',
label: '3.电梯',
children: [
{
value: '301',
label: '301.扶梯',
},
{
value: '302',
label: '301.直梯',
},
],
},
{
value: '4',
label: '4.冷热源',
children: [
{
value: '401',
label: '402.冷水机组',
},
{
value: '402',
label: '403.热泵机组',
},
{
value: '403',
label: '403.锅炉',
},
{
value: '404',
label: '404.水处理机组',
},
{
value: '405',
label: '405.板式热交换机组',
},
],
},
];
//设备点位
const dwOptions = ref<SelectProps['options']>([
{ value: '电压 (U)', label: '电压 (U)', code: '1' },
{ value: '电流 (I)', label: '电流 (I)', code: '2' },
{ value: '电流 (I)', label: 'a相电流 (Ia)', code: '3' },
]);
const filter: ShowSearchType['filter'] = (inputValue: any, path: any) => {
return path.some(
(option: any) => option.label.toLowerCase().indexOf(inputValue.toLowerCase()) > -1,
);
};
//取值类型
const qzOptions = ref<SelectProps['options']>([
{ value: '实时值', label: '实时值', code: '1' },
{ value: '平均值', label: '平均值', code: '2' },
]);
//设备点位方法
const filterOption = (input: string, option: any) => {
console.log('搜索', option.value);
return option.value.toLowerCase().indexOf(input.toLowerCase()) >= 0;
};
const handleFocus = () => {
console.log('点击');
};
const handleChange = (value: string) => {
console.log(`selected ${value}`);
console.log('选择', infoObject.value.sbAdress);
//获得code
dwOptions.value.forEach((item) => {
if (item.value === value) {
console.log('符合', item.code);
}
});
};
const handleQzChange = (value: string) => {
//获得code
qzOptions.value.forEach((item) => {
if (item.value === value) {
console.log('符合', item.code);
}
});
};
const emit = defineEmits(['editObject']);
//父调子 页面显示方法
const toggle = (value: any) => {
//判断 是新增 还是修改
if (value) {
infoObject.value = value;
} else {
infoObject.value = {
id: null,
name: null,
resource: null,
desc: null,
sbtype: null,
delivery: null,
alarmList: [{ alarm: null, number: null }],
};
}
visible.value = !visible.value;
};
//表单 判断规格
const rules: Record<string, Rule[]> = {
name: [{ required: true, message: '请选择站点', trigger: 'change' }],
sbtype: [{ required: true, message: '请选择设备类型', trigger: 'change' }],
delivery: [{ required: true, message: '请选择启用规则', trigger: 'change' }],
sbName: [{ required: true, message: '请选择设备名称', trigger: 'change' }],
sbAdress: [{ required: true, message: '请选择设备点位', trigger: 'change' }],
qzType: [{ required: true, message: '请选择取值类型', trigger: 'change' }],
resource: [{ required: true, message: '请选择规则类型', trigger: 'change' }],
desc: [{ required: true, message: '请输入异常描述', trigger: 'blur' }],
alarm: [{ required: true, message: '请选择逻辑', trigger: 'blur' }],
number: [{ required: true, message: '请输入数值', trigger: 'blur' }],
};
// 开关选择
const changeSwitch = () => {
console.log(infoObject.value.selectSwitch, '开关');
};
// 确认按钮
const btnClick = () => {
console.log(infoObject.value, '数据');
console.log(dwOptions.value, '点位');
dwOptions.value?.forEach;
//数据是否验证通过
formRef.value.validate().then(() => {
console.log('values', infoObject, toRaw(infoObject));
});
//调用接口
// http
// .post(props.api, data)
// .then(() => {
// isLoading.value = false;
// NsMessage.success('操作成功', 1, () => {
// navigateBack();
// });
// })
// .catch(() => {
// isLoading.value = false;
// });
};
//取消按钮
const handleClose = () => {
// 清楚校验错误信息
formRef.value.resetFields();
//对象清空
infoObject.value = {
id: null,
name: null,
resource: null,
desc: null,
sbtype: null,
delivery: null,
alarmList: [{ alarm: null, number: null }],
};
visible.value = false;
NsMessage.success('操作成功');
};
defineExpose({
toggle,
handleClose,
dwOptions,
formRef,
});
</script>
<style scoped lang="less">
.drawerContainer {
height: 100%;
display: flex;
justify-content: space-between;
}
.blue-background.ant-switch-checked {
background-color: linear-gradient(
180deg,
rgba(1, 206, 255, 1) 0%,
rgba(0, 150, 229, 1) 100%
) !important;
}
.grey-background.ant-switch {
background-color: grey !important;
}
.blue-background.ant-switch-checked .ant-switch-handle {
background-color: linear-gradient(
180deg,
rgba(1, 206, 255, 1) 0%,
rgba(0, 150, 229, 1) 100%
) !important;
}
.grey-background.ant-switch .ant-switch-handle {
background-color: grey !important;
}
/deep/ .ant-form-item-label {
z-index: 20;
text-align: right;
width: 20%;
}
</style>

255
hx-ai-intelligent/src/view/alarmManagement/alarmSettings/equipmentAlarm/editeEquipmentAlarm.vue Normal file
View File

@@ -0,0 +1,255 @@
<template>
<ns-drawer
v-model:visible="visible"
width="520"
:title="infoObject?.id ? '编辑' : '新增'"
:ok="btnClick"
:cancel="handleClose"
placement="right">
<ns-form ref="formRef" :schemas="schemas" :model="infoObject" formLayout="vertical" />
<div style="margin-left: 52px">
应用规则:
<a-switch
v-model:checked="infoObject.isUse"
:class="{
'blue-background': infoObject.isUse,
'grey-background': !infoObject.isUse,
}"
style="margin-left: 6px"
@change="changeSwitch" />
</div>
</ns-drawer>
</template>
<script lang="ts" setup>
import { ref } from 'vue';
import { NsMessage } from '/nerv-lib/component';
const visible = ref(false);
//表单数据
const infoObject = ref({});
const formRef = ref();
const emit = defineEmits(['editObject']);
const toggle = (value) => {
//判断 是新增 还是修改
if (value) {
infoObject.value = value;
} else {
infoObject.value = {
accountNo: null,
};
}
console.log('xxxx');
visible.value = !visible.value;
};
const schemas = [
{
field: 'basicInfo',
label: '',
displayFormItem: false,
class: 'ns-form-item-full',
component: 'NsChildForm',
componentProps: {
schemas: [
{
field: 'accountNo',
label: '告警标题',
component: 'NsInput',
rules: [
{
required: true,
message: '告警标题不能为空',
trigger: 'change',
},
],
componentProps: {
placeholder: '请输入告警标题',
maxLength: 20,
},
},
{
field: 'select',
label: '重复次数',
rules: [
{
required: true,
message: '重复次数不能为空',
trigger: 'change',
},
],
component: 'NsSelect',
componentProps: {
allowClear: true,
placeholder: '请选择重复次数',
options: [
{
label: '单次',
value: 0,
},
{
label: '重复',
value: 1,
},
{
label: '累计',
value: 2,
},
],
},
},
{
field: 'accountNo',
label: '检测时长',
component: 'NsInputNumber',
rules: [
{
required: true,
validator: (rules, value, cbfn) => {
if (value && /^[0-9]*$/.test(value)) {
cbfn();
} else {
cbfn('请输入正确的检测时长');
}
},
trigger: 'change',
},
],
componentProps: {
placeholder: '请输入监测时长',
// maxLength: 30,
},
},
{
field: 'danwei',
label: '监测时长单位',
component: 'NsSelect',
rules: [
{
required: true,
message: '监测时长单位不能为空',
trigger: 'change',
},
],
componentProps: {
allowClear: true,
placeholder: '请选择监测时长单位',
options: [
{
label: '分',
value: 1,
},
{
label: '时',
value: 2,
},
{
label: '天',
value: 3,
},
],
},
},
{
field: 'select',
label: '优先级',
component: 'NsSelect',
rules: [
{
required: true,
message: '优先级不能为空',
trigger: 'change',
},
],
componentProps: {
allowClear: true,
placeholder: '请选择优先级',
options: [
{
label: '紧急',
value: 1,
},
{
label: '重要',
value: 2,
},
{
label: '一般',
value: 3,
},
],
},
},
],
},
},
];
const changeSwitch = () => {
console.log(infoObject.value.selectSwitch, '开关');
};
const btnClick = () => {
//表单校验
formRef.value.triggerSubmit().then((data: any) => {
console.log('校验成功');
console.log('data', infoObject.value);
visible.value = false;
NsMessage.success('操作成功');
emit('editObject', null);
//调用接口
// http
// .post(props.api, data)
// .then(() => {
// isLoading.value = false;
// NsMessage.success('操作成功', 1, () => {
// navigateBack();
// });
// })
// .catch(() => {
// isLoading.value = false;
// });
});
};
const handleClose = () => {
// 清楚校验错误信息
formRef.value.formElRef.clearValidate();
console.log(infoObject.value);
infoObject.value = {};
visible.value = false;
NsMessage.success('操作成功');
};
defineExpose({
toggle,
handleClose,
formRef,
});
</script>
<style scoped lang="less">
.drawerContainer {
height: 100%;
display: flex;
justify-content: space-between;
}
.blue-background.ant-switch-checked {
background-color: linear-gradient(
180deg,
rgba(1, 206, 255, 1) 0%,
rgba(0, 150, 229, 1) 100%
) !important;
}
.grey-background.ant-switch {
background-color: grey !important;
}
.blue-background.ant-switch-checked .ant-switch-handle {
background-color: linear-gradient(
180deg,
rgba(1, 206, 255, 1) 0%,
rgba(0, 150, 229, 1) 100%
) !important;
}
.grey-background.ant-switch .ant-switch-handle {
background-color: grey !important;
}
</style>

97
hx-ai-intelligent/src/view/alarmManagement/alarmSettings/index.vue Normal file
View File

@@ -0,0 +1,97 @@
<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>

94
hx-ai-intelligent/src/view/alarmManagement/alarmSettings/notificationManagementMock.json Normal file
View File

@@ -0,0 +1,94 @@
{
"listData":[
{
"id": "d4",
"isDel": "0",
"officesId": "84",
"deviceCode": "37430200143",
"deviceName": "地听测试电表",
"category": "1",
"type": "1001",
"energyCount": "1",
"serialNumber": "69",
"pidCode": null,
"brand": "",
"types": "",
"manufacturer": "elit non in",
"contacts": "ad reprehenderit",
"phonenumber": "34",
"position": "in esse commodo1",
"activeState": "1",
"measurementDirection": "1",
"deviceMagnification": 62,
"deviceAccuracy": "89",
"frequency": "anim consequat irure",
"standardFrequency": "ut elit",
"deviceHead": "pariatur ex velit",
"constructor": "84566",
"voltageType": "cillum aliquip reprehenderit",
"pt": 61,
"ct": 64,
"communicationProtocol": "cupidatat nisi ea ad",
"ip": "",
"port": "",
"com": "",
"slaveAddress": "",
"dlt": "",
"conversionIdentifier": "48",
"multiplicationAdjustment": "1",
"accessMethod": "1",
"replacementFrequency": "0",
"dataDetail": "sit",
"insertTime": null,
"children": null,
"devicePointList": null,
"insertUser": null,
"isUse":true
} , {
"id": "d5",
"isDel": "0",
"officesId": "84",
"deviceCode": "37430200143",
"deviceName": "地听测试电表",
"category": "1",
"type": "1001",
"energyCount": "1",
"serialNumber": "69",
"pidCode": null,
"brand": "",
"types": "",
"manufacturer": "elit non in",
"contacts": "ad reprehenderit",
"phonenumber": "34",
"position": "in esse commodo2",
"activeState": "1",
"measurementDirection": "1",
"deviceMagnification": 62,
"deviceAccuracy": "89",
"frequency": "anim consequat irure",
"standardFrequency": "ut elit",
"deviceHead": "pariatur ex velit",
"constructor": "84566",
"voltageType": "cillum aliquip reprehenderit",
"pt": 61,
"ct": 64,
"communicationProtocol": "cupidatat nisi ea ad",
"ip": "",
"port": "",
"com": "",
"slaveAddress": "",
"dlt": "",
"conversionIdentifier": "48",
"multiplicationAdjustment": "1",
"accessMethod": "1",
"replacementFrequency": "0",
"dataDetail": "sit",
"insertTime": null,
"children": null,
"devicePointList": null,
"insertUser": null,
"isUse":true
}
]
}

204
hx-ai-intelligent/src/view/alarmManagement/alarmSettings/ts/configureDeviceAlarms.ts Normal file
View File

@@ -0,0 +1,204 @@
import { dateUtil } from '/nerv-lib/util/date-util';
import data from '../notificationManagementMock.json';
import { http } from '/nerv-lib/util';
import { Modal } from 'ant-design-vue';
import { ref } from 'vue';
const tableKeyMap = [
{
title: '序号',
dataIndex: 'address',
customRender: (text: any) => {
return text.index + 1;
},
},
{
title: '规则id',
dataIndex: 'id',
},
{
title: '设备信心',
dataIndex: 'deviceCode',
},
{
title: '告警点位',
dataIndex: 'deviceName',
},
{
title: '判断条件',
dataIndex: 'position',
},
{
title: '取值类型',
dataIndex: 'position',
textEllipsis: true,
},
{
title: '异常描述',
dataIndex: 'position',
},
{
title: '启用通知',
dataIndex: 'isUse',
},
];
const mockData = ref(data.listData);
const doWnload = (url) => {
const a = document.createElement('a');
document.body.appendChild(a);
a.href = encodeURI(url);
//设置下载的文件名
// a.download = fileName.value;
//触发a标签的点击事件，进行下载
a.click();
};
export const configureDeviceAlarms = (editEquipmentAlarm, elFormula, title) => {
return {
title: '告警规则',
// api: '/carbon_emission/device/getDeviceList',
value: mockData.value,
headerActions: [
{
label: '新增',
name: 'RoleTypeAdd',
type: 'primary',
handle: () => {
editEquipmentAlarm.value.toggle();
},
},
{
label: '导入',
name: 'groupImport',
type: 'primary',
extra: {
// api: props.postImportApi, // 导入接口名
title: '设备信息', // 弹窗title
templateName: 'whiteListUser', // 所使用的文件名称
indexName: '设备id', // 匹配类型字段
message: [
{ label: '1、若必填项未填写，则不能进行导入操作' },
{ label: `2、当重复时，则更新数据。` },
{ label: '3、数据将从模版的第五行进行导入。' },
{ label: '4、文件导入勿超过5MB。' },
],
},
},
{
label: '导出',
name: 'groupExports',
type: 'primary',
handle: () => {
doWnload('/hx-ai-intelligent/asset/file/whiteListUser.xlsx');
},
},
{
label: '批量删除',
type: 'primary',
name: 'userBatchDel',
dynamicDisabled: (data: any) => {
return data.list.length === 0;
},
confirm: true,
isReload: true,
isClearCheck: true,
// api: origanizemanage.batchDel,
dynamicParams: { userIds: 'userId[]' },
},
],
columns: tableKeyMap,
params: {
page: 0,
pageSize: 10,
},
// rowSelection: null, 选择按钮
columnActions: {
title: '操作',
actions: [
{
label: '编辑',
name: 'FeedBackDetail',
dynamicParams: ['uuid', 'appealType'],
handle: (data: any) => {
editEquipmentAlarm.value.toggle(data);
},
},
{
label: '删除',
name: 'FeedBackDetail',
dynamicParams: ['uuid', 'appealType'],
confirm: true,
handle: () => {
// mockData.value.splice(0, 1);
},
},
],
},
formConfig: {
title: title,
schemas: [
{
field: 'provider',
label: '告警优先级',
component: 'NsSelect',
componentProps: {
placeholder: '请选择告警优先级',
options: [
{
label: '全部',
value: '',
},
{
label: '启用',
value: '1',
},
{
label: '关闭',
value: '0',
},
],
},
},
{
field: 'provider',
label: '告警标题',
component: 'NsInput',
componentProps: {
placeholder: '请输入告警标题关键字',
},
},
{
field: 'provider',
label: '告警标题',
component: 'NsInput',
componentProps: {
placeholder: '请输入告警标题关键字',
},
},
{
field: 'payWay',
label: '启用状态',
component: 'NsSelect',
componentProps: {
placeholder: '请选择启用状态',
options: [
{
label: '全部',
value: '',
},
{
label: '启用',
value: '1',
},
{
label: '关闭',
value: '0',
},
],
},
},
],
},
// pagination: { pageSizeOptions: false },
rowKey: 'id',
};
};

205
hx-ai-intelligent/src/view/alarmManagement/alarmSettings/ts/equipmentAlarmConfig.ts Normal file
View File

@@ -0,0 +1,205 @@
import { dateUtil } from '/nerv-lib/util/date-util';
import data from '../notificationManagementMock.json';
import { http } from '/nerv-lib/util';
import { Modal } from 'ant-design-vue';
import { ref } from 'vue';
const tableKeyMap = [
{
title: '序号',
dataIndex: 'address',
customRender: (text: any) => {
return text.index + 1;
},
},
{
title: '优先级',
dataIndex: 'id',
},
{
title: '告警类型',
dataIndex: 'deviceCode',
},
{
title: '告警标题',
dataIndex: 'deviceName',
},
{
title: '错误码',
dataIndex: 'position',
},
{
title: '重复次数',
dataIndex: 'position',
textEllipsis: true,
},
{
title: '监测时长',
dataIndex: 'position',
},
{
title: '启用通知',
dataIndex: 'isUse',
},
];
const mockData = ref(data.listData);
const doWnload = (url) => {
const a = document.createElement('a');
document.body.appendChild(a);
a.href = encodeURI(url);
//设置下载的文件名
// a.download = fileName.value;
//触发a标签的点击事件，进行下载
a.click();
};
export const equipmentAlarmTableConfig = (
editEquipmentAlarm,
elFormula,
equipmentAlarm,
configureDeviceAlarms,
) => {
return {
title: '告警规则',
// api: '/carbon_emission/device/getDeviceList',
value: mockData.value,
headerActions: [
{
label: '新增',
name: 'RoleTypeAdd',
type: 'primary',
handle: () => {
editEquipmentAlarm.value.toggle();
},
},
{
label: '导入',
name: 'groupImport',
type: 'primary',
extra: {
// api: props.postImportApi, // 导入接口名
title: '设备信息', // 弹窗title
templateName: 'whiteListUser', // 所使用的文件名称
indexName: '设备id', // 匹配类型字段
message: [
{ label: '1、若必填项未填写，则不能进行导入操作' },
{ label: `2、当重复时，则更新数据。` },
{ label: '3、数据将从模版的第五行进行导入。' },
{ label: '4、文件导入勿超过5MB。' },
],
},
},
{
label: '导出',
name: 'groupExports',
type: 'primary',
handle: () => {
doWnload('/hx-ai-intelligent/asset/file/whiteListUser.xlsx');
},
},
],
columns: tableKeyMap,
params: {
page: 0,
pageSize: 10,
},
// rowSelection: null, 选择按钮
columnActions: {
title: '操作',
actions: [
{
label: '编辑',
name: 'FeedBackDetail',
dynamicParams: ['uuid', 'appealType'],
handle: (data: any) => {
editEquipmentAlarm.value.toggle(data);
},
},
{
label: '配置',
name: 'FeedBackDetail',
dynamicParams: ['uuid', 'appealType'],
handle: (data: any) => {
equipmentAlarm.value = !equipmentAlarm.value;
configureDeviceAlarms.value.setconfigureDeviceAlarmsData(data);
},
},
{
label: '删除',
name: 'FeedBackDetail',
dynamicParams: ['uuid', 'appealType'],
confirm: true,
handle: () => {
// mockData.value.splice(0, 1);
},
},
],
},
formConfig: {
schemas: [
{
field: 'provider',
label: '告警优先级',
component: 'NsSelect',
componentProps: {
placeholder: '请选择告警优先级',
options: [
{
label: '全部',
value: '',
},
{
label: '启用',
value: '1',
},
{
label: '关闭',
value: '0',
},
],
},
},
{
field: 'provider',
label: '告警标题',
component: 'NsInput',
componentProps: {
placeholder: '请输入告警标题关键字',
},
},
{
field: 'provider',
label: '告警标题',
component: 'NsInput',
componentProps: {
placeholder: '请输入告警标题关键字',
},
},
{
field: 'payWay',
label: '启用状态',
component: 'NsSelect',
componentProps: {
placeholder: '请选择启用状态',
options: [
{
label: '全部',
value: '',
},
{
label: '启用',
value: '1',
},
{
label: '关闭',
value: '0',
},
],
},
},
],
},
// pagination: { pageSizeOptions: false },
rowKey: 'id',
};
};

164
hx-ai-intelligent/src/view/alarmManagement/alarmSettings/ts/notificationManagementConfig.ts Normal file
View File

@@ -0,0 +1,164 @@
import { dateUtil } from '/nerv-lib/util/date-util';
import data from '../notificationManagementMock.json';
import { http } from '/nerv-lib/util';
import { ref } from 'vue';
const tableKeyMap = [
{
title: '序号',
dataIndex: 'address',
customRender: (text: any) => {
return text.index + 1;
},
},
{
title: '优先级',
dataIndex: 'id',
},
{
title: '告警类型',
dataIndex: 'deviceCode',
},
{
title: '告警标题',
dataIndex: 'deviceName',
},
{
title: '错误码',
dataIndex: 'position',
},
{
title: '通知名单',
dataIndex: 'position',
textEllipsis: true,
},
{
title: '通知方式',
dataIndex: 'position',
},
{
title: '启用通知',
dataIndex: 'isUse',
},
];
const mockData = ref(data.listData);
export const notificationtableConfig = (el, elGroup, elFormula) => {
return {
title: '告警规则',
// api: '/carbon_emission/device/getDeviceList',
value: mockData.value,
headerActions: [{}],
columns: tableKeyMap,
params: {
page: 0,
pageSize: 10,
},
// rowSelection: null, 选择按钮
columnActions: {
title: '操作',
actions: [
{
label: '联系方式',
name: 'FeedBackDetail',
dynamicParams: ['uuid', 'appealType'],
handle: (data: any) => {
console.log(data, '联系方式');
},
},
// {
// label: '删除',
// name: 'FeedBackDetail',
// dynamicParams: ['uuid', 'appealType'],
// confirm: true,
// handle: () => {
// mockData.value.splice(0, 1);
// },
// },
],
},
formConfig: {
schemas: [
{
field: 'name',
label: '告警类型',
component: 'NsSelect',
componentProps: {
placeholder: '请选告警类型',
options: [
{
label: '启用',
value: '1',
},
{
label: '关闭',
value: '0',
},
],
},
},
{
field: 'provider',
label: '告警优先级',
component: 'NsSelect',
componentProps: {
placeholder: '请选择告警优先级',
options: [
{
label: '全部',
value: '',
},
{
label: '启用',
value: '1',
},
{
label: '关闭',
value: '0',
},
],
},
},
{
field: 'provider',
label: '告警标题',
component: 'NsInput',
componentProps: {
placeholder: '请输入告警标题关键字',
},
},
{
field: 'provider',
label: '告警标题',
component: 'NsInput',
componentProps: {
placeholder: '请输入告警标题关键字',
},
},
{
field: 'payWay',
label: '启用状态',
component: 'NsSelect',
componentProps: {
placeholder: '请选择启用状态',
options: [
{
label: '全部',
value: '',
},
{
label: '启用',
value: '1',
},
{
label: '关闭',
value: '0',
},
],
},
},
],
},
// pagination: { pageSizeOptions: false },
rowKey: 'id',
};
};