Merge branch 'temp' of http://123.60.103.97:3000/xuziqiang/SaaS-lib into temp
This commit is contained in:
5
hx-ai-intelligent/src/api/alarmSettings/deviceAlarms.ts
Normal file
5
hx-ai-intelligent/src/api/alarmSettings/deviceAlarms.ts
Normal file
@@ -0,0 +1,5 @@
|
|||||||
|
export enum deviceAlarms {
|
||||||
|
getTableList = '/carbon-smart/api/AlarmEquipment/selectAlarmEquipment', //设备告警分页
|
||||||
|
addOrUpNewData = '/carbon-smart/api/AlarmEquipment/creatOrUpdate', //设备告警添加 修海
|
||||||
|
del = '/carbon-smart/api/AlarmEquipment/delete', //设备告警删除
|
||||||
|
}
|
||||||
@@ -3,6 +3,7 @@ export enum device {
|
|||||||
queryDeviceTree = `${BASE_URL}/deviceInfo/queryDeviceTree`, // 左侧树
|
queryDeviceTree = `${BASE_URL}/deviceInfo/queryDeviceTree`, // 左侧树
|
||||||
queryDevicePage = `${BASE_URL}/deviceInfo/queryDevicePage`, // 列表
|
queryDevicePage = `${BASE_URL}/deviceInfo/queryDevicePage`, // 列表
|
||||||
dropArea = `${BASE_URL}/deviceInfo/dropArea`, // 查询下拉区域
|
dropArea = `${BASE_URL}/deviceInfo/dropArea`, // 查询下拉区域
|
||||||
|
queryDevicePoint = `${BASE_URL}/deviceInfo/queryDevicePoint`, // 获取设备点位
|
||||||
}
|
}
|
||||||
|
|
||||||
export enum group {
|
export enum group {
|
||||||
|
|||||||
@@ -1,170 +0,0 @@
|
|||||||
<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>
|
|
||||||
@@ -0,0 +1,287 @@
|
|||||||
|
<!-- 配置设备告警 -->
|
||||||
|
<template>
|
||||||
|
<ns-view-list-table v-if="show" ref="mainRef" class="table" v-bind="tableConfig">
|
||||||
|
<template #bodyCell="{ record, column }">
|
||||||
|
<template v-if="column.dataIndex === 'enableRules'">
|
||||||
|
<a-switch
|
||||||
|
:checked="record.enableRules === 1 ? true : false"
|
||||||
|
:class="{
|
||||||
|
'blue-background': record.enableRules === 1 ? true : false,
|
||||||
|
'grey-background': record.enableRules === 1 ? false : true,
|
||||||
|
}"
|
||||||
|
@click="clickSwitch({ enableRules: record.enableRules, record: record })" />
|
||||||
|
</template>
|
||||||
|
<template v-if="column.dataIndex === 'equipmentInfo'">
|
||||||
|
{{
|
||||||
|
record?.enableRules
|
||||||
|
? record.enableRules + '>' + record.deviceType + '>' + record.deviceName
|
||||||
|
: '-'
|
||||||
|
}}
|
||||||
|
</template>
|
||||||
|
</template>
|
||||||
|
</ns-view-list-table>
|
||||||
|
<!-- 新增or编辑界面 -->
|
||||||
|
<editConfigureEnergyAlarm ref="editConfigureEnergyAlarms" />
|
||||||
|
</template>
|
||||||
|
<script lang="ts">
|
||||||
|
import { ref, createVNode } from 'vue';
|
||||||
|
import { http } from '/nerv-lib/util';
|
||||||
|
import data from '../notificationManagementMock.json';
|
||||||
|
import { NsMessage, NsModal } from '/nerv-lib/component';
|
||||||
|
import editConfigureEnergyAlarm from './editConfigureEnergyAlarm.vue';
|
||||||
|
import { deviceAlarms } from '/@/api/alarmSettings/deviceAlarms';
|
||||||
|
import { ExclamationCircleOutlined } from '@ant-design/icons-vue';
|
||||||
|
|
||||||
|
export default {
|
||||||
|
components: { editConfigureEnergyAlarm },
|
||||||
|
|
||||||
|
setup() {
|
||||||
|
//设备告警数据
|
||||||
|
const configureDeviceAlarmsData = ref({});
|
||||||
|
const show = ref(false);
|
||||||
|
const tableConfig = ref({});
|
||||||
|
const mainRef = ref({});
|
||||||
|
const editConfigureEnergyAlarms = ref({});
|
||||||
|
const mockData = ref(data.listData);
|
||||||
|
const clickSwitch = (data: any) => {
|
||||||
|
NsModal.confirm({
|
||||||
|
title: '启用状态',
|
||||||
|
icon: createVNode(ExclamationCircleOutlined),
|
||||||
|
content: '确定' + (data.record.enableRules === 1 ? '关闭' : '启用') + '吗?',
|
||||||
|
onOk: () => {
|
||||||
|
http
|
||||||
|
.post(deviceAlarms.addOrUpNewData, {
|
||||||
|
id: data.record.id,
|
||||||
|
enableRules: data.record.enableRules === 1 ? 0 : 1,
|
||||||
|
})
|
||||||
|
.then(() => {
|
||||||
|
NsMessage.success('操作成功');
|
||||||
|
mainRef.value?.nsTableRef.reload();
|
||||||
|
});
|
||||||
|
},
|
||||||
|
});
|
||||||
|
};
|
||||||
|
const doWnload = (url: any) => {
|
||||||
|
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: deviceAlarms.getTableList,
|
||||||
|
value: mockData.value,
|
||||||
|
headerActions: [
|
||||||
|
{
|
||||||
|
label: '新增',
|
||||||
|
name: 'RoleTypeAdd',
|
||||||
|
type: 'primary',
|
||||||
|
handle: () => {
|
||||||
|
editConfigureEnergyAlarms.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: 'ruleId',
|
||||||
|
},
|
||||||
|
{
|
||||||
|
title: '设备信息/节点信息',
|
||||||
|
dataIndex: 'equipmentInfo',
|
||||||
|
},
|
||||||
|
{
|
||||||
|
title: '对比类型',
|
||||||
|
dataIndex: 'valueType',
|
||||||
|
},
|
||||||
|
{
|
||||||
|
title: '告警点位',
|
||||||
|
dataIndex: 'devicePoint',
|
||||||
|
},
|
||||||
|
{
|
||||||
|
title: '判断条件',
|
||||||
|
dataIndex: 'ruleType',
|
||||||
|
},
|
||||||
|
{
|
||||||
|
title: '异常描述',
|
||||||
|
dataIndex: 'abnormalDescription',
|
||||||
|
textEllipsis: true,
|
||||||
|
},
|
||||||
|
{
|
||||||
|
title: '启用通知',
|
||||||
|
dataIndex: 'enableRules',
|
||||||
|
},
|
||||||
|
],
|
||||||
|
// rowSelection: null, 选择按钮
|
||||||
|
columnActions: {
|
||||||
|
title: '操作',
|
||||||
|
actions: [
|
||||||
|
{
|
||||||
|
label: '编辑',
|
||||||
|
name: 'FeedBackDetail',
|
||||||
|
dynamicParams: ['uuid', 'appealType'],
|
||||||
|
handle: (data: any) => {
|
||||||
|
editConfigureEnergyAlarms.value.toggle(data);
|
||||||
|
},
|
||||||
|
},
|
||||||
|
{
|
||||||
|
label: '删除',
|
||||||
|
name: 'FeedBackDetail',
|
||||||
|
dynamicParams: ['uuid', 'appealType'],
|
||||||
|
confirm: true,
|
||||||
|
handle: () => {
|
||||||
|
// mockData.value.splice(0, 1);
|
||||||
|
},
|
||||||
|
},
|
||||||
|
],
|
||||||
|
},
|
||||||
|
formConfig: {
|
||||||
|
title: value.errorCode,
|
||||||
|
schemas: [
|
||||||
|
{
|
||||||
|
field: 'provider',
|
||||||
|
label: '设备名称',
|
||||||
|
component: 'NsInput',
|
||||||
|
componentProps: {
|
||||||
|
placeholder: '请输入设备名称',
|
||||||
|
},
|
||||||
|
},
|
||||||
|
{
|
||||||
|
field: 'provider',
|
||||||
|
label: '设备点位',
|
||||||
|
component: 'nsSelectApi',
|
||||||
|
componentProps: {
|
||||||
|
api: '/api/community/objs/DictItem',
|
||||||
|
params: {
|
||||||
|
pageSize: 100,
|
||||||
|
code: 'MZ',
|
||||||
|
},
|
||||||
|
placeholder: '请选择设备点位',
|
||||||
|
resultField: 'data',
|
||||||
|
labelField: 'dictName',
|
||||||
|
valueField: 'dictValue',
|
||||||
|
immediate: true,
|
||||||
|
autoSelectFirst: false,
|
||||||
|
},
|
||||||
|
},
|
||||||
|
{
|
||||||
|
field: 'payWay',
|
||||||
|
label: '启用状态',
|
||||||
|
component: 'NsSelect',
|
||||||
|
componentProps: {
|
||||||
|
placeholder: '请选择启用状态',
|
||||||
|
options: [
|
||||||
|
{
|
||||||
|
label: '启用',
|
||||||
|
value: '1',
|
||||||
|
},
|
||||||
|
{
|
||||||
|
label: '关闭',
|
||||||
|
value: '0',
|
||||||
|
},
|
||||||
|
],
|
||||||
|
},
|
||||||
|
},
|
||||||
|
{
|
||||||
|
field: 'provider',
|
||||||
|
label: '异常描述',
|
||||||
|
component: 'NsInput',
|
||||||
|
componentProps: {
|
||||||
|
placeholder: '请输入异常描述关键字',
|
||||||
|
},
|
||||||
|
},
|
||||||
|
],
|
||||||
|
},
|
||||||
|
params: { id: value.id },
|
||||||
|
// pagination: { pageSizeOptions: false },
|
||||||
|
rowKey: 'id',
|
||||||
|
};
|
||||||
|
};
|
||||||
|
return {
|
||||||
|
configureDeviceAlarmsData,
|
||||||
|
show,
|
||||||
|
clickSwitch,
|
||||||
|
doWnload,
|
||||||
|
tableConfig,
|
||||||
|
editConfigureEnergyAlarms,
|
||||||
|
setconfigureDeviceAlarmsData,
|
||||||
|
};
|
||||||
|
},
|
||||||
|
};
|
||||||
|
</script>
|
||||||
|
<style lang="less" scoped>
|
||||||
|
.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>
|
||||||
@@ -0,0 +1,421 @@
|
|||||||
|
<template>
|
||||||
|
<ns-drawer
|
||||||
|
v-model:visible="visible"
|
||||||
|
width="520"
|
||||||
|
:title="infoObject?.id ? '编辑告警规则' : '新增告警规则'"
|
||||||
|
:footer-style="{ textAlign: 'right' }"
|
||||||
|
:ok="btnClick"
|
||||||
|
:cancel="handleClose"
|
||||||
|
placement="right">
|
||||||
|
<div style="padding: 18px; width: 100%; overflow: hidden">
|
||||||
|
<a-form ref="formRef" :model="infoObject" :rules="rules">
|
||||||
|
<a-form-item ref="site" label="站点" name="site">
|
||||||
|
<a-tree-select
|
||||||
|
v-model:value="infoObject.site"
|
||||||
|
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="jdDevice">
|
||||||
|
<a-tree-select
|
||||||
|
v-model:value="infoObject.jdDevice"
|
||||||
|
style="width: 100%"
|
||||||
|
placeholder="请选择设备节点"
|
||||||
|
:tree-line="true && { showLeafIcon: false }"
|
||||||
|
:tree-data="jdTreeData" />
|
||||||
|
</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="desc">
|
||||||
|
<a-textarea
|
||||||
|
v-model:value="infoObject.desc"
|
||||||
|
style="height: 32px"
|
||||||
|
:autoSize="{ minRows: 1, maxRows: 1 }"
|
||||||
|
show-count
|
||||||
|
:maxlength="30" />
|
||||||
|
</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="对比类型1" name="qzType">
|
||||||
|
<a-cascader
|
||||||
|
v-model:value="infoObject.sbtype"
|
||||||
|
:options="sbOptions"
|
||||||
|
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="ljOptions"
|
||||||
|
@change="handleQzChange" />
|
||||||
|
<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="https://files.axshare.com/gsc/4T0UQR/5a/e6/81/5ae6813d499c422383c7a15dd956523f/images/设备规则/u72.svg?pageId=cbce6e61-bc6a-4283-802d-993fce6151c0" />
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
<div
|
||||||
|
v-if="
|
||||||
|
infoObject.alarmList[index - 1].num === null ||
|
||||||
|
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?.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>
|
||||||
|
</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 { device } from '/@/api/deviceManage';
|
||||||
|
import { http } from '/nerv-lib/util';
|
||||||
|
|
||||||
|
import type { Rule } from 'ant-design-vue/es/form';
|
||||||
|
|
||||||
|
const visible = ref(false);
|
||||||
|
//表单数据
|
||||||
|
const infoObject = ref({
|
||||||
|
id: null,
|
||||||
|
site: null,
|
||||||
|
jdDevice: null,
|
||||||
|
resource: null,
|
||||||
|
desc: null,
|
||||||
|
sbtype: null,
|
||||||
|
delivery: null,
|
||||||
|
alarmList: [{ logic: null, num: null }],
|
||||||
|
});
|
||||||
|
//删除的逻辑列表
|
||||||
|
const delAlarmList = ref([]);
|
||||||
|
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 jdTreeData = ref([
|
||||||
|
{
|
||||||
|
title: 'parent 1',
|
||||||
|
value: 'parent 1',
|
||||||
|
children: [
|
||||||
|
{
|
||||||
|
title: 'parent 1-0',
|
||||||
|
value: 'parent 1-0',
|
||||||
|
children: [
|
||||||
|
{
|
||||||
|
title: 'my leaf',
|
||||||
|
value: 'leaf1',
|
||||||
|
},
|
||||||
|
{
|
||||||
|
title: 'your leaf',
|
||||||
|
value: 'leaf2',
|
||||||
|
},
|
||||||
|
],
|
||||||
|
},
|
||||||
|
{
|
||||||
|
title: 'parent 1-1',
|
||||||
|
value: 'parent 1-1',
|
||||||
|
},
|
||||||
|
],
|
||||||
|
},
|
||||||
|
]);
|
||||||
|
//设备点位
|
||||||
|
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 ljOptions = ref<SelectProps['options']>([
|
||||||
|
{ value: '1', label: '≥' },
|
||||||
|
{ value: '2', label: '>' },
|
||||||
|
{ value: '3', label: '≤' },
|
||||||
|
{ value: '4', label: '<' },
|
||||||
|
{ value: '5', label: '=' },
|
||||||
|
]);
|
||||||
|
//设备点位方法
|
||||||
|
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) => {
|
||||||
|
//获取设备类型
|
||||||
|
http.post(device.queryDeviceTree, null).then((res) => {
|
||||||
|
console.log(res, '请求出来的数据');
|
||||||
|
NsMessage.success('操作成功');
|
||||||
|
});
|
||||||
|
//判断 是新增 还是修改
|
||||||
|
if (value) {
|
||||||
|
infoObject.value = value;
|
||||||
|
} else {
|
||||||
|
infoObject.value = {
|
||||||
|
id: null,
|
||||||
|
site: null,
|
||||||
|
jdDevice: null,
|
||||||
|
resource: null,
|
||||||
|
desc: null,
|
||||||
|
sbtype: null,
|
||||||
|
delivery: null,
|
||||||
|
alarmList: [{ logic: null, num: null }],
|
||||||
|
};
|
||||||
|
}
|
||||||
|
|
||||||
|
visible.value = !visible.value;
|
||||||
|
};
|
||||||
|
//表单 判断规格
|
||||||
|
const rules: Record<string, Rule[]> = {
|
||||||
|
site: [{ required: true, message: '请选择站点', trigger: 'change' }],
|
||||||
|
sbtype: [{ required: true, message: '请选择设备类型', trigger: 'change' }],
|
||||||
|
delivery: [{ required: true, message: '请选择启用规则', trigger: 'change' }],
|
||||||
|
jdDevice: [{ 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, '数据');
|
||||||
|
|
||||||
|
infoObject.value.alarmList.forEach((item) => {
|
||||||
|
if (item.logic === null || item.num === null) {
|
||||||
|
// NsMessage.error('请选择逻辑和数值');
|
||||||
|
return;
|
||||||
|
}
|
||||||
|
});
|
||||||
|
if (infoObject.value.alarmList.length < 2) {
|
||||||
|
NsMessage.error('请选择逻辑和数值');
|
||||||
|
return;
|
||||||
|
}
|
||||||
|
//数据是否验证通过
|
||||||
|
formRef.value.validate().then(() => {
|
||||||
|
console.log('values', infoObject, toRaw(infoObject));
|
||||||
|
delAlarmList.value = [];
|
||||||
|
});
|
||||||
|
//调用接口
|
||||||
|
// 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,
|
||||||
|
site: null,
|
||||||
|
resource: null,
|
||||||
|
desc: null,
|
||||||
|
sbtype: null,
|
||||||
|
delivery: null,
|
||||||
|
alarmList: [{ alarm: null, number: null }],
|
||||||
|
};
|
||||||
|
visible.value = false;
|
||||||
|
delAlarmList.value = [];
|
||||||
|
};
|
||||||
|
// 新增逻辑列表
|
||||||
|
const addAlarmList = () => {
|
||||||
|
if (infoObject.value.alarmList) {
|
||||||
|
infoObject.value.alarmList.push({ logic: null, num: null });
|
||||||
|
} else {
|
||||||
|
infoObject.value.alarmList = [{ logic: null, num: null }];
|
||||||
|
}
|
||||||
|
};
|
||||||
|
// 删除 逻辑列表、
|
||||||
|
const deleteAlarmList = (index: number) => {
|
||||||
|
if (infoObject.value.alarmList[index]?.id) {
|
||||||
|
delAlarmList.value.push(infoObject.value.alarmList[index]);
|
||||||
|
}
|
||||||
|
infoObject.value.alarmList.splice(index, 1);
|
||||||
|
};
|
||||||
|
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: 23%;
|
||||||
|
}
|
||||||
|
</style>
|
||||||
@@ -0,0 +1,235 @@
|
|||||||
|
<template>
|
||||||
|
<ns-drawer
|
||||||
|
v-model:visible="visible"
|
||||||
|
width="520"
|
||||||
|
:title="infoObject?.id ? '修改能源告警' : '新增能源告警'"
|
||||||
|
:footer-style="{ textAlign: 'right' }"
|
||||||
|
:ok="btnClick"
|
||||||
|
:cancel="handleClose"
|
||||||
|
placement="right">
|
||||||
|
<ns-form ref="formRef" :schemas="schemas" :model="infoObject" formLayout="vertical" />
|
||||||
|
<div style="margin-left: 52px">
|
||||||
|
应用规则:
|
||||||
|
<a-switch
|
||||||
|
:checked="infoObject?.enableRules === 1 ? true : false"
|
||||||
|
:class="{
|
||||||
|
'blue-background': infoObject?.enableRules === 1 ? true : false,
|
||||||
|
'grey-background': infoObject?.enableRules === 1 ? false : true,
|
||||||
|
}"
|
||||||
|
style="margin-left: 6px"
|
||||||
|
@change="changeSwitch" />
|
||||||
|
</div>
|
||||||
|
</ns-drawer>
|
||||||
|
</template>
|
||||||
|
<script lang="ts" setup>
|
||||||
|
import { ref } from 'vue';
|
||||||
|
import { NsMessage } from '/nerv-lib/component';
|
||||||
|
import { http } from '/nerv-lib/util';
|
||||||
|
// import { deviceAlarms } from '/@/api/alarmSettings/deviceAlarms';
|
||||||
|
|
||||||
|
const visible = ref(false);
|
||||||
|
//表单数据
|
||||||
|
const infoObject = ref({
|
||||||
|
id: null,
|
||||||
|
accountNo: null,
|
||||||
|
enableRules: 0,
|
||||||
|
});
|
||||||
|
const formRef = ref();
|
||||||
|
const emit = defineEmits(['editObject']);
|
||||||
|
const toggle = (value: any) => {
|
||||||
|
//判断 是新增 还是修改
|
||||||
|
if (value) {
|
||||||
|
infoObject.value = value;
|
||||||
|
} else {
|
||||||
|
infoObject.value = {
|
||||||
|
id: null,
|
||||||
|
accountNo: null,
|
||||||
|
enableRules: 0,
|
||||||
|
};
|
||||||
|
}
|
||||||
|
visible.value = !visible.value;
|
||||||
|
};
|
||||||
|
const schemas = [
|
||||||
|
{
|
||||||
|
field: 'basicInfo',
|
||||||
|
label: '',
|
||||||
|
displayFormItem: false,
|
||||||
|
class: 'ns-form-item-full',
|
||||||
|
component: 'NsChildForm',
|
||||||
|
componentProps: {
|
||||||
|
schemas: [
|
||||||
|
{
|
||||||
|
field: 'alarmTitle',
|
||||||
|
label: '告警标题',
|
||||||
|
component: 'NsInput',
|
||||||
|
rules: [
|
||||||
|
{
|
||||||
|
required: true,
|
||||||
|
message: '告警标题不能为空',
|
||||||
|
trigger: 'change',
|
||||||
|
},
|
||||||
|
],
|
||||||
|
componentProps: {
|
||||||
|
placeholder: '请输入告警标题',
|
||||||
|
maxLength: 20,
|
||||||
|
},
|
||||||
|
},
|
||||||
|
{
|
||||||
|
field: 'repetitions',
|
||||||
|
label: '重复次数',
|
||||||
|
rules: [
|
||||||
|
{
|
||||||
|
required: true,
|
||||||
|
message: '重复次数不能为空',
|
||||||
|
trigger: 'change',
|
||||||
|
},
|
||||||
|
],
|
||||||
|
component: 'NsSelect',
|
||||||
|
componentProps: {
|
||||||
|
allowClear: true,
|
||||||
|
placeholder: '请选择重复次数',
|
||||||
|
|
||||||
|
options: [
|
||||||
|
{
|
||||||
|
label: '单次',
|
||||||
|
value: 1,
|
||||||
|
},
|
||||||
|
{
|
||||||
|
label: '重复',
|
||||||
|
value: 2,
|
||||||
|
},
|
||||||
|
{
|
||||||
|
label: '累计',
|
||||||
|
value: 3,
|
||||||
|
},
|
||||||
|
],
|
||||||
|
},
|
||||||
|
},
|
||||||
|
{
|
||||||
|
field: 'priority',
|
||||||
|
label: '优先级',
|
||||||
|
component: 'NsSelect',
|
||||||
|
rules: [
|
||||||
|
{
|
||||||
|
required: true,
|
||||||
|
message: '优先级不能为空',
|
||||||
|
trigger: 'change',
|
||||||
|
},
|
||||||
|
],
|
||||||
|
componentProps: {
|
||||||
|
allowClear: true,
|
||||||
|
placeholder: '请选择优先级',
|
||||||
|
options: [
|
||||||
|
{
|
||||||
|
label: '紧急',
|
||||||
|
value: 1,
|
||||||
|
},
|
||||||
|
{
|
||||||
|
label: '重要',
|
||||||
|
value: 2,
|
||||||
|
},
|
||||||
|
{
|
||||||
|
label: '一般',
|
||||||
|
value: 3,
|
||||||
|
},
|
||||||
|
],
|
||||||
|
},
|
||||||
|
},
|
||||||
|
{
|
||||||
|
field: 'priority',
|
||||||
|
label: '监测频率',
|
||||||
|
component: 'NsSelect',
|
||||||
|
rules: [
|
||||||
|
{
|
||||||
|
required: true,
|
||||||
|
message: '监测频率不能为空',
|
||||||
|
trigger: 'change',
|
||||||
|
},
|
||||||
|
],
|
||||||
|
componentProps: {
|
||||||
|
allowClear: true,
|
||||||
|
placeholder: '请选择监测频率',
|
||||||
|
componentProps: {
|
||||||
|
api: '/api/community/objs/DictItem',
|
||||||
|
params: {
|
||||||
|
pageSize: 100,
|
||||||
|
code: 'MZ',
|
||||||
|
},
|
||||||
|
placeholder: '请选择设备点位',
|
||||||
|
resultField: 'data',
|
||||||
|
labelField: 'dictName',
|
||||||
|
valueField: 'dictValue',
|
||||||
|
immediate: true,
|
||||||
|
autoSelectFirst: false,
|
||||||
|
},
|
||||||
|
},
|
||||||
|
},
|
||||||
|
],
|
||||||
|
},
|
||||||
|
},
|
||||||
|
];
|
||||||
|
//开关
|
||||||
|
const changeSwitch = () => {
|
||||||
|
switch (infoObject.value.enableRules) {
|
||||||
|
case 1:
|
||||||
|
infoObject.value.enableRules = 0;
|
||||||
|
break;
|
||||||
|
case 0:
|
||||||
|
infoObject.value.enableRules = 1;
|
||||||
|
break;
|
||||||
|
}
|
||||||
|
};
|
||||||
|
const btnClick = () => {
|
||||||
|
//表单校验
|
||||||
|
formRef.value.triggerSubmit().then(() => {
|
||||||
|
//调用接口
|
||||||
|
// http.post(deviceAlarms.addOrUpNewData, infoObject.value).then(() => {
|
||||||
|
// NsMessage.success('操作成功');
|
||||||
|
// visible.value = false;
|
||||||
|
// emit('editObject', null);
|
||||||
|
// });
|
||||||
|
});
|
||||||
|
};
|
||||||
|
const handleClose = () => {
|
||||||
|
// 清楚校验错误信息
|
||||||
|
formRef.value.formElRef.clearValidate();
|
||||||
|
console.log(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>
|
||||||
@@ -1,13 +1,36 @@
|
|||||||
<!-- 配置设备告警 -->
|
<!-- 配置设备告警 -->
|
||||||
<template>
|
<template>
|
||||||
<ns-view-list-table v-if="show" class="table" v-bind="tableConfig" />
|
<ns-view-list-table v-if="show" ref="mainRef" class="table" v-bind="tableConfig">
|
||||||
|
<template #bodyCell="{ record, column }">
|
||||||
|
<template v-if="column.dataIndex === 'enableRules'">
|
||||||
|
<a-switch
|
||||||
|
:checked="record.enableRules === 1 ? true : false"
|
||||||
|
:class="{
|
||||||
|
'blue-background': record.enableRules === 1 ? true : false,
|
||||||
|
'grey-background': record.enableRules === 1 ? false : true,
|
||||||
|
}"
|
||||||
|
@click="clickSwitch({ enableRules: record.enableRules, record: record })" />
|
||||||
|
</template>
|
||||||
|
<template v-if="column.dataIndex === 'equipmentInfo'">
|
||||||
|
{{
|
||||||
|
record?.enableRules
|
||||||
|
? record.enableRules + '>' + record.deviceType + '>' + record.deviceName
|
||||||
|
: '-'
|
||||||
|
}}
|
||||||
|
</template>
|
||||||
|
</template>
|
||||||
|
</ns-view-list-table>
|
||||||
<!-- 新增or编辑界面 -->
|
<!-- 新增or编辑界面 -->
|
||||||
<editConfigureDeviceAlarm ref="editConfigureDeviceAlarms" />
|
<editConfigureDeviceAlarm ref="editConfigureDeviceAlarms" />
|
||||||
</template>
|
</template>
|
||||||
<script lang="ts">
|
<script lang="ts">
|
||||||
import { ref } from 'vue';
|
import { ref, createVNode } from 'vue';
|
||||||
|
import { http } from '/nerv-lib/util';
|
||||||
import data from '../notificationManagementMock.json';
|
import data from '../notificationManagementMock.json';
|
||||||
|
import { NsMessage, NsModal } from '/nerv-lib/component';
|
||||||
import editConfigureDeviceAlarm from '../equipmentAlarm/editConfigureDeviceAlarm.vue';
|
import editConfigureDeviceAlarm from '../equipmentAlarm/editConfigureDeviceAlarm.vue';
|
||||||
|
import { deviceAlarms } from '/@/api/alarmSettings/deviceAlarms';
|
||||||
|
import { ExclamationCircleOutlined } from '@ant-design/icons-vue';
|
||||||
|
|
||||||
export default {
|
export default {
|
||||||
components: { editConfigureDeviceAlarm },
|
components: { editConfigureDeviceAlarm },
|
||||||
@@ -17,9 +40,28 @@
|
|||||||
const configureDeviceAlarmsData = ref({});
|
const configureDeviceAlarmsData = ref({});
|
||||||
const show = ref(false);
|
const show = ref(false);
|
||||||
const tableConfig = ref({});
|
const tableConfig = ref({});
|
||||||
|
const mainRef = ref({});
|
||||||
const editConfigureDeviceAlarms = ref({});
|
const editConfigureDeviceAlarms = ref({});
|
||||||
const mockData = ref(data.listData);
|
const mockData = ref(data.listData);
|
||||||
const doWnload = (url) => {
|
const clickSwitch = (data: any) => {
|
||||||
|
NsModal.confirm({
|
||||||
|
title: '启用状态',
|
||||||
|
icon: createVNode(ExclamationCircleOutlined),
|
||||||
|
content: '确定' + (data.record.enableRules === 1 ? '关闭' : '启用') + '吗?',
|
||||||
|
onOk: () => {
|
||||||
|
http
|
||||||
|
.post(deviceAlarms.addOrUpNewData, {
|
||||||
|
id: data.record.id,
|
||||||
|
enableRules: data.record.enableRules === 1 ? 0 : 1,
|
||||||
|
})
|
||||||
|
.then(() => {
|
||||||
|
NsMessage.success('操作成功');
|
||||||
|
mainRef.value?.nsTableRef.reload();
|
||||||
|
});
|
||||||
|
},
|
||||||
|
});
|
||||||
|
};
|
||||||
|
const doWnload = (url: any) => {
|
||||||
const a = document.createElement('a');
|
const a = document.createElement('a');
|
||||||
document.body.appendChild(a);
|
document.body.appendChild(a);
|
||||||
a.href = encodeURI(url);
|
a.href = encodeURI(url);
|
||||||
@@ -33,7 +75,7 @@
|
|||||||
show.value = true;
|
show.value = true;
|
||||||
tableConfig.value = {
|
tableConfig.value = {
|
||||||
title: '告警规则',
|
title: '告警规则',
|
||||||
// api: '/carbon_emission/device/getDeviceList',
|
api: deviceAlarms.getTableList,
|
||||||
value: mockData.value,
|
value: mockData.value,
|
||||||
headerActions: [
|
headerActions: [
|
||||||
{
|
{
|
||||||
@@ -93,38 +135,34 @@
|
|||||||
},
|
},
|
||||||
{
|
{
|
||||||
title: '规则id',
|
title: '规则id',
|
||||||
dataIndex: 'id',
|
dataIndex: 'ruleId',
|
||||||
},
|
},
|
||||||
{
|
{
|
||||||
title: '设备信息',
|
title: '设备信息',
|
||||||
dataIndex: 'deviceCode',
|
dataIndex: 'equipmentInfo',
|
||||||
},
|
},
|
||||||
{
|
{
|
||||||
title: '告警点位',
|
title: '告警点位',
|
||||||
dataIndex: 'deviceName',
|
dataIndex: 'devicePoint',
|
||||||
},
|
},
|
||||||
{
|
{
|
||||||
title: '判断条件',
|
title: '判断条件',
|
||||||
dataIndex: 'position',
|
dataIndex: 'ruleType',
|
||||||
},
|
},
|
||||||
{
|
{
|
||||||
title: '取值类型',
|
title: '取值类型',
|
||||||
dataIndex: 'position',
|
dataIndex: 'valueType',
|
||||||
textEllipsis: true,
|
textEllipsis: true,
|
||||||
},
|
},
|
||||||
{
|
{
|
||||||
title: '异常描述',
|
title: '异常描述',
|
||||||
dataIndex: 'position',
|
dataIndex: 'abnormalDescription',
|
||||||
},
|
},
|
||||||
{
|
{
|
||||||
title: '启用通知',
|
title: '启用通知',
|
||||||
dataIndex: 'isUse',
|
dataIndex: 'enableRules',
|
||||||
},
|
},
|
||||||
],
|
],
|
||||||
params: {
|
|
||||||
page: 0,
|
|
||||||
pageSize: 10,
|
|
||||||
},
|
|
||||||
// rowSelection: null, 选择按钮
|
// rowSelection: null, 选择按钮
|
||||||
columnActions: {
|
columnActions: {
|
||||||
title: '操作',
|
title: '操作',
|
||||||
@@ -150,7 +188,7 @@
|
|||||||
],
|
],
|
||||||
},
|
},
|
||||||
formConfig: {
|
formConfig: {
|
||||||
title: value.position,
|
title: value.errorCode,
|
||||||
schemas: [
|
schemas: [
|
||||||
{
|
{
|
||||||
field: 'provider',
|
field: 'provider',
|
||||||
@@ -163,19 +201,19 @@
|
|||||||
{
|
{
|
||||||
field: 'provider',
|
field: 'provider',
|
||||||
label: '设备点位',
|
label: '设备点位',
|
||||||
component: 'NsSelect',
|
component: 'nsSelectApi',
|
||||||
componentProps: {
|
componentProps: {
|
||||||
placeholder: '请选择告警优先级',
|
api: '/api/community/objs/DictItem',
|
||||||
options: [
|
params: {
|
||||||
{
|
pageSize: 100,
|
||||||
label: '电流',
|
code: 'MZ',
|
||||||
value: '1',
|
|
||||||
},
|
},
|
||||||
{
|
placeholder: '请选择设备点位',
|
||||||
label: '电压',
|
resultField: 'data',
|
||||||
value: '0',
|
labelField: 'dictName',
|
||||||
},
|
valueField: 'dictValue',
|
||||||
],
|
immediate: true,
|
||||||
|
autoSelectFirst: false,
|
||||||
},
|
},
|
||||||
},
|
},
|
||||||
{
|
{
|
||||||
@@ -206,6 +244,7 @@
|
|||||||
},
|
},
|
||||||
],
|
],
|
||||||
},
|
},
|
||||||
|
params: { id: value.id },
|
||||||
// pagination: { pageSizeOptions: false },
|
// pagination: { pageSizeOptions: false },
|
||||||
rowKey: 'id',
|
rowKey: 'id',
|
||||||
};
|
};
|
||||||
@@ -213,6 +252,7 @@
|
|||||||
return {
|
return {
|
||||||
configureDeviceAlarmsData,
|
configureDeviceAlarmsData,
|
||||||
show,
|
show,
|
||||||
|
clickSwitch,
|
||||||
doWnload,
|
doWnload,
|
||||||
tableConfig,
|
tableConfig,
|
||||||
editConfigureDeviceAlarms,
|
editConfigureDeviceAlarms,
|
||||||
@@ -221,3 +261,28 @@
|
|||||||
},
|
},
|
||||||
};
|
};
|
||||||
</script>
|
</script>
|
||||||
|
<style lang="less" scoped>
|
||||||
|
.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>
|
||||||
|
|||||||
@@ -3,14 +3,15 @@
|
|||||||
v-model:visible="visible"
|
v-model:visible="visible"
|
||||||
width="520"
|
width="520"
|
||||||
:title="infoObject?.id ? '编辑告警规则' : '新增告警规则'"
|
:title="infoObject?.id ? '编辑告警规则' : '新增告警规则'"
|
||||||
|
:footer-style="{ textAlign: 'right' }"
|
||||||
:ok="btnClick"
|
:ok="btnClick"
|
||||||
:cancel="handleClose"
|
:cancel="handleClose"
|
||||||
placement="right">
|
placement="right">
|
||||||
<div style="padding: 18px; width: 100%; overflow: hidden">
|
<div style="padding: 18px; width: 100%; overflow: hidden">
|
||||||
<a-form ref="formRef" :model="infoObject" :rules="rules">
|
<a-form ref="formRef" :model="infoObject" :rules="rules">
|
||||||
<a-form-item ref="name" label="站点" name="name">
|
<a-form-item ref="site" label="站点" name="site">
|
||||||
<a-tree-select
|
<a-tree-select
|
||||||
v-model:value="infoObject.name"
|
v-model:value="infoObject.site"
|
||||||
show-search
|
show-search
|
||||||
style="width: 100%"
|
style="width: 100%"
|
||||||
:dropdown-style="{ maxHeight: '400px', overflow: 'auto' }"
|
:dropdown-style="{ maxHeight: '400px', overflow: 'auto' }"
|
||||||
@@ -18,70 +19,77 @@
|
|||||||
allow-clear
|
allow-clear
|
||||||
tree-default-expand-all
|
tree-default-expand-all
|
||||||
:tree-data="zdTreeData"
|
:tree-data="zdTreeData"
|
||||||
tree-node-filter-prop="label">
|
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>
|
||||||
<a-form-item label="设备类型" name="sbtype">
|
<a-form-item label="设备类型" name="deviceType">
|
||||||
<a-cascader
|
<a-cascader
|
||||||
v-model:value="infoObject.sbtype"
|
v-model:value="infoObject.deviceType"
|
||||||
:options="sbOptions"
|
:options="deviceTypeTreeData"
|
||||||
|
:field-names="{
|
||||||
|
children: 'children',
|
||||||
|
label: 'deviceType',
|
||||||
|
value: 'id',
|
||||||
|
}"
|
||||||
:show-search="{ filter }"
|
:show-search="{ filter }"
|
||||||
|
@change="selectDeviceType"
|
||||||
placeholder="请选择设备类型" />
|
placeholder="请选择设备类型" />
|
||||||
</a-form-item>
|
</a-form-item>
|
||||||
<a-form-item label="设备名称" name="sbName">
|
<a-form-item label="设备名称" name="deviceName">
|
||||||
<a-select
|
<a-select
|
||||||
v-model:value="infoObject.sbName"
|
v-model:value="infoObject.deviceName"
|
||||||
|
:disabled="!(infoObject && infoObject.deviceType && infoObject.deviceType.length > 0)"
|
||||||
style="width: 100%"
|
style="width: 100%"
|
||||||
:autoClearSearchValue="true"
|
:autoClearSearchValue="true"
|
||||||
|
@change="selectDevice"
|
||||||
placeholder="请选择设备名称">
|
placeholder="请选择设备名称">
|
||||||
<a-select-option :key="1" :value="1"> AC001电表 </a-select-option>
|
<template v-for="(item, index) in deviceNameTreeData" :key="index">
|
||||||
<a-select-option :key="2" :value="2"> AC002电表 </a-select-option>
|
<a-select-option :value="item.id">
|
||||||
|
{{ item.deviceName }}
|
||||||
|
</a-select-option>
|
||||||
|
</template>
|
||||||
</a-select>
|
</a-select>
|
||||||
</a-form-item>
|
</a-form-item>
|
||||||
<a-form-item label="设备点位" name="sbAdress">
|
<a-form-item label="设备点位" name="devicePoint">
|
||||||
<a-select
|
<a-select
|
||||||
v-model:value="infoObject.sbAdress"
|
v-model:value="infoObject.devicePoint"
|
||||||
show-search
|
show-search
|
||||||
placeholder="请选择设备点位"
|
placeholder="请选择设备点位"
|
||||||
|
:disabled="!infoObject?.deviceName"
|
||||||
style="width: 100%"
|
style="width: 100%"
|
||||||
:options="dwOptions"
|
:options="dwOptions"
|
||||||
:filter-option="filterOption"
|
:filter-option="filterOption"
|
||||||
@focus="handleFocus"
|
@focus="handleFocus"
|
||||||
@change="handleChange" />
|
@change="handleChange" />
|
||||||
</a-form-item>
|
</a-form-item>
|
||||||
<a-form-item label="启用规则" name="delivery">
|
<a-form-item label="启用规则" name="enableRules">
|
||||||
<a-switch
|
<a-switch
|
||||||
v-model:checked="infoObject.delivery"
|
:checked="infoObject.enableRules === 1 ? true : false"
|
||||||
:class="{
|
:class="{
|
||||||
'blue-background': infoObject.delivery,
|
'blue-background': infoObject.enableRules === 1 ? true : false,
|
||||||
'grey-background': !infoObject.delivery,
|
'grey-background': infoObject.enableRules === 1 ? false : true,
|
||||||
}" />
|
}"
|
||||||
|
@click="clickSwitch" />
|
||||||
</a-form-item>
|
</a-form-item>
|
||||||
<a-form-item label="取值类型" name="qzType">
|
<a-form-item label="取值类型" name="valueType">
|
||||||
<a-select
|
<a-select
|
||||||
v-model:value="infoObject.qzType"
|
v-model:value="infoObject.valueType"
|
||||||
show-search
|
show-search
|
||||||
placeholder="请选择设备点位"
|
placeholder="请选择取值类型"
|
||||||
style="width: 100%"
|
style="width: 100%"
|
||||||
:options="qzOptions"
|
:options="qzOptions"
|
||||||
:filter-option="filterOption"
|
:filter-option="filterOption"
|
||||||
@change="handleQzChange" />
|
@change="handleQzChange" />
|
||||||
</a-form-item>
|
</a-form-item>
|
||||||
<a-form-item label="异常描述" name="desc">
|
<a-form-item label="异常描述" name="abnormalDescription">
|
||||||
<a-textarea
|
<a-textarea
|
||||||
v-model:value="infoObject.desc"
|
v-model:value="infoObject.abnormalDescription"
|
||||||
style="height: 32px"
|
style="height: 32px"
|
||||||
:autoSize="{ minRows: 1, maxRows: 1 }"
|
:autoSize="{ minRows: 1, maxRows: 1 }"
|
||||||
show-count
|
show-count
|
||||||
:maxlength="30" />
|
:maxlength="30" />
|
||||||
</a-form-item>
|
</a-form-item>
|
||||||
<a-form-item label="规则类型" name="resource">
|
<a-form-item label="规则类型" name="ruleType">
|
||||||
<a-radio-group v-model:value="infoObject.resource">
|
<a-radio-group v-model:value="infoObject.ruleType">
|
||||||
<a-radio value="1">且 (and) </a-radio>
|
<a-radio value="1">且 (and) </a-radio>
|
||||||
<a-radio value="2">或 (or) </a-radio>
|
<a-radio value="2">或 (or) </a-radio>
|
||||||
</a-radio-group>
|
</a-radio-group>
|
||||||
@@ -97,7 +105,7 @@
|
|||||||
">
|
">
|
||||||
<span style="line-height: 32px">{{ `逻辑${index}:` }}</span>
|
<span style="line-height: 32px">{{ `逻辑${index}:` }}</span>
|
||||||
<a-select
|
<a-select
|
||||||
v-model:value="infoObject.alarmList[index - 1].alarm"
|
v-model:value="infoObject.alarmList[index - 1].logic"
|
||||||
style="width: 70px; margin-left: 12px"
|
style="width: 70px; margin-left: 12px"
|
||||||
:options="ljOptions"
|
:options="ljOptions"
|
||||||
@change="handleQzChange" />
|
@change="handleQzChange" />
|
||||||
@@ -105,7 +113,7 @@
|
|||||||
<a-input
|
<a-input
|
||||||
style="width: 65px; margin-left: 6px"
|
style="width: 65px; margin-left: 6px"
|
||||||
type="number"
|
type="number"
|
||||||
v-model:value="infoObject.alarmList[index - 1].number" />
|
v-model:value="infoObject.alarmList[index - 1].num" />
|
||||||
<div
|
<div
|
||||||
style="width: 70px; align-items: center; cursor: pointer"
|
style="width: 70px; align-items: center; cursor: pointer"
|
||||||
@click="deleteAlarmList(index - 1)">
|
@click="deleteAlarmList(index - 1)">
|
||||||
@@ -114,7 +122,20 @@
|
|||||||
src="https://files.axshare.com/gsc/4T0UQR/5a/e6/81/5ae6813d499c422383c7a15dd956523f/images/设备规则/u72.svg?pageId=cbce6e61-bc6a-4283-802d-993fce6151c0" />
|
src="https://files.axshare.com/gsc/4T0UQR/5a/e6/81/5ae6813d499c422383c7a15dd956523f/images/设备规则/u72.svg?pageId=cbce6e61-bc6a-4283-802d-993fce6151c0" />
|
||||||
</div>
|
</div>
|
||||||
</div>
|
</div>
|
||||||
|
<div
|
||||||
|
v-if="
|
||||||
|
infoObject.alarmList[index - 1].num === null ||
|
||||||
|
infoObject.alarmList[index - 1].logic === null
|
||||||
|
"
|
||||||
|
style="width: 100%; color: #ff4d4f; text-align: center; margin-bottom: 5px">
|
||||||
|
请选择正确的逻辑{{ index }} 或 输入正确的数值{{ index }}
|
||||||
|
</div>
|
||||||
</template>
|
</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">
|
<div style="width: 100%; margin-top: 12px; display: flex; justify-content: flex-end">
|
||||||
<a-button type="primary" @click="addAlarmList"> 新增</a-button>
|
<a-button type="primary" @click="addAlarmList"> 新增</a-button>
|
||||||
</div>
|
</div>
|
||||||
@@ -124,26 +145,36 @@
|
|||||||
</template>
|
</template>
|
||||||
<script lang="ts" setup>
|
<script lang="ts" setup>
|
||||||
import { NsMessage } from '/nerv-lib/component';
|
import { NsMessage } from '/nerv-lib/component';
|
||||||
import { ref, toRaw } from 'vue';
|
import { ref, toRaw, watch } from 'vue';
|
||||||
import type { CascaderProps, TreeSelectProps, SelectProps } from 'ant-design-vue';
|
import type { CascaderProps, TreeSelectProps, SelectProps } from 'ant-design-vue';
|
||||||
import type { ShowSearchType } from 'ant-design-vue/es/cascader';
|
import type { ShowSearchType } from 'ant-design-vue/es/cascader';
|
||||||
|
import { device } from '/@/api/deviceManage';
|
||||||
|
import { http } from '/nerv-lib/util';
|
||||||
|
|
||||||
import type { Rule } from 'ant-design-vue/es/form';
|
import type { Rule } from 'ant-design-vue/es/form';
|
||||||
|
import { async } from '@antv/x6/lib/registry/marker/async';
|
||||||
|
|
||||||
const visible = ref(false);
|
const visible = ref(false);
|
||||||
//表单数据
|
//表单数据
|
||||||
const infoObject = ref({
|
const infoObject = ref({
|
||||||
id: null,
|
id: null,
|
||||||
name: null,
|
site: null,
|
||||||
resource: null,
|
ruleType: null,
|
||||||
desc: null,
|
abnormalDescription: null,
|
||||||
sbtype: null,
|
deviceType: [],
|
||||||
delivery: null,
|
devicePoint: null,
|
||||||
alarmList: [{ alarm: null, number: null }],
|
valueType: null,
|
||||||
|
deviceName: null,
|
||||||
|
enableRules: 0,
|
||||||
|
alarmList: [{ id: null, alarm: null, number: null, isDelete: '0' }],
|
||||||
});
|
});
|
||||||
//删除的逻辑列表
|
//删除的逻辑列表
|
||||||
const delAlarmList = ref([]);
|
const delAlarmList = ref([]);
|
||||||
const formRef = ref();
|
const formRef = ref();
|
||||||
|
//组织数
|
||||||
|
const orgId = ref('');
|
||||||
|
const result = JSON.parse(sessionStorage.getItem('ORGID')!);
|
||||||
|
orgId.value = result;
|
||||||
//站点数
|
//站点数
|
||||||
const zdTreeData = ref<TreeSelectProps['treeData']>([
|
const zdTreeData = ref<TreeSelectProps['treeData']>([
|
||||||
{
|
{
|
||||||
@@ -158,48 +189,39 @@
|
|||||||
},
|
},
|
||||||
]);
|
]);
|
||||||
//设备类型树
|
//设备类型树
|
||||||
const sbOptions: CascaderProps['options'] = [
|
let deviceTypeTreeData = ref([]);
|
||||||
{
|
//设备树
|
||||||
value: '3',
|
let deviceNameTreeData = ref([]);
|
||||||
label: '3.电梯',
|
//选择设备类型方法
|
||||||
children: [
|
const selectDeviceType = (value: any, selectedOptions: any) => {
|
||||||
{
|
//获取该类型设备
|
||||||
value: '301',
|
getDevicePage({
|
||||||
label: '301.扶梯',
|
orgId: orgId.value,
|
||||||
},
|
code: selectedOptions[selectedOptions.length - 1].code,
|
||||||
{
|
pageNum: 1,
|
||||||
value: '302',
|
pageSize: 999,
|
||||||
label: '301.直梯',
|
});
|
||||||
},
|
};
|
||||||
],
|
//选择设备方法
|
||||||
},
|
const selectDevice = (value: string) => {
|
||||||
{
|
console.log(`selected ${value}`);
|
||||||
value: '4',
|
};
|
||||||
label: '4.冷热源',
|
//获取设备列表
|
||||||
children: [
|
const getDevicePage = (value: any) => {
|
||||||
{
|
http.post(device.queryDevicePage, value).then((res) => {
|
||||||
value: '401',
|
if (res.msg === 'success') {
|
||||||
label: '402.冷水机组',
|
deviceNameTreeData.value = res.data.records;
|
||||||
},
|
}
|
||||||
{
|
});
|
||||||
value: '402',
|
};
|
||||||
label: '403.热泵机组',
|
//获取设备点位
|
||||||
},
|
const getDevicePoint = (value: any) => {
|
||||||
{
|
http.post(device.queryDevicePoint, value).then((res) => {
|
||||||
value: '403',
|
if (res.msg === 'success') {
|
||||||
label: '403.锅炉',
|
console.log(res, '数据');
|
||||||
},
|
}
|
||||||
{
|
});
|
||||||
value: '404',
|
};
|
||||||
label: '404.水处理机组',
|
|
||||||
},
|
|
||||||
{
|
|
||||||
value: '405',
|
|
||||||
label: '405.板式热交换机组',
|
|
||||||
},
|
|
||||||
],
|
|
||||||
},
|
|
||||||
];
|
|
||||||
//设备点位
|
//设备点位
|
||||||
const dwOptions = ref<SelectProps['options']>([
|
const dwOptions = ref<SelectProps['options']>([
|
||||||
{ value: '电压 (U)', label: '电压 (U)', code: '1' },
|
{ value: '电压 (U)', label: '电压 (U)', code: '1' },
|
||||||
@@ -234,7 +256,7 @@
|
|||||||
};
|
};
|
||||||
const handleChange = (value: string) => {
|
const handleChange = (value: string) => {
|
||||||
console.log(`selected ${value}`);
|
console.log(`selected ${value}`);
|
||||||
console.log('选择', infoObject.value.sbAdress);
|
console.log('选择', infoObject.value.devicePoint);
|
||||||
//获得code
|
//获得code
|
||||||
dwOptions.value.forEach((item) => {
|
dwOptions.value.forEach((item) => {
|
||||||
if (item.value === value) {
|
if (item.value === value) {
|
||||||
@@ -250,36 +272,95 @@
|
|||||||
}
|
}
|
||||||
});
|
});
|
||||||
};
|
};
|
||||||
|
//开关
|
||||||
|
const clickSwitch = () => {
|
||||||
|
if (infoObject.value.enableRules === 1) {
|
||||||
|
infoObject.value.enableRules = 0;
|
||||||
|
} else {
|
||||||
|
infoObject.value.enableRules = 1;
|
||||||
|
}
|
||||||
|
};
|
||||||
const emit = defineEmits(['editObject']);
|
const emit = defineEmits(['editObject']);
|
||||||
|
|
||||||
|
// 定义一个递归函数来查找每一级的id 设备类型回显 层级方法
|
||||||
|
function findParentIds(tree: any, targetId: number, result: any) {
|
||||||
|
for (let item of tree) {
|
||||||
|
if (item.children && item.children.length > 0) {
|
||||||
|
if (item.children.some((child: any) => child.id === targetId)) {
|
||||||
|
result.unshift(item.id); // 将当前节点的id添加到结果数组的最前面
|
||||||
|
findParentIds(tree, item.id, result); // 递归查找父级节点的id
|
||||||
|
break; // 找到后可以退出循环
|
||||||
|
}
|
||||||
|
}
|
||||||
|
}
|
||||||
|
}
|
||||||
|
// 递归 获取当前 选择的设备类型 对象 用来获取设备列表
|
||||||
|
const findNodeById = (nodes: any, id: any) => {
|
||||||
|
for (let node of nodes) {
|
||||||
|
if (node.id === id) {
|
||||||
|
//获取设备树
|
||||||
|
getDevicePage({ orgId: orgId.value, code: node.code, pageNum: 1, pageSize: 99 });
|
||||||
|
return;
|
||||||
|
} else if (node.children.length > 0) {
|
||||||
|
const found = findNodeById(node.children, id);
|
||||||
|
if (found) {
|
||||||
|
//获取设备树
|
||||||
|
getDevicePage({ orgId: orgId.value, code: found.code, pageNum: 1, pageSize: 99 });
|
||||||
|
return;
|
||||||
|
}
|
||||||
|
}
|
||||||
|
}
|
||||||
|
return null; // 没有找到目标节点,返回 null
|
||||||
|
};
|
||||||
//父调子 页面显示方法
|
//父调子 页面显示方法
|
||||||
const toggle = (value: any) => {
|
const toggle = async (value: any) => {
|
||||||
|
//获取设备类型
|
||||||
|
await http
|
||||||
|
.post(device.queryDeviceTree, { orgId: orgId.value, pageNum: 1, pageSize: 10 })
|
||||||
|
.then((res) => {
|
||||||
|
if (res.msg === 'success') {
|
||||||
|
deviceTypeTreeData.value = res.data;
|
||||||
|
}
|
||||||
|
});
|
||||||
//判断 是新增 还是修改
|
//判断 是新增 还是修改
|
||||||
if (value) {
|
if (value) {
|
||||||
infoObject.value = value;
|
infoObject.value = value;
|
||||||
|
// 获取 选择的设备类型对象
|
||||||
|
let selectDevice = ref([value.deviceType]);
|
||||||
|
findNodeById(deviceTypeTreeData.value, value.deviceType);
|
||||||
|
//获取设备点位
|
||||||
|
getDevicePoint({ id: 1 });
|
||||||
|
// 修改时
|
||||||
|
findParentIds(deviceTypeTreeData.value, value.deviceType, selectDevice.value);
|
||||||
|
infoObject.value.deviceType = selectDevice.value;
|
||||||
} else {
|
} else {
|
||||||
|
//获取设备树
|
||||||
infoObject.value = {
|
infoObject.value = {
|
||||||
id: null,
|
id: null,
|
||||||
name: null,
|
site: null,
|
||||||
resource: null,
|
ruleType: null,
|
||||||
desc: null,
|
abnormalDescription: null,
|
||||||
sbtype: null,
|
deviceType: [],
|
||||||
delivery: null,
|
devicePoint: null,
|
||||||
alarmList: [{ alarm: null, number: null }],
|
valueType: null,
|
||||||
|
deviceName: null,
|
||||||
|
enableRules: 0,
|
||||||
|
alarmList: [{ id: null, alarm: null, number: null, isDelete: '0' }],
|
||||||
};
|
};
|
||||||
}
|
}
|
||||||
|
|
||||||
visible.value = !visible.value;
|
visible.value = !visible.value;
|
||||||
};
|
};
|
||||||
//表单 判断规格
|
//表单 判断规格
|
||||||
const rules: Record<string, Rule[]> = {
|
const rules: infoObject<string, Rule[]> = {
|
||||||
name: [{ required: true, message: '请选择站点', trigger: 'change' }],
|
site: [{ required: true, message: '请选择站点', trigger: 'change' }],
|
||||||
sbtype: [{ required: true, message: '请选择设备类型', trigger: 'change' }],
|
deviceType: [{ required: true, message: '请选择设备类型', trigger: 'change' }],
|
||||||
delivery: [{ required: true, message: '请选择启用规则', trigger: 'change' }],
|
enableRules: [{ required: true, message: '请选择启用规则', trigger: 'change' }],
|
||||||
sbName: [{ required: true, message: '请选择设备名称', trigger: 'change' }],
|
deviceName: [{ required: true, message: '请选择设备名称', trigger: 'change' }],
|
||||||
sbAdress: [{ required: true, message: '请选择设备点位', trigger: 'change' }],
|
devicePoint: [{ required: true, message: '请选择设备点位', trigger: 'change' }],
|
||||||
qzType: [{ required: true, message: '请选择取值类型', trigger: 'change' }],
|
valueType: [{ required: true, message: '请选择取值类型', trigger: 'change' }],
|
||||||
resource: [{ required: true, message: '请选择规则类型', trigger: 'change' }],
|
ruleType: [{ required: true, message: '请选择规则类型', trigger: 'change' }],
|
||||||
desc: [{ required: true, message: '请输入异常描述', trigger: 'blur' }],
|
abnormalDescription: [{ required: true, message: '请输入异常描述', trigger: 'blur' }],
|
||||||
alarm: [{ required: true, message: '请选择逻辑', trigger: 'blur' }],
|
alarm: [{ required: true, message: '请选择逻辑', trigger: 'blur' }],
|
||||||
number: [{ required: true, message: '请输入数值', trigger: 'blur' }],
|
number: [{ required: true, message: '请输入数值', trigger: 'blur' }],
|
||||||
};
|
};
|
||||||
@@ -290,11 +371,24 @@
|
|||||||
// 确认按钮
|
// 确认按钮
|
||||||
const btnClick = () => {
|
const btnClick = () => {
|
||||||
console.log(infoObject.value, '数据');
|
console.log(infoObject.value, '数据');
|
||||||
console.log(dwOptions.value, '点位');
|
infoObject.value.alarmList.forEach((item) => {
|
||||||
dwOptions.value?.forEach;
|
if (item.logic === null || item.num === null) {
|
||||||
|
// NsMessage.error('请选择逻辑和数值');
|
||||||
|
return;
|
||||||
|
}
|
||||||
|
});
|
||||||
|
if (infoObject.value.alarmList.length < 2) {
|
||||||
|
NsMessage.error('请选择逻辑和数值');
|
||||||
|
return;
|
||||||
|
}
|
||||||
//数据是否验证通过
|
//数据是否验证通过
|
||||||
formRef.value.validate().then(() => {
|
formRef.value.validate().then(() => {
|
||||||
console.log('values', infoObject, toRaw(infoObject));
|
console.log('values', infoObject.value);
|
||||||
|
let data = toRaw(infoObject);
|
||||||
|
//逻辑列表
|
||||||
|
data.alarmList = [...infoObject.value.alarmList, ...delAlarmList.value];
|
||||||
|
//设备类型 只取最后一级的id
|
||||||
|
data.deviceType = infoObject.value.deviceType[infoObject.value.deviceType.length - 1];
|
||||||
delAlarmList.value = [];
|
delAlarmList.value = [];
|
||||||
});
|
});
|
||||||
//调用接口
|
//调用接口
|
||||||
@@ -317,31 +411,39 @@
|
|||||||
//对象清空
|
//对象清空
|
||||||
infoObject.value = {
|
infoObject.value = {
|
||||||
id: null,
|
id: null,
|
||||||
name: null,
|
site: null,
|
||||||
resource: null,
|
ruleType: null,
|
||||||
desc: null,
|
abnormalDescription: null,
|
||||||
sbtype: null,
|
deviceType: [],
|
||||||
delivery: null,
|
devicePoint: null,
|
||||||
alarmList: [{ alarm: null, number: null }],
|
enableRules: 0,
|
||||||
|
alarmList: [{ id: null, alarm: null, number: null, isDelete: '0' }],
|
||||||
};
|
};
|
||||||
visible.value = false;
|
visible.value = false;
|
||||||
delAlarmList.value = [];
|
delAlarmList.value = [];
|
||||||
NsMessage.success('操作成功');
|
|
||||||
};
|
};
|
||||||
// 新增逻辑列表
|
// 新增逻辑列表
|
||||||
const addAlarmList = () => {
|
const addAlarmList = () => {
|
||||||
if (infoObject.value.alarmList) {
|
if (infoObject.value.alarmList) {
|
||||||
infoObject.value.alarmList.push({ alarm: null, number: null });
|
infoObject.value.alarmList.push({ logic: null, num: null });
|
||||||
} else {
|
} else {
|
||||||
infoObject.value.alarmList = [{ alarm: null, number: null }];
|
infoObject.value.alarmList = [{ logic: null, num: null }];
|
||||||
}
|
}
|
||||||
};
|
};
|
||||||
// 删除 逻辑列表、
|
// 删除 逻辑列表、
|
||||||
const deleteAlarmList = (index: number) => {
|
const deleteAlarmList = (index: number) => {
|
||||||
if (infoObject.value.alarmList[index]?.id) {
|
// 确保 index 在有效范围内
|
||||||
delAlarmList.value.push(infoObject.value.alarmList[index]);
|
if (index < infoObject.value.alarmList.length && index >= 0) {
|
||||||
|
const alarmItemToDelete = infoObject.value.alarmList[index];
|
||||||
|
if (alarmItemToDelete?.id) {
|
||||||
|
// 添加到 delAlarmList 中,并标记为已删除
|
||||||
|
delAlarmList.value.push({ ...alarmItemToDelete, isDelete: '1' });
|
||||||
}
|
}
|
||||||
|
// 从 infoObject 中删除该元素
|
||||||
infoObject.value.alarmList.splice(index, 1);
|
infoObject.value.alarmList.splice(index, 1);
|
||||||
|
} else {
|
||||||
|
console.error('Invalid index: ', index);
|
||||||
|
}
|
||||||
};
|
};
|
||||||
defineExpose({
|
defineExpose({
|
||||||
toggle,
|
toggle,
|
||||||
|
|||||||
@@ -2,7 +2,8 @@
|
|||||||
<ns-drawer
|
<ns-drawer
|
||||||
v-model:visible="visible"
|
v-model:visible="visible"
|
||||||
width="520"
|
width="520"
|
||||||
:title="infoObject?.id ? '修改告警功能' : '新增告警'"
|
:title="infoObject?.id ? '修改设备告警' : '新增设备告警'"
|
||||||
|
:footer-style="{ textAlign: 'right' }"
|
||||||
:ok="btnClick"
|
:ok="btnClick"
|
||||||
:cancel="handleClose"
|
:cancel="handleClose"
|
||||||
placement="right">
|
placement="right">
|
||||||
@@ -10,10 +11,10 @@
|
|||||||
<div style="margin-left: 52px">
|
<div style="margin-left: 52px">
|
||||||
应用规则:
|
应用规则:
|
||||||
<a-switch
|
<a-switch
|
||||||
v-model:checked="infoObject.isUse"
|
:checked="infoObject?.enableRules === 1 ? true : false"
|
||||||
:class="{
|
:class="{
|
||||||
'blue-background': infoObject.isUse,
|
'blue-background': infoObject?.enableRules === 1 ? true : false,
|
||||||
'grey-background': !infoObject.isUse,
|
'grey-background': infoObject?.enableRules === 1 ? false : true,
|
||||||
}"
|
}"
|
||||||
style="margin-left: 6px"
|
style="margin-left: 6px"
|
||||||
@change="changeSwitch" />
|
@change="changeSwitch" />
|
||||||
@@ -23,23 +24,29 @@
|
|||||||
<script lang="ts" setup>
|
<script lang="ts" setup>
|
||||||
import { ref } from 'vue';
|
import { ref } from 'vue';
|
||||||
import { NsMessage } from '/nerv-lib/component';
|
import { NsMessage } from '/nerv-lib/component';
|
||||||
|
import { http } from '/nerv-lib/util';
|
||||||
|
import { deviceAlarms } from '/@/api/alarmSettings/deviceAlarms';
|
||||||
|
|
||||||
const visible = ref(false);
|
const visible = ref(false);
|
||||||
//表单数据
|
//表单数据
|
||||||
const infoObject = ref({});
|
const infoObject = ref({
|
||||||
|
id: null,
|
||||||
|
accountNo: null,
|
||||||
|
enableRules: 0,
|
||||||
|
});
|
||||||
const formRef = ref();
|
const formRef = ref();
|
||||||
const emit = defineEmits(['editObject']);
|
const emit = defineEmits(['editObject']);
|
||||||
const toggle = (value) => {
|
const toggle = (value: any) => {
|
||||||
//判断 是新增 还是修改
|
//判断 是新增 还是修改
|
||||||
if (value) {
|
if (value) {
|
||||||
infoObject.value = value;
|
infoObject.value = value;
|
||||||
} else {
|
} else {
|
||||||
infoObject.value = {
|
infoObject.value = {
|
||||||
|
id: null,
|
||||||
accountNo: null,
|
accountNo: null,
|
||||||
|
enableRules: 0,
|
||||||
};
|
};
|
||||||
}
|
}
|
||||||
console.log('xxxx');
|
|
||||||
|
|
||||||
visible.value = !visible.value;
|
visible.value = !visible.value;
|
||||||
};
|
};
|
||||||
const schemas = [
|
const schemas = [
|
||||||
@@ -52,7 +59,7 @@
|
|||||||
componentProps: {
|
componentProps: {
|
||||||
schemas: [
|
schemas: [
|
||||||
{
|
{
|
||||||
field: 'accountNo',
|
field: 'alarmTitle',
|
||||||
label: '告警标题',
|
label: '告警标题',
|
||||||
component: 'NsInput',
|
component: 'NsInput',
|
||||||
rules: [
|
rules: [
|
||||||
@@ -68,7 +75,7 @@
|
|||||||
},
|
},
|
||||||
},
|
},
|
||||||
{
|
{
|
||||||
field: 'select',
|
field: 'repetitions',
|
||||||
label: '重复次数',
|
label: '重复次数',
|
||||||
rules: [
|
rules: [
|
||||||
{
|
{
|
||||||
@@ -85,31 +92,31 @@
|
|||||||
options: [
|
options: [
|
||||||
{
|
{
|
||||||
label: '单次',
|
label: '单次',
|
||||||
value: 0,
|
|
||||||
},
|
|
||||||
{
|
|
||||||
label: '重复',
|
|
||||||
value: 1,
|
value: 1,
|
||||||
},
|
},
|
||||||
{
|
{
|
||||||
label: '累计',
|
label: '重复',
|
||||||
value: 2,
|
value: 2,
|
||||||
},
|
},
|
||||||
|
{
|
||||||
|
label: '累计',
|
||||||
|
value: 3,
|
||||||
|
},
|
||||||
],
|
],
|
||||||
},
|
},
|
||||||
},
|
},
|
||||||
{
|
{
|
||||||
field: 'accountNo',
|
field: 'monitorTime',
|
||||||
label: '检测时长',
|
label: '检测时长',
|
||||||
component: 'NsInputNumber',
|
component: 'NsInputNumber',
|
||||||
rules: [
|
rules: [
|
||||||
{
|
{
|
||||||
required: true,
|
required: true,
|
||||||
validator: (rules, value, cbfn) => {
|
validator: (rules: any, value: any, cbfn: any) => {
|
||||||
if (value && /^[0-9]*$/.test(value)) {
|
if (value && /^[0-9]*$/.test(value)) {
|
||||||
cbfn();
|
cbfn();
|
||||||
} else {
|
} else {
|
||||||
cbfn('请输入正确的检测时长');
|
cbfn('请输入正确的监测时长');
|
||||||
}
|
}
|
||||||
},
|
},
|
||||||
trigger: 'change',
|
trigger: 'change',
|
||||||
@@ -121,7 +128,7 @@
|
|||||||
},
|
},
|
||||||
},
|
},
|
||||||
{
|
{
|
||||||
field: 'danwei',
|
field: 'monitorTimeUnit',
|
||||||
label: '监测时长单位',
|
label: '监测时长单位',
|
||||||
component: 'NsSelect',
|
component: 'NsSelect',
|
||||||
rules: [
|
rules: [
|
||||||
@@ -151,7 +158,7 @@
|
|||||||
},
|
},
|
||||||
},
|
},
|
||||||
{
|
{
|
||||||
field: 'select',
|
field: 'priority',
|
||||||
label: '优先级',
|
label: '优先级',
|
||||||
component: 'NsSelect',
|
component: 'NsSelect',
|
||||||
rules: [
|
rules: [
|
||||||
@@ -184,36 +191,32 @@
|
|||||||
},
|
},
|
||||||
},
|
},
|
||||||
];
|
];
|
||||||
|
//开关
|
||||||
const changeSwitch = () => {
|
const changeSwitch = () => {
|
||||||
console.log(infoObject.value.selectSwitch, '开关');
|
switch (infoObject.value.enableRules) {
|
||||||
|
case 1:
|
||||||
|
infoObject.value.enableRules = 0;
|
||||||
|
break;
|
||||||
|
case 0:
|
||||||
|
infoObject.value.enableRules = 1;
|
||||||
|
break;
|
||||||
|
}
|
||||||
};
|
};
|
||||||
const btnClick = () => {
|
const btnClick = () => {
|
||||||
//表单校验
|
//表单校验
|
||||||
formRef.value.triggerSubmit().then((data: any) => {
|
formRef.value.triggerSubmit().then(() => {
|
||||||
console.log('校验成功');
|
|
||||||
console.log('data', infoObject.value);
|
|
||||||
visible.value = false;
|
|
||||||
NsMessage.success('操作成功');
|
|
||||||
emit('editObject', null);
|
|
||||||
//调用接口
|
//调用接口
|
||||||
// http
|
http.post(deviceAlarms.addOrUpNewData, infoObject.value).then(() => {
|
||||||
// .post(props.api, data)
|
NsMessage.success('操作成功');
|
||||||
// .then(() => {
|
visible.value = false;
|
||||||
// isLoading.value = false;
|
emit('editObject', null);
|
||||||
// NsMessage.success('操作成功', 1, () => {
|
});
|
||||||
// navigateBack();
|
|
||||||
// });
|
|
||||||
// })
|
|
||||||
// .catch(() => {
|
|
||||||
// isLoading.value = false;
|
|
||||||
// });
|
|
||||||
});
|
});
|
||||||
};
|
};
|
||||||
const handleClose = () => {
|
const handleClose = () => {
|
||||||
// 清楚校验错误信息
|
// 清楚校验错误信息
|
||||||
formRef.value.formElRef.clearValidate();
|
formRef.value.formElRef.clearValidate();
|
||||||
console.log(infoObject.value);
|
console.log(infoObject.value);
|
||||||
infoObject.value = {};
|
|
||||||
visible.value = false;
|
visible.value = false;
|
||||||
NsMessage.success('操作成功');
|
NsMessage.success('操作成功');
|
||||||
};
|
};
|
||||||
|
|||||||
@@ -4,36 +4,48 @@
|
|||||||
<a-tab-pane key="1" tab="通知管理">
|
<a-tab-pane key="1" tab="通知管理">
|
||||||
<ns-view-list-table v-bind="notificationConfig" ref="mainRef">
|
<ns-view-list-table v-bind="notificationConfig" ref="mainRef">
|
||||||
<template #bodyCell="{ record, column }">
|
<template #bodyCell="{ record, column }">
|
||||||
<template v-if="column.dataIndex === 'isUse'">
|
<template v-if="column.dataIndex === 'enableRules'">
|
||||||
<a-switch
|
<a-switch
|
||||||
v-model:checked="record.isUse"
|
:checked="record.enableRules === 1 ? true : false"
|
||||||
:class="{
|
:class="{
|
||||||
'blue-background': record.isUse,
|
'blue-background': record.enableRules === 1 ? true : false,
|
||||||
'grey-background': !record.isUse,
|
'grey-background': record.enableRules === 1 ? false : true,
|
||||||
}"
|
}"
|
||||||
@click="clickSwitch({ isUse: record.isUse, record: record })" />
|
@change="clickSwitch({ enableRules: record.enableRules, record: record })" />
|
||||||
</template>
|
</template>
|
||||||
</template>
|
</template>
|
||||||
</ns-view-list-table>
|
</ns-view-list-table>
|
||||||
|
<!-- 联系方式 -->
|
||||||
</a-tab-pane>
|
</a-tab-pane>
|
||||||
<a-tab-pane key="2" tab="设备告警" force-render>
|
<a-tab-pane key="2" tab="设备告警" force-render>
|
||||||
<ns-view-list-table v-show="equipmentAlarm" class="table" v-bind="equipmentAlarmConfig">
|
<ns-view-list-table
|
||||||
|
v-show="equipmentAlarm"
|
||||||
|
ref="mainRefEquipmentAlarm"
|
||||||
|
class="table"
|
||||||
|
v-bind="equipmentAlarmConfig">
|
||||||
<template #bodyCell="{ record, column }">
|
<template #bodyCell="{ record, column }">
|
||||||
<template v-if="column.dataIndex === 'isUse'">
|
<template v-if="column.dataIndex === 'enableRules'">
|
||||||
<a-switch
|
<a-switch
|
||||||
v-model:checked="record.isUse"
|
:checked="record.enableRules === 1 ? true : false"
|
||||||
:class="{
|
:class="{
|
||||||
'blue-background': record.isUse,
|
'blue-background': record.enableRules === 1 ? true : false,
|
||||||
'grey-background': !record.isUse,
|
'grey-background': record.enableRules === 1 ? false : true,
|
||||||
}"
|
}"
|
||||||
@click="clickSwitch({ isUse: record.isUse, record: record })" />
|
@change="clickSwitch({ enableRules: record.enableRules, record: record })" />
|
||||||
|
</template>
|
||||||
|
<template v-if="column.dataIndex === 'monitor'">
|
||||||
|
{{
|
||||||
|
record?.monitorTime && record?.monitorTimeUnit
|
||||||
|
? record?.monitorTime + record?.monitorTimeUnit
|
||||||
|
: '-'
|
||||||
|
}}
|
||||||
</template>
|
</template>
|
||||||
</template>
|
</template>
|
||||||
</ns-view-list-table>
|
</ns-view-list-table>
|
||||||
<a-button
|
<a-button
|
||||||
v-if="!equipmentAlarm"
|
v-if="!equipmentAlarm"
|
||||||
type="primary"
|
type="primary"
|
||||||
style="position: absolute; right: 130px; z-index: 99; top: 75px"
|
style="position: absolute; right: 130px; z-index: 99; top: 80px; height: 30px"
|
||||||
@click="backequipmentAlarm"
|
@click="backequipmentAlarm"
|
||||||
>返回</a-button
|
>返回</a-button
|
||||||
>
|
>
|
||||||
@@ -43,7 +55,34 @@
|
|||||||
<configureDeviceAlarms v-show="!equipmentAlarm" ref="configureDeviceAlarms" />
|
<configureDeviceAlarms v-show="!equipmentAlarm" ref="configureDeviceAlarms" />
|
||||||
</a-tab-pane>
|
</a-tab-pane>
|
||||||
<a-tab-pane key="3" tab="能源告警">
|
<a-tab-pane key="3" tab="能源告警">
|
||||||
<energyAlarm class="full-height" />
|
<ns-view-list-table
|
||||||
|
v-bind="energyAlarmConfig"
|
||||||
|
v-show="energyAlarm"
|
||||||
|
ref="mainEnergyAlarmConfig"
|
||||||
|
class="table">
|
||||||
|
<template #bodyCell="{ record, column }">
|
||||||
|
<template v-if="column.dataIndex === 'enableRules'">
|
||||||
|
<a-switch
|
||||||
|
:checked="record.enableRules === 1 ? true : false"
|
||||||
|
:class="{
|
||||||
|
'blue-background': record.enableRules === 1 ? true : false,
|
||||||
|
'grey-background': record.enableRules === 1 ? false : true,
|
||||||
|
}"
|
||||||
|
@click="clickSwitch({ enableRules: record.enableRules, record: record })" />
|
||||||
|
</template>
|
||||||
|
</template>
|
||||||
|
</ns-view-list-table>
|
||||||
|
<a-button
|
||||||
|
v-if="!energyAlarm"
|
||||||
|
type="primary"
|
||||||
|
style="position: absolute; right: 130px; z-index: 99; top: 80px; height: 30px"
|
||||||
|
@click="backenergyAlarm"
|
||||||
|
>返回</a-button
|
||||||
|
>
|
||||||
|
<!-- 新增 或 编辑 能源告警 -->
|
||||||
|
<editeEnergyAlarm ref="editeEnergyAlarm" @editObject="editObject" />
|
||||||
|
<!-- 配置能源告警-->
|
||||||
|
<configureEnergyAlarms v-show="!energyAlarm" ref="configureEnergyAlarms" />
|
||||||
</a-tab-pane>
|
</a-tab-pane>
|
||||||
</a-tabs>
|
</a-tabs>
|
||||||
</div>
|
</div>
|
||||||
@@ -51,22 +90,47 @@
|
|||||||
<script lang="ts">
|
<script lang="ts">
|
||||||
import { notificationtableConfig } from './ts/notificationManagementConfig';
|
import { notificationtableConfig } from './ts/notificationManagementConfig';
|
||||||
import { equipmentAlarmTableConfig } from './ts/equipmentAlarmConfig';
|
import { equipmentAlarmTableConfig } from './ts/equipmentAlarmConfig';
|
||||||
import { ref } from 'vue';
|
import { energyAlarmConfigs } from './ts/energyAlarmConfig';
|
||||||
import energyAlarm from './components/energyAlarm.vue';
|
import { ref, createVNode } from 'vue';
|
||||||
|
import { http } from '/nerv-lib/util';
|
||||||
|
import { NsMessage, NsModal } from '/nerv-lib/component';
|
||||||
import editeEquipmentAlarm from './equipmentAlarm/editeEquipmentAlarm.vue';
|
import editeEquipmentAlarm from './equipmentAlarm/editeEquipmentAlarm.vue';
|
||||||
|
import editeEnergyAlarm from './energyAlarm/editeEnergyAlarm.vue';
|
||||||
|
import configureEnergyAlarms from './energyAlarm/configureEnergyAlarms.vue';
|
||||||
import configureDeviceAlarms from './equipmentAlarm/configureDeviceAlarms.vue';
|
import configureDeviceAlarms from './equipmentAlarm/configureDeviceAlarms.vue';
|
||||||
|
import { deviceAlarms } from '/@/api/alarmSettings/deviceAlarms';
|
||||||
|
import { ExclamationCircleOutlined } from '@ant-design/icons-vue';
|
||||||
|
|
||||||
export default {
|
export default {
|
||||||
name: 'AlarmSettings',
|
name: 'AlarmSettings',
|
||||||
components: { energyAlarm, editeEquipmentAlarm, configureDeviceAlarms },
|
components: {
|
||||||
|
editeEquipmentAlarm,
|
||||||
|
configureDeviceAlarms,
|
||||||
|
configureEnergyAlarms,
|
||||||
|
editeEnergyAlarm,
|
||||||
|
},
|
||||||
setup() {
|
setup() {
|
||||||
const mainRef = ref();
|
const mainRef = ref();
|
||||||
|
const mainRefEquipmentAlarm = ref();
|
||||||
|
const mainEnergyAlarmConfig = ref();
|
||||||
const editEquipmentAlarm = ref();
|
const editEquipmentAlarm = ref();
|
||||||
|
const editeEnergyAlarm = ref();
|
||||||
const configureDeviceAlarms = ref();
|
const configureDeviceAlarms = ref();
|
||||||
|
const configureEnergyAlarms = ref();
|
||||||
const equipmentAlarm = ref(true);
|
const equipmentAlarm = ref(true);
|
||||||
const notificationConfig = notificationtableConfig(null, null, null);
|
const energyAlarm = ref(true);
|
||||||
|
const notificationConfig = notificationtableConfig(null, mainEnergyAlarmConfig, null);
|
||||||
|
//能源告警配置
|
||||||
|
const energyAlarmConfig = energyAlarmConfigs(
|
||||||
|
editeEnergyAlarm,
|
||||||
|
mainRefEquipmentAlarm,
|
||||||
|
energyAlarm,
|
||||||
|
configureEnergyAlarms,
|
||||||
|
);
|
||||||
|
//设备告警配置
|
||||||
const equipmentAlarmConfig = equipmentAlarmTableConfig(
|
const equipmentAlarmConfig = equipmentAlarmTableConfig(
|
||||||
editEquipmentAlarm,
|
editEquipmentAlarm,
|
||||||
null,
|
mainRefEquipmentAlarm,
|
||||||
equipmentAlarm,
|
equipmentAlarm,
|
||||||
configureDeviceAlarms,
|
configureDeviceAlarms,
|
||||||
);
|
);
|
||||||
@@ -78,27 +142,52 @@
|
|||||||
equipmentAlarm.value = !equipmentAlarm.value;
|
equipmentAlarm.value = !equipmentAlarm.value;
|
||||||
configureDeviceAlarms.value.show = false;
|
configureDeviceAlarms.value.show = false;
|
||||||
};
|
};
|
||||||
|
const backenergyAlarm = () => {
|
||||||
|
energyAlarm.value = !energyAlarm.value;
|
||||||
|
configureEnergyAlarms.value.show = false;
|
||||||
|
};
|
||||||
const clickSwitch = (data: any) => {
|
const clickSwitch = (data: any) => {
|
||||||
console.log(data, '数据');
|
console.log(data.record.enableRules === 1 ? '关闭' : '启用');
|
||||||
mainRef.value?.nsTableRef.reload();
|
NsModal.confirm({
|
||||||
|
title: '启用状态',
|
||||||
|
icon: createVNode(ExclamationCircleOutlined),
|
||||||
|
content: '确定' + (data.record.enableRules === 1 ? '关闭' : '启用') + '吗?',
|
||||||
|
onOk: () => {
|
||||||
|
http
|
||||||
|
.post(deviceAlarms.addOrUpNewData, {
|
||||||
|
id: data.record.id,
|
||||||
|
enableRules: data.record.enableRules === 1 ? 0 : 1,
|
||||||
|
})
|
||||||
|
.then(() => {
|
||||||
|
NsMessage.success('操作成功');
|
||||||
|
mainRefEquipmentAlarm.value?.nsTableRef.reload();
|
||||||
|
});
|
||||||
|
},
|
||||||
|
});
|
||||||
};
|
};
|
||||||
// 编辑或添加成功 刷新列表
|
// 编辑或添加成功 刷新列表
|
||||||
const editObject = () => {
|
const editObject = () => {
|
||||||
console.log('添加成功 刷新列表');
|
mainRefEquipmentAlarm.value?.nsTableRef.reload();
|
||||||
mainRef.value?.nsTableRef.reload();
|
|
||||||
// console.log(newList.value.formFinish, '数据');
|
// console.log(newList.value.formFinish, '数据');
|
||||||
};
|
};
|
||||||
return {
|
return {
|
||||||
callback,
|
callback,
|
||||||
notificationConfig,
|
notificationConfig,
|
||||||
|
energyAlarmConfig,
|
||||||
equipmentAlarmConfig,
|
equipmentAlarmConfig,
|
||||||
editObject,
|
editObject,
|
||||||
clickSwitch,
|
clickSwitch,
|
||||||
editEquipmentAlarm,
|
editEquipmentAlarm,
|
||||||
|
editeEnergyAlarm,
|
||||||
configureDeviceAlarms,
|
configureDeviceAlarms,
|
||||||
|
configureEnergyAlarms,
|
||||||
equipmentAlarm,
|
equipmentAlarm,
|
||||||
|
energyAlarm,
|
||||||
backequipmentAlarm,
|
backequipmentAlarm,
|
||||||
|
backenergyAlarm,
|
||||||
mainRef,
|
mainRef,
|
||||||
|
mainRefEquipmentAlarm,
|
||||||
|
mainEnergyAlarmConfig,
|
||||||
};
|
};
|
||||||
},
|
},
|
||||||
};
|
};
|
||||||
|
|||||||
@@ -43,6 +43,13 @@
|
|||||||
"children": null,
|
"children": null,
|
||||||
"devicePointList": null,
|
"devicePointList": null,
|
||||||
"insertUser": null,
|
"insertUser": null,
|
||||||
|
"priority": "1",
|
||||||
|
"alarmTitle": "电压异常告警",
|
||||||
|
"errorCode": "A001",
|
||||||
|
"monitorTime":"1",
|
||||||
|
"repetitions":"1",
|
||||||
|
"monitorTimeUnit": "分",
|
||||||
|
"enableRules": "1",
|
||||||
"isUse":true
|
"isUse":true
|
||||||
} , {
|
} , {
|
||||||
"id": "d5",
|
"id": "d5",
|
||||||
@@ -87,6 +94,13 @@
|
|||||||
"children": null,
|
"children": null,
|
||||||
"devicePointList": null,
|
"devicePointList": null,
|
||||||
"insertUser": null,
|
"insertUser": null,
|
||||||
|
"priority": "1",
|
||||||
|
"alarmTitle": "电压异常告警",
|
||||||
|
"errorCode": "A001",
|
||||||
|
"monitorTime":"1",
|
||||||
|
"repetitions":"1",
|
||||||
|
"monitorTimeUnit": "分",
|
||||||
|
"enableRules": "0",
|
||||||
"isUse":true
|
"isUse":true
|
||||||
}
|
}
|
||||||
]
|
]
|
||||||
|
|||||||
@@ -0,0 +1,197 @@
|
|||||||
|
import data from '../notificationManagementMock.json';
|
||||||
|
import { http } from '/nerv-lib/util';
|
||||||
|
import { NsMessage } from '/nerv-lib/component';
|
||||||
|
import { deviceAlarms } from '/@/api/alarmSettings/deviceAlarms';
|
||||||
|
|
||||||
|
import { ref } from 'vue';
|
||||||
|
const tableKeyMap = [
|
||||||
|
{
|
||||||
|
title: '序号',
|
||||||
|
dataIndex: 'address',
|
||||||
|
customRender: (text: any) => {
|
||||||
|
return text.index + 1;
|
||||||
|
},
|
||||||
|
},
|
||||||
|
{
|
||||||
|
title: '优先级',
|
||||||
|
dataIndex: 'priority',
|
||||||
|
},
|
||||||
|
{
|
||||||
|
title: '告警标题',
|
||||||
|
dataIndex: 'alarmTitle',
|
||||||
|
},
|
||||||
|
{
|
||||||
|
title: '错误码',
|
||||||
|
dataIndex: 'errorCode',
|
||||||
|
},
|
||||||
|
{
|
||||||
|
title: '重复次数',
|
||||||
|
dataIndex: 'repetitions',
|
||||||
|
textEllipsis: true,
|
||||||
|
},
|
||||||
|
{
|
||||||
|
title: '监测时长',
|
||||||
|
dataIndex: 'monitor',
|
||||||
|
},
|
||||||
|
{
|
||||||
|
title: '是否启用',
|
||||||
|
dataIndex: 'enableRules',
|
||||||
|
},
|
||||||
|
];
|
||||||
|
const mockData = ref(data.listData);
|
||||||
|
const doWnload = (url: any) => {
|
||||||
|
const a = document.createElement('a');
|
||||||
|
document.body.appendChild(a);
|
||||||
|
a.href = encodeURI(url);
|
||||||
|
//设置下载的文件名
|
||||||
|
// a.download = fileName.value;
|
||||||
|
//触发a标签的点击事件,进行下载
|
||||||
|
a.click();
|
||||||
|
};
|
||||||
|
|
||||||
|
export const energyAlarmConfigs = (
|
||||||
|
editeEnergyAlarm: any,
|
||||||
|
mainRefEquipmentAlarm: any,
|
||||||
|
energyAlarm: any,
|
||||||
|
configureDeviceAlarms: any,
|
||||||
|
) => {
|
||||||
|
return {
|
||||||
|
title: '告警规则',
|
||||||
|
api: deviceAlarms.getTableList,
|
||||||
|
value: mockData.value,
|
||||||
|
headerActions: [
|
||||||
|
{
|
||||||
|
label: '新增',
|
||||||
|
name: 'RoleTypeAdd',
|
||||||
|
type: 'primary',
|
||||||
|
handle: () => {
|
||||||
|
editeEnergyAlarm.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,
|
||||||
|
// rowSelection: null, 选择按钮
|
||||||
|
columnActions: {
|
||||||
|
title: '操作',
|
||||||
|
actions: [
|
||||||
|
{
|
||||||
|
label: '编辑',
|
||||||
|
name: 'FeedBackDetail',
|
||||||
|
dynamicParams: ['uuid', 'appealType'],
|
||||||
|
handle: (data: any) => {
|
||||||
|
editeEnergyAlarm.value.toggle(data);
|
||||||
|
},
|
||||||
|
},
|
||||||
|
{
|
||||||
|
label: '配置',
|
||||||
|
name: 'FeedBackDetail',
|
||||||
|
dynamicParams: ['uuid', 'appealType'],
|
||||||
|
handle: (data: any) => {
|
||||||
|
energyAlarm.value = !energyAlarm.value;
|
||||||
|
configureDeviceAlarms.value.setconfigureDeviceAlarmsData(data);
|
||||||
|
},
|
||||||
|
},
|
||||||
|
{
|
||||||
|
label: '删除',
|
||||||
|
name: 'FeedBackDetail',
|
||||||
|
dynamicParams: ['uuid', 'appealType'],
|
||||||
|
confirm: true,
|
||||||
|
handle: (data: any) => {
|
||||||
|
http.post(deviceAlarms.del, { id: data.id }).then(() => {
|
||||||
|
NsMessage.success('操作成功');
|
||||||
|
mainRefEquipmentAlarm.value?.nsTableRef.reload();
|
||||||
|
});
|
||||||
|
},
|
||||||
|
},
|
||||||
|
],
|
||||||
|
},
|
||||||
|
|
||||||
|
formConfig: {
|
||||||
|
schemas: [
|
||||||
|
{
|
||||||
|
field: 'priority',
|
||||||
|
label: '告警优先级',
|
||||||
|
component: 'NsSelect',
|
||||||
|
componentProps: {
|
||||||
|
placeholder: '请选择告警优先级',
|
||||||
|
options: [
|
||||||
|
{
|
||||||
|
label: '紧急',
|
||||||
|
value: 1,
|
||||||
|
},
|
||||||
|
{
|
||||||
|
label: '重要',
|
||||||
|
value: 2,
|
||||||
|
},
|
||||||
|
{
|
||||||
|
label: '一般',
|
||||||
|
value: 3,
|
||||||
|
},
|
||||||
|
],
|
||||||
|
},
|
||||||
|
},
|
||||||
|
{
|
||||||
|
field: 'alarmTitle',
|
||||||
|
label: '告警标题',
|
||||||
|
component: 'NsInput',
|
||||||
|
componentProps: {
|
||||||
|
placeholder: '请输入告警标题关键字',
|
||||||
|
},
|
||||||
|
},
|
||||||
|
{
|
||||||
|
field: 'errorCode',
|
||||||
|
label: '错误码',
|
||||||
|
component: 'NsInput',
|
||||||
|
componentProps: {
|
||||||
|
placeholder: '请输入告警错误码',
|
||||||
|
},
|
||||||
|
},
|
||||||
|
{
|
||||||
|
field: 'enableRules',
|
||||||
|
label: '启用状态',
|
||||||
|
component: 'NsSelect',
|
||||||
|
componentProps: {
|
||||||
|
placeholder: '请选择启用状态',
|
||||||
|
options: [
|
||||||
|
{
|
||||||
|
label: '启用',
|
||||||
|
value: 1,
|
||||||
|
},
|
||||||
|
{
|
||||||
|
label: '关闭',
|
||||||
|
value: 0,
|
||||||
|
},
|
||||||
|
],
|
||||||
|
},
|
||||||
|
},
|
||||||
|
],
|
||||||
|
},
|
||||||
|
// pagination: { pageSizeOptions: false },
|
||||||
|
rowKey: 'id',
|
||||||
|
};
|
||||||
|
};
|
||||||
@@ -1,7 +1,8 @@
|
|||||||
import { dateUtil } from '/nerv-lib/util/date-util';
|
|
||||||
import data from '../notificationManagementMock.json';
|
import data from '../notificationManagementMock.json';
|
||||||
import { http } from '/nerv-lib/util';
|
import { http } from '/nerv-lib/util';
|
||||||
import { Modal } from 'ant-design-vue';
|
import { NsMessage } from '/nerv-lib/component';
|
||||||
|
import { deviceAlarms } from '/@/api/alarmSettings/deviceAlarms';
|
||||||
|
|
||||||
import { ref } from 'vue';
|
import { ref } from 'vue';
|
||||||
const tableKeyMap = [
|
const tableKeyMap = [
|
||||||
{
|
{
|
||||||
@@ -13,36 +14,32 @@ const tableKeyMap = [
|
|||||||
},
|
},
|
||||||
{
|
{
|
||||||
title: '优先级',
|
title: '优先级',
|
||||||
dataIndex: 'id',
|
dataIndex: 'priority',
|
||||||
},
|
|
||||||
{
|
|
||||||
title: '告警类型',
|
|
||||||
dataIndex: 'deviceCode',
|
|
||||||
},
|
},
|
||||||
{
|
{
|
||||||
title: '告警标题',
|
title: '告警标题',
|
||||||
dataIndex: 'deviceName',
|
dataIndex: 'alarmTitle',
|
||||||
},
|
},
|
||||||
{
|
{
|
||||||
title: '错误码',
|
title: '错误码',
|
||||||
dataIndex: 'position',
|
dataIndex: 'errorCode',
|
||||||
},
|
},
|
||||||
{
|
{
|
||||||
title: '重复次数',
|
title: '重复次数',
|
||||||
dataIndex: 'position',
|
dataIndex: 'repetitions',
|
||||||
textEllipsis: true,
|
textEllipsis: true,
|
||||||
},
|
},
|
||||||
{
|
{
|
||||||
title: '监测时长',
|
title: '监测时长',
|
||||||
dataIndex: 'position',
|
dataIndex: 'monitor',
|
||||||
},
|
},
|
||||||
{
|
{
|
||||||
title: '启用通知',
|
title: '是否启用',
|
||||||
dataIndex: 'isUse',
|
dataIndex: 'enableRules',
|
||||||
},
|
},
|
||||||
];
|
];
|
||||||
const mockData = ref(data.listData);
|
const mockData = ref(data.listData);
|
||||||
const doWnload = (url) => {
|
const doWnload = (url: any) => {
|
||||||
const a = document.createElement('a');
|
const a = document.createElement('a');
|
||||||
document.body.appendChild(a);
|
document.body.appendChild(a);
|
||||||
a.href = encodeURI(url);
|
a.href = encodeURI(url);
|
||||||
@@ -53,14 +50,14 @@ const doWnload = (url) => {
|
|||||||
};
|
};
|
||||||
|
|
||||||
export const equipmentAlarmTableConfig = (
|
export const equipmentAlarmTableConfig = (
|
||||||
editEquipmentAlarm,
|
editEquipmentAlarm: any,
|
||||||
elFormula,
|
mainRefEquipmentAlarm: any,
|
||||||
equipmentAlarm,
|
equipmentAlarm: any,
|
||||||
configureDeviceAlarms,
|
configureDeviceAlarms: any,
|
||||||
) => {
|
) => {
|
||||||
return {
|
return {
|
||||||
title: '告警规则',
|
title: '告警规则',
|
||||||
// api: '/carbon_emission/device/getDeviceList',
|
api: deviceAlarms.getTableList,
|
||||||
value: mockData.value,
|
value: mockData.value,
|
||||||
headerActions: [
|
headerActions: [
|
||||||
{
|
{
|
||||||
@@ -124,8 +121,11 @@ export const equipmentAlarmTableConfig = (
|
|||||||
name: 'FeedBackDetail',
|
name: 'FeedBackDetail',
|
||||||
dynamicParams: ['uuid', 'appealType'],
|
dynamicParams: ['uuid', 'appealType'],
|
||||||
confirm: true,
|
confirm: true,
|
||||||
handle: () => {
|
handle: (data: any) => {
|
||||||
// mockData.value.splice(0, 1);
|
http.post(deviceAlarms.del, { id: data.id }).then(() => {
|
||||||
|
NsMessage.success('操作成功');
|
||||||
|
mainRefEquipmentAlarm.value?.nsTableRef.reload();
|
||||||
|
});
|
||||||
},
|
},
|
||||||
},
|
},
|
||||||
],
|
],
|
||||||
@@ -134,29 +134,29 @@ export const equipmentAlarmTableConfig = (
|
|||||||
formConfig: {
|
formConfig: {
|
||||||
schemas: [
|
schemas: [
|
||||||
{
|
{
|
||||||
field: 'provider',
|
field: 'priority',
|
||||||
label: '告警优先级',
|
label: '告警优先级',
|
||||||
component: 'NsSelect',
|
component: 'NsSelect',
|
||||||
componentProps: {
|
componentProps: {
|
||||||
placeholder: '请选择告警优先级',
|
placeholder: '请选择告警优先级',
|
||||||
options: [
|
options: [
|
||||||
{
|
{
|
||||||
label: '全部',
|
label: '紧急',
|
||||||
value: '',
|
value: 1,
|
||||||
},
|
},
|
||||||
{
|
{
|
||||||
label: '启用',
|
label: '重要',
|
||||||
value: '1',
|
value: 2,
|
||||||
},
|
},
|
||||||
{
|
{
|
||||||
label: '关闭',
|
label: '一般',
|
||||||
value: '0',
|
value: 3,
|
||||||
},
|
},
|
||||||
],
|
],
|
||||||
},
|
},
|
||||||
},
|
},
|
||||||
{
|
{
|
||||||
field: 'provider',
|
field: 'alarmTitle',
|
||||||
label: '告警标题',
|
label: '告警标题',
|
||||||
component: 'NsInput',
|
component: 'NsInput',
|
||||||
componentProps: {
|
componentProps: {
|
||||||
@@ -164,31 +164,27 @@ export const equipmentAlarmTableConfig = (
|
|||||||
},
|
},
|
||||||
},
|
},
|
||||||
{
|
{
|
||||||
field: 'provider',
|
field: 'errorCode',
|
||||||
label: '告警标题',
|
label: '错误码',
|
||||||
component: 'NsInput',
|
component: 'NsInput',
|
||||||
componentProps: {
|
componentProps: {
|
||||||
placeholder: '请输入告警标题关键字',
|
placeholder: '请输入错误码关键字',
|
||||||
},
|
},
|
||||||
},
|
},
|
||||||
{
|
{
|
||||||
field: 'payWay',
|
field: 'enableRules',
|
||||||
label: '启用状态',
|
label: '启用状态',
|
||||||
component: 'NsSelect',
|
component: 'NsSelect',
|
||||||
componentProps: {
|
componentProps: {
|
||||||
placeholder: '请选择启用状态',
|
placeholder: '请选择启用状态',
|
||||||
options: [
|
options: [
|
||||||
{
|
|
||||||
label: '全部',
|
|
||||||
value: '',
|
|
||||||
},
|
|
||||||
{
|
{
|
||||||
label: '启用',
|
label: '启用',
|
||||||
value: '1',
|
value: 1,
|
||||||
},
|
},
|
||||||
{
|
{
|
||||||
label: '关闭',
|
label: '关闭',
|
||||||
value: '0',
|
value: 0,
|
||||||
},
|
},
|
||||||
],
|
],
|
||||||
},
|
},
|
||||||
|
|||||||
@@ -37,11 +37,11 @@ const tableKeyMap = [
|
|||||||
},
|
},
|
||||||
{
|
{
|
||||||
title: '启用通知',
|
title: '启用通知',
|
||||||
dataIndex: 'isUse',
|
dataIndex: 'enableRules',
|
||||||
},
|
},
|
||||||
];
|
];
|
||||||
const mockData = ref(data.listData);
|
const mockData = ref(data.listData);
|
||||||
export const notificationtableConfig = (el, elGroup, elFormula) => {
|
export const notificationtableConfig = (el) => {
|
||||||
return {
|
return {
|
||||||
title: '告警规则',
|
title: '告警规则',
|
||||||
// api: '/carbon_emission/device/getDeviceList',
|
// api: '/carbon_emission/device/getDeviceList',
|
||||||
@@ -60,15 +60,6 @@ export const notificationtableConfig = (el, elGroup, elFormula) => {
|
|||||||
console.log(data, '联系方式');
|
console.log(data, '联系方式');
|
||||||
},
|
},
|
||||||
},
|
},
|
||||||
// {
|
|
||||||
// label: '删除',
|
|
||||||
// name: 'FeedBackDetail',
|
|
||||||
// dynamicParams: ['uuid', 'appealType'],
|
|
||||||
// confirm: true,
|
|
||||||
// handle: () => {
|
|
||||||
// mockData.value.splice(0, 1);
|
|
||||||
// },
|
|
||||||
// },
|
|
||||||
],
|
],
|
||||||
},
|
},
|
||||||
|
|
||||||
@@ -82,12 +73,16 @@ export const notificationtableConfig = (el, elGroup, elFormula) => {
|
|||||||
placeholder: '请选告警类型',
|
placeholder: '请选告警类型',
|
||||||
options: [
|
options: [
|
||||||
{
|
{
|
||||||
label: '启用',
|
label: '设备告警',
|
||||||
value: '1',
|
value: '1',
|
||||||
},
|
},
|
||||||
{
|
{
|
||||||
label: '关闭',
|
label: '网关告警',
|
||||||
value: '0',
|
value: '2',
|
||||||
|
},
|
||||||
|
{
|
||||||
|
label: '能耗告警',
|
||||||
|
value: '3',
|
||||||
},
|
},
|
||||||
],
|
],
|
||||||
},
|
},
|
||||||
@@ -100,16 +95,16 @@ export const notificationtableConfig = (el, elGroup, elFormula) => {
|
|||||||
placeholder: '请选择告警优先级',
|
placeholder: '请选择告警优先级',
|
||||||
options: [
|
options: [
|
||||||
{
|
{
|
||||||
label: '全部',
|
label: '紧急',
|
||||||
value: '',
|
|
||||||
},
|
|
||||||
{
|
|
||||||
label: '启用',
|
|
||||||
value: '1',
|
value: '1',
|
||||||
},
|
},
|
||||||
{
|
{
|
||||||
label: '关闭',
|
label: '重要',
|
||||||
value: '0',
|
value: '1',
|
||||||
|
},
|
||||||
|
{
|
||||||
|
label: '一般',
|
||||||
|
value: '2',
|
||||||
},
|
},
|
||||||
],
|
],
|
||||||
},
|
},
|
||||||
@@ -124,10 +119,10 @@ export const notificationtableConfig = (el, elGroup, elFormula) => {
|
|||||||
},
|
},
|
||||||
{
|
{
|
||||||
field: 'provider',
|
field: 'provider',
|
||||||
label: '告警标题',
|
label: '错误码',
|
||||||
component: 'NsInput',
|
component: 'NsInput',
|
||||||
componentProps: {
|
componentProps: {
|
||||||
placeholder: '请输入告警标题关键字',
|
placeholder: '请输入告警错误码',
|
||||||
},
|
},
|
||||||
},
|
},
|
||||||
{
|
{
|
||||||
@@ -137,10 +132,6 @@ export const notificationtableConfig = (el, elGroup, elFormula) => {
|
|||||||
componentProps: {
|
componentProps: {
|
||||||
placeholder: '请选择启用状态',
|
placeholder: '请选择启用状态',
|
||||||
options: [
|
options: [
|
||||||
{
|
|
||||||
label: '全部',
|
|
||||||
value: '',
|
|
||||||
},
|
|
||||||
{
|
{
|
||||||
label: '启用',
|
label: '启用',
|
||||||
value: '1',
|
value: '1',
|
||||||
|
|||||||
@@ -5,129 +5,62 @@
|
|||||||
<script lang="ts">
|
<script lang="ts">
|
||||||
import { defineComponent, onMounted, ref, watch } from 'vue';
|
import { defineComponent, onMounted, ref, watch } from 'vue';
|
||||||
import * as echarts from 'echarts';
|
import * as echarts from 'echarts';
|
||||||
|
import { inject } from 'vue';
|
||||||
const data = [
|
|
||||||
{
|
|
||||||
date: '2023-12-01 0:00',
|
|
||||||
unit: 'V',
|
|
||||||
data: [
|
|
||||||
{
|
|
||||||
name: 'AC_002(暖通电表)',
|
|
||||||
value: '21',
|
|
||||||
},
|
|
||||||
{
|
|
||||||
name: 'AC_003(照明电表)',
|
|
||||||
value: '36',
|
|
||||||
},
|
|
||||||
{
|
|
||||||
name: 'AC_004(给排水电表)',
|
|
||||||
value: '5',
|
|
||||||
},
|
|
||||||
],
|
|
||||||
},
|
|
||||||
{
|
|
||||||
date: '2023-12-02 0:00',
|
|
||||||
unit: 'V',
|
|
||||||
data: [
|
|
||||||
{
|
|
||||||
name: 'AC_002(暖通电表)',
|
|
||||||
value: '26',
|
|
||||||
},
|
|
||||||
{
|
|
||||||
name: 'AC_003(照明电表)',
|
|
||||||
value: '25',
|
|
||||||
},
|
|
||||||
{
|
|
||||||
name: 'AC_004(给排水电表)',
|
|
||||||
value: '47',
|
|
||||||
},
|
|
||||||
],
|
|
||||||
},
|
|
||||||
{
|
|
||||||
date: '2023-12-03 0:00',
|
|
||||||
unit: 'V',
|
|
||||||
data: [
|
|
||||||
{
|
|
||||||
name: 'AC_002(暖通电表)',
|
|
||||||
value: '18',
|
|
||||||
},
|
|
||||||
{
|
|
||||||
name: 'AC_003(照明电表)',
|
|
||||||
value: '22',
|
|
||||||
},
|
|
||||||
{
|
|
||||||
name: 'AC_004(给排水电表)',
|
|
||||||
value: '26',
|
|
||||||
},
|
|
||||||
],
|
|
||||||
},
|
|
||||||
{
|
|
||||||
date: '2023-12-04 0:00',
|
|
||||||
unit: 'V',
|
|
||||||
data: [
|
|
||||||
{
|
|
||||||
name: 'AC_002(暖通电表)',
|
|
||||||
value: '40',
|
|
||||||
},
|
|
||||||
{
|
|
||||||
name: 'AC_003(照明电表)',
|
|
||||||
value: '15',
|
|
||||||
},
|
|
||||||
{
|
|
||||||
name: 'AC_004(给排水电表)',
|
|
||||||
value: '12',
|
|
||||||
},
|
|
||||||
],
|
|
||||||
},
|
|
||||||
{
|
|
||||||
date: '2023-12-05 0:00',
|
|
||||||
unit: 'V',
|
|
||||||
data: [
|
|
||||||
{
|
|
||||||
name: 'AC_002(暖通电表)',
|
|
||||||
value: '15',
|
|
||||||
},
|
|
||||||
{
|
|
||||||
name: 'AC_003(照明电表)',
|
|
||||||
value: '18',
|
|
||||||
},
|
|
||||||
{
|
|
||||||
name: 'AC_004(给排水电表)',
|
|
||||||
value: '15',
|
|
||||||
},
|
|
||||||
],
|
|
||||||
},
|
|
||||||
];
|
|
||||||
|
|
||||||
export default defineComponent({
|
export default defineComponent({
|
||||||
// eslint-disable-next-line vue/multi-word-component-names
|
// eslint-disable-next-line vue/multi-word-component-names
|
||||||
name: 'Graph',
|
name: 'Graph',
|
||||||
|
|
||||||
setup() {
|
setup() {
|
||||||
|
let data = ref<any[]>([]);
|
||||||
|
interface PageData {
|
||||||
|
tableList: any[];
|
||||||
|
tableColumns: any[];
|
||||||
|
graphList: any[];
|
||||||
|
}
|
||||||
|
const pageData = inject<PageData>('pageData');
|
||||||
|
|
||||||
|
if (!pageData) {
|
||||||
|
throw new Error('pageData is not provided');
|
||||||
|
}
|
||||||
|
// 监听 pageData 的变化
|
||||||
|
watch(
|
||||||
|
() => pageData as PageData,
|
||||||
|
(_newValue, _oldValue) => {
|
||||||
|
// 执行你的逻辑代码
|
||||||
|
draw();
|
||||||
|
},
|
||||||
|
{ deep: true },
|
||||||
|
);
|
||||||
const graphChart = ref(null);
|
const graphChart = ref(null);
|
||||||
let chartInstance: echarts.ECharts | null = null;
|
let chartInstance: echarts.ECharts | null = null;
|
||||||
|
|
||||||
onMounted(() => {
|
const draw = () => {
|
||||||
|
data.value = pageData.graphList;
|
||||||
|
if (chartInstance) {
|
||||||
|
chartInstance.dispose();
|
||||||
|
}
|
||||||
chartInstance = echarts.init(graphChart.value);
|
chartInstance = echarts.init(graphChart.value);
|
||||||
|
|
||||||
var seriesList = [];
|
var seriesList = [];
|
||||||
var date = [];
|
var date = [];
|
||||||
var legendList: string | any[] = [];
|
var legendList: string | any[] = [];
|
||||||
for (let i = 0; i < data.length; i++) {
|
for (let i = 0; i < data.value.length; i++) {
|
||||||
date.push(data[i].date);
|
date.push(data.value[i].date);
|
||||||
|
|
||||||
for (let j = 0; j < data[i].data.length; j++) {
|
for (let j = 0; j < data.value[i].data.length; j++) {
|
||||||
if (seriesList.length < j + 1) {
|
if (seriesList.length < j + 1) {
|
||||||
seriesList.push({
|
seriesList.push({
|
||||||
name: data[i].data[j].name,
|
name: data.value[i].data[j].name,
|
||||||
data: [data[i].data[j].value],
|
data: [data.value[i].data[j].value],
|
||||||
type: 'line',
|
type: 'line',
|
||||||
smooth: true,
|
smooth: true,
|
||||||
});
|
});
|
||||||
} else {
|
} else {
|
||||||
seriesList[j].data.push(data[i].data[j].value);
|
seriesList[j].data.push(data.value[i].data[j].value);
|
||||||
}
|
}
|
||||||
if (legendList.length == 0 || legendList.length < j + 1) {
|
if (legendList.length == 0 || legendList.length < j + 1) {
|
||||||
legendList.push(data[i].data[j].name);
|
legendList.push(data.value[i].data[j].name);
|
||||||
}
|
}
|
||||||
}
|
}
|
||||||
}
|
}
|
||||||
@@ -143,7 +76,7 @@
|
|||||||
const date = params[0].name;
|
const date = params[0].name;
|
||||||
const values = params
|
const values = params
|
||||||
.map((param: any) => {
|
.map((param: any) => {
|
||||||
const unit = data.find((d) => d.date === date)?.unit || '';
|
const unit = data.value.find((d) => d.date === date)?.unit || '';
|
||||||
return `<tr>
|
return `<tr>
|
||||||
<td>${param.marker}${param.seriesName}</td>
|
<td>${param.marker}${param.seriesName}</td>
|
||||||
<td style="text-align: right;">${param.value} ${unit}</td>
|
<td style="text-align: right;">${param.value} ${unit}</td>
|
||||||
@@ -174,6 +107,9 @@
|
|||||||
|
|
||||||
chartInstance = echarts.init(graphChart.value);
|
chartInstance = echarts.init(graphChart.value);
|
||||||
chartInstance.setOption(option);
|
chartInstance.setOption(option);
|
||||||
|
};
|
||||||
|
onMounted(() => {
|
||||||
|
draw();
|
||||||
});
|
});
|
||||||
// 下载图表
|
// 下载图表
|
||||||
const downloadChart = () => {
|
const downloadChart = () => {
|
||||||
@@ -190,6 +126,7 @@
|
|||||||
};
|
};
|
||||||
|
|
||||||
return {
|
return {
|
||||||
|
draw,
|
||||||
graphChart,
|
graphChart,
|
||||||
downloadChart,
|
downloadChart,
|
||||||
};
|
};
|
||||||
|
|||||||
@@ -1,80 +1,19 @@
|
|||||||
|
<!-- eslint-disable vue/multi-word-component-names -->
|
||||||
<template>
|
<template>
|
||||||
<a-row type="flex">
|
<page />
|
||||||
<a-col :span="4">
|
|
||||||
<div style="padding: 0 20px; width: 100%; height: 100%">
|
|
||||||
<tree ref="treeRef" />
|
|
||||||
</div>
|
|
||||||
</a-col>
|
|
||||||
<a-col :span="20">
|
|
||||||
<div style="width: 100%; height: 100%">
|
|
||||||
<div class="ns-right-title">
|
|
||||||
<span>历史数据</span>
|
|
||||||
<div class="button">
|
|
||||||
<ns-icon name="xiazai" size="18" style="margin-right: 10px" @click="downloadChart" />
|
|
||||||
<ns-icon :name="iconName" size="18" style="margin-right: 10px" @click="change" />
|
|
||||||
</div>
|
|
||||||
</div>
|
|
||||||
<graph ref="graphRef" v-if="isGraph" />
|
|
||||||
<environment-table ref="tableRef" v-else />
|
|
||||||
</div>
|
|
||||||
</a-col>
|
|
||||||
</a-row>
|
|
||||||
</template>
|
</template>
|
||||||
|
|
||||||
<script lang="ts" setup>
|
<script setup>
|
||||||
import { ref } from 'vue';
|
import { reactive, provide } from 'vue';
|
||||||
import tree from './tree/index.vue';
|
import page from './page.vue';
|
||||||
import graph from './graph/index.vue';
|
|
||||||
import environmentTable from './table/index.vue';
|
|
||||||
|
|
||||||
const iconName = ref('biaoge');
|
// 创建一个响应式对象
|
||||||
|
const pageData = reactive({
|
||||||
const treeRef = ref();
|
tableList: [],
|
||||||
const graphRef = ref();
|
tableColumns: [],
|
||||||
const tableRef = ref();
|
graphList: [],
|
||||||
|
|
||||||
let isGraph = ref(true);
|
|
||||||
|
|
||||||
defineOptions({
|
|
||||||
name: 'EnvironmentMonitorIndex', // 与页面路由name一致缓存才可生效
|
|
||||||
});
|
});
|
||||||
|
|
||||||
const downloadChart = () => {
|
// 使用 provide 函数来提供这个响应式对象
|
||||||
if (isGraph.value) {
|
provide('pageData', pageData);
|
||||||
if (graphRef.value) {
|
|
||||||
graphRef.value.downloadChart();
|
|
||||||
}
|
|
||||||
}
|
|
||||||
};
|
|
||||||
|
|
||||||
function change() {
|
|
||||||
isGraph.value = !isGraph.value;
|
|
||||||
if (iconName.value == 'biaoge') {
|
|
||||||
iconName.value = 'bingtu';
|
|
||||||
} else {
|
|
||||||
iconName.value = 'biaoge';
|
|
||||||
}
|
|
||||||
}
|
|
||||||
</script>
|
</script>
|
||||||
|
|
||||||
<style lang="less" scoped>
|
|
||||||
.ns-right-title {
|
|
||||||
display: flex;
|
|
||||||
justify-content: space-between;
|
|
||||||
align-items: center;
|
|
||||||
user-select: text;
|
|
||||||
margin-bottom: 5px;
|
|
||||||
padding-bottom: 10px;
|
|
||||||
padding-top: 10px;
|
|
||||||
border-bottom: 1px solid #e9e9e9;
|
|
||||||
|
|
||||||
> span {
|
|
||||||
padding-left: 10px;
|
|
||||||
line-height: 20px;
|
|
||||||
}
|
|
||||||
}
|
|
||||||
.button {
|
|
||||||
display: inline-block;
|
|
||||||
padding-right: 10px;
|
|
||||||
}
|
|
||||||
</style>
|
|
||||||
|
|||||||
81
hx-ai-intelligent/src/view/monitor/deviceMonitor/page.vue
Normal file
81
hx-ai-intelligent/src/view/monitor/deviceMonitor/page.vue
Normal file
@@ -0,0 +1,81 @@
|
|||||||
|
<!-- eslint-disable vue/multi-word-component-names -->
|
||||||
|
<template>
|
||||||
|
<a-row type="flex">
|
||||||
|
<a-col :span="4">
|
||||||
|
<div style="padding: 0 20px; width: 100%; height: 100%">
|
||||||
|
<tree ref="treeRef" />
|
||||||
|
</div>
|
||||||
|
</a-col>
|
||||||
|
<a-col :span="20">
|
||||||
|
<div style="width: 100%; height: 100%">
|
||||||
|
<div class="ns-right-title">
|
||||||
|
<span>历史数据</span>
|
||||||
|
<div class="button">
|
||||||
|
<ns-icon name="xiazai" size="18" style="margin-right: 10px" @click="downloadChart" />
|
||||||
|
<ns-icon :name="iconName" size="18" style="margin-right: 10px" @click="change" />
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
<graph ref="graphRef" v-if="isGraph" />
|
||||||
|
<environment-table ref="tableRef" v-else />
|
||||||
|
</div>
|
||||||
|
</a-col>
|
||||||
|
</a-row>
|
||||||
|
</template>
|
||||||
|
|
||||||
|
<script lang="ts" setup>
|
||||||
|
import { ref } from 'vue';
|
||||||
|
import tree from './tree/index.vue';
|
||||||
|
import graph from './graph/index.vue';
|
||||||
|
import environmentTable from './table/index.vue';
|
||||||
|
|
||||||
|
const iconName = ref('biaoge');
|
||||||
|
|
||||||
|
const treeRef = ref();
|
||||||
|
const graphRef = ref();
|
||||||
|
const tableRef = ref();
|
||||||
|
|
||||||
|
let isGraph = ref(true);
|
||||||
|
|
||||||
|
defineOptions({
|
||||||
|
name: 'EnvironmentMonitorIndex', // 与页面路由name一致缓存才可生效
|
||||||
|
});
|
||||||
|
|
||||||
|
const downloadChart = () => {
|
||||||
|
if (isGraph.value) {
|
||||||
|
if (graphRef.value) {
|
||||||
|
graphRef.value.downloadChart();
|
||||||
|
}
|
||||||
|
}
|
||||||
|
};
|
||||||
|
|
||||||
|
function change() {
|
||||||
|
isGraph.value = !isGraph.value;
|
||||||
|
if (iconName.value == 'biaoge') {
|
||||||
|
iconName.value = 'bingtu';
|
||||||
|
} else {
|
||||||
|
iconName.value = 'biaoge';
|
||||||
|
}
|
||||||
|
}
|
||||||
|
</script>
|
||||||
|
|
||||||
|
<style lang="less" scoped>
|
||||||
|
.ns-right-title {
|
||||||
|
display: flex;
|
||||||
|
justify-content: space-between;
|
||||||
|
align-items: center;
|
||||||
|
user-select: text;
|
||||||
|
margin-bottom: 5px;
|
||||||
|
padding-bottom: 10px;
|
||||||
|
padding-top: 10px;
|
||||||
|
border-bottom: 1px solid #e9e9e9;
|
||||||
|
|
||||||
|
> span {
|
||||||
|
padding-left: 10px;
|
||||||
|
line-height: 20px;
|
||||||
|
}
|
||||||
|
}
|
||||||
|
.button {
|
||||||
|
display: inline-block;
|
||||||
|
padding-right: 10px;
|
||||||
|
}
|
||||||
|
</style>
|
||||||
@@ -3,56 +3,44 @@
|
|||||||
</template>
|
</template>
|
||||||
|
|
||||||
<script lang="ts">
|
<script lang="ts">
|
||||||
import { defineComponent } from 'vue';
|
import { defineComponent, watch, ref, onMounted } from 'vue';
|
||||||
import type { TableColumnType } from 'ant-design-vue';
|
import type { TableColumnType } from 'ant-design-vue';
|
||||||
|
import { inject } from 'vue';
|
||||||
|
|
||||||
const data = [
|
// let data: any[] = [];
|
||||||
{
|
|
||||||
key: '1',
|
|
||||||
name: 'AC_002(暖通电表)',
|
|
||||||
position: 'A 相电压',
|
|
||||||
unit: 'V',
|
|
||||||
date: '2023-12-01',
|
|
||||||
'1:00': '3626',
|
|
||||||
},
|
|
||||||
{
|
|
||||||
key: '1',
|
|
||||||
name: 'AC_002(暖通电表)',
|
|
||||||
position: 'A 相电压',
|
|
||||||
unit: 'V',
|
|
||||||
date: '2023-12-01',
|
|
||||||
'1:00': '3626',
|
|
||||||
},
|
|
||||||
{
|
|
||||||
key: '2',
|
|
||||||
name: 'AC_003(照明电表)',
|
|
||||||
position: 'A 相电压',
|
|
||||||
unit: 'V',
|
|
||||||
date: '2023-12-01',
|
|
||||||
'1:00': '3626',
|
|
||||||
},
|
|
||||||
{
|
|
||||||
key: '2',
|
|
||||||
name: 'AC_003(照明电表)',
|
|
||||||
position: 'A 相电压',
|
|
||||||
unit: 'V',
|
|
||||||
date: '2023-12-01',
|
|
||||||
'1:00': '3626',
|
|
||||||
},
|
|
||||||
{
|
|
||||||
key: '3',
|
|
||||||
name: 'AC_004(给排水电表)',
|
|
||||||
position: 'A 相电压',
|
|
||||||
unit: 'V',
|
|
||||||
date: '2023-12-01',
|
|
||||||
'1:00': '3626',
|
|
||||||
},
|
|
||||||
];
|
|
||||||
|
|
||||||
export default defineComponent({
|
export default defineComponent({
|
||||||
name: 'EnvironmentTable',
|
name: 'EnvironmentTable',
|
||||||
setup() {
|
setup() {
|
||||||
const getRowSpan = (dataIndex: string, record, data, dependents: string[] = []) => {
|
let data = ref<any[]>([]);
|
||||||
|
let columns = ref<TableColumnType[]>([]);
|
||||||
|
|
||||||
|
interface PageData {
|
||||||
|
tableList: any[];
|
||||||
|
tableColumns: any[];
|
||||||
|
graphList: any[];
|
||||||
|
}
|
||||||
|
const pageData = inject<PageData>('pageData');
|
||||||
|
|
||||||
|
if (!pageData) {
|
||||||
|
throw new Error('pageData is not provided');
|
||||||
|
}
|
||||||
|
// 监听 pageData 的变化
|
||||||
|
watch(
|
||||||
|
() => pageData as PageData,
|
||||||
|
(_newValue, _oldValue) => {
|
||||||
|
data.value = pageData.tableList;
|
||||||
|
|
||||||
|
let columnA: any[] = [...column];
|
||||||
|
columnA.push(...pageData.tableColumns);
|
||||||
|
columns.value = columnA;
|
||||||
|
// pageData.graphList;
|
||||||
|
// 执行你的逻辑代码
|
||||||
|
},
|
||||||
|
{ deep: true },
|
||||||
|
);
|
||||||
|
|
||||||
|
const getRowSpan = (dataIndex: string, record: any, data: any, dependents: string[] = []) => {
|
||||||
let rowSpan = 1;
|
let rowSpan = 1;
|
||||||
for (let i = data.indexOf(record) + 1; i < data.length; i++) {
|
for (let i = data.indexOf(record) + 1; i < data.length; i++) {
|
||||||
let shouldMerge = true;
|
let shouldMerge = true;
|
||||||
@@ -71,116 +59,121 @@ export default defineComponent({
|
|||||||
return rowSpan;
|
return rowSpan;
|
||||||
};
|
};
|
||||||
|
|
||||||
const columns: TableColumnType[] = [
|
const column: TableColumnType[] = [
|
||||||
{
|
{
|
||||||
title: '序号',
|
title: '序号',
|
||||||
dataIndex: 'key',
|
dataIndex: 'key',
|
||||||
customCell: (record, rowIndex) => {
|
customCell: (record, rowIndex) => {
|
||||||
const rowSpan = getRowSpan('name', record, data);
|
if (rowIndex == undefined) {
|
||||||
if (rowIndex != 0 && data[rowIndex-1].key == record.key) {
|
|
||||||
return {
|
return {
|
||||||
rowSpan: 0,
|
rowSpan: 0,
|
||||||
colSpan: 0,
|
colSpan: 0,
|
||||||
|
};
|
||||||
}
|
}
|
||||||
|
const rowSpan = getRowSpan('name', record, data.value);
|
||||||
|
if (rowIndex != 0 && data.value[rowIndex - 1].key == record.key) {
|
||||||
|
return {
|
||||||
|
rowSpan: 0,
|
||||||
|
colSpan: 0,
|
||||||
|
};
|
||||||
}
|
}
|
||||||
return {
|
return {
|
||||||
rowSpan: rowSpan,
|
rowSpan: rowSpan,
|
||||||
};
|
};
|
||||||
|
|
||||||
},
|
},
|
||||||
},
|
},
|
||||||
{
|
{
|
||||||
title: '设备名称',
|
title: '设备名称',
|
||||||
dataIndex: 'name',
|
dataIndex: 'name',
|
||||||
customCell: (record, rowIndex) => {
|
customCell: (record, rowIndex) => {
|
||||||
const rowSpan = getRowSpan('name', record, data);
|
if (rowIndex == undefined) {
|
||||||
if (rowIndex != 0 && data[rowIndex-1].name == record.name) {
|
|
||||||
return {
|
return {
|
||||||
rowSpan: 0,
|
rowSpan: 0,
|
||||||
colSpan: 0,
|
colSpan: 0,
|
||||||
|
};
|
||||||
}
|
}
|
||||||
|
const rowSpan = getRowSpan('name', record, data.value);
|
||||||
|
if (rowIndex != 0 && data.value[rowIndex - 1].name == record.name) {
|
||||||
|
return {
|
||||||
|
rowSpan: 0,
|
||||||
|
colSpan: 0,
|
||||||
|
};
|
||||||
}
|
}
|
||||||
return {
|
return {
|
||||||
rowSpan: rowSpan,
|
rowSpan: rowSpan,
|
||||||
};
|
};
|
||||||
|
|
||||||
// if (rowIndex === data.indexOf(record)) {
|
|
||||||
// return {
|
|
||||||
// rowSpan: rowSpan,
|
|
||||||
// };
|
|
||||||
// }
|
|
||||||
// return {
|
|
||||||
// rowSpan: 0,
|
|
||||||
// colSpan: 0,
|
|
||||||
// };
|
|
||||||
},
|
},
|
||||||
},
|
},
|
||||||
{
|
{
|
||||||
title: '设备点位',
|
title: '设备点位',
|
||||||
dataIndex: 'position',
|
dataIndex: 'position',
|
||||||
customCell: (record, rowIndex) => {
|
customCell: (record, rowIndex) => {
|
||||||
const rowSpan = getRowSpan('position', record, data, ['name']);
|
if (rowIndex == undefined) {
|
||||||
if (rowIndex != 0 && data[rowIndex-1].name == record.name && data[rowIndex-1].position == record.position) {
|
|
||||||
return {
|
return {
|
||||||
rowSpan: 0,
|
rowSpan: 0,
|
||||||
colSpan: 0,
|
colSpan: 0,
|
||||||
|
};
|
||||||
}
|
}
|
||||||
|
const rowSpan = getRowSpan('position', record, data.value, ['name']);
|
||||||
|
if (
|
||||||
|
rowIndex != 0 &&
|
||||||
|
data.value[rowIndex - 1].name == record.name &&
|
||||||
|
data.value[rowIndex - 1].position == record.position
|
||||||
|
) {
|
||||||
|
return {
|
||||||
|
rowSpan: 0,
|
||||||
|
colSpan: 0,
|
||||||
|
};
|
||||||
}
|
}
|
||||||
return {
|
return {
|
||||||
rowSpan: rowSpan,
|
rowSpan: rowSpan,
|
||||||
};
|
};
|
||||||
// if (rowIndex === data.indexOf(record)) {
|
|
||||||
// return {
|
|
||||||
// rowSpan: rowSpan,
|
|
||||||
// };
|
|
||||||
// }
|
|
||||||
// return {
|
|
||||||
// rowSpan: 0,
|
|
||||||
// colSpan: 0,
|
|
||||||
// };
|
|
||||||
},
|
},
|
||||||
},
|
},
|
||||||
{
|
{
|
||||||
title: '计量单位',
|
title: '计量单位',
|
||||||
dataIndex: 'unit',
|
dataIndex: 'unit',
|
||||||
customCell: (record, rowIndex) => {
|
customCell: (record, rowIndex) => {
|
||||||
const rowSpan = getRowSpan('unit', record, data, ['name', 'position']);
|
if (rowIndex == undefined) {
|
||||||
if (rowIndex != 0 && data[rowIndex-1].name == record.name && data[rowIndex-1].position == record.position && data[rowIndex-1].unit == record.unit) {
|
|
||||||
return {
|
return {
|
||||||
rowSpan: 0,
|
rowSpan: 0,
|
||||||
colSpan: 0,
|
colSpan: 0,
|
||||||
|
};
|
||||||
}
|
}
|
||||||
|
const rowSpan = getRowSpan('unit', record, data.value, ['name', 'position']);
|
||||||
|
if (
|
||||||
|
rowIndex != 0 &&
|
||||||
|
data.value[rowIndex - 1].name == record.name &&
|
||||||
|
data.value[rowIndex - 1].position == record.position &&
|
||||||
|
data.value[rowIndex - 1].unit == record.unit
|
||||||
|
) {
|
||||||
|
return {
|
||||||
|
rowSpan: 0,
|
||||||
|
colSpan: 0,
|
||||||
|
};
|
||||||
}
|
}
|
||||||
return {
|
return {
|
||||||
rowSpan: rowSpan,
|
rowSpan: rowSpan,
|
||||||
};
|
};
|
||||||
// if (rowIndex === data.indexOf(record)) {
|
|
||||||
// return {
|
|
||||||
// rowSpan: rowSpan,
|
|
||||||
// };
|
|
||||||
// }
|
|
||||||
// return {
|
|
||||||
// rowSpan: 0,
|
|
||||||
// colSpan: 0,
|
|
||||||
// };
|
|
||||||
},
|
},
|
||||||
},
|
},
|
||||||
{
|
|
||||||
title: '日期',
|
|
||||||
dataIndex: 'date',
|
|
||||||
},
|
|
||||||
{
|
|
||||||
title: '1:00',
|
|
||||||
dataIndex: '1:00',
|
|
||||||
},
|
|
||||||
];
|
];
|
||||||
|
|
||||||
|
onMounted(() => {
|
||||||
|
data.value = pageData.tableList;
|
||||||
|
|
||||||
|
let columnA: any[] = [...column];
|
||||||
|
columnA.push(...pageData.tableColumns);
|
||||||
|
columns.value = columnA;
|
||||||
|
});
|
||||||
return {
|
return {
|
||||||
data,
|
data,
|
||||||
|
column,
|
||||||
columns,
|
columns,
|
||||||
|
pageData,
|
||||||
};
|
};
|
||||||
},
|
},
|
||||||
});
|
});
|
||||||
</script>
|
</script>
|
||||||
|
|
||||||
<style lang="less" scoped></style>
|
<style lang="less" scoped></style>
|
||||||
|
|||||||
@@ -8,7 +8,8 @@
|
|||||||
v-model:value="value"
|
v-model:value="value"
|
||||||
style="width: 100%"
|
style="width: 100%"
|
||||||
:tree-line="treeLine && { showLeafIcon }"
|
:tree-line="treeLine && { showLeafIcon }"
|
||||||
:tree-data="treeData1">
|
:tree-data="treeData1"
|
||||||
|
@change="">
|
||||||
<!-- <template #title="{ value: val, title }">
|
<!-- <template #title="{ value: val, title }">
|
||||||
<b v-if="val === 'parent 1-1'" style="color: #08c">sss</b>
|
<b v-if="val === 'parent 1-1'" style="color: #08c">sss</b>
|
||||||
<template v-else>{{ title }}</template>
|
<template v-else>{{ title }}</template>
|
||||||
@@ -49,17 +50,24 @@
|
|||||||
@calendarChange="onCalendarChange"
|
@calendarChange="onCalendarChange"
|
||||||
style="width: 100%; margin-bottom: 10px"
|
style="width: 100%; margin-bottom: 10px"
|
||||||
:placeholder="['请选择日期', '请选择日期']" />
|
:placeholder="['请选择日期', '请选择日期']" />
|
||||||
<a-button type="primary" style="width: 100%; margin-bottom: 10px" @click="getSelect"
|
<a-button type="primary" style="width: 100%; margin-bottom: 10px" @click="getSelect">
|
||||||
>查询</a-button
|
查询
|
||||||
>
|
</a-button>
|
||||||
|
<a-button type="primary" style="width: 100%; margin-bottom: 10px" @click="getSelect11">
|
||||||
|
模拟不同数据查询
|
||||||
|
</a-button>
|
||||||
</div>
|
</div>
|
||||||
</div>
|
</div>
|
||||||
</template>
|
</template>
|
||||||
|
|
||||||
<script lang="ts">
|
<script lang="ts">
|
||||||
import type { TreeSelectProps, TreeProps, SelectProps } from 'ant-design-vue';
|
import type { TreeSelectProps, TreeProps, SelectProps } from 'ant-design-vue';
|
||||||
import { defineComponent, ref, watch, onMounted } from 'vue';
|
import { defineComponent, ref, onMounted } from 'vue';
|
||||||
import dayjs, { Dayjs } from 'dayjs';
|
import { Dayjs } from 'dayjs';
|
||||||
|
import { inject } from 'vue';
|
||||||
|
import { http } from '/nerv-lib/util';
|
||||||
|
import { device } from '/@/api/deviceManage';
|
||||||
|
// import { device } from '/@/api/deviceManage';
|
||||||
|
|
||||||
const treeData2: TreeProps['treeData'] = [
|
const treeData2: TreeProps['treeData'] = [
|
||||||
{
|
{
|
||||||
@@ -98,6 +106,10 @@
|
|||||||
const showLeafIcon = ref(false);
|
const showLeafIcon = ref(false);
|
||||||
const value = ref<string>();
|
const value = ref<string>();
|
||||||
|
|
||||||
|
const orgId = ref('');
|
||||||
|
const result = JSON.parse(sessionStorage.getItem('ORGID')!);
|
||||||
|
orgId.value = result;
|
||||||
|
|
||||||
const treeData1 = ref<TreeSelectProps['treeData']>([
|
const treeData1 = ref<TreeSelectProps['treeData']>([
|
||||||
{
|
{
|
||||||
title: '3.电梯',
|
title: '3.电梯',
|
||||||
@@ -137,6 +149,18 @@
|
|||||||
},
|
},
|
||||||
]);
|
]);
|
||||||
|
|
||||||
|
http.post(device.queryDeviceTree, { orgId: orgId.value }).then((res) => {
|
||||||
|
treeData1.value = formatTreeData(res.data);
|
||||||
|
});
|
||||||
|
|
||||||
|
const formatTreeData = (data) => {
|
||||||
|
return data.map((item) => ({
|
||||||
|
title: item.code + '.' + item.deviceType,
|
||||||
|
value: item.id,
|
||||||
|
children: item.children ? formatTreeData(item.children) : [],
|
||||||
|
}));
|
||||||
|
};
|
||||||
|
|
||||||
const expandedKeys = ref<string[]>(['0-0-0', '0-0-1']);
|
const expandedKeys = ref<string[]>(['0-0-0', '0-0-1']);
|
||||||
const selectedKeys = ref<string[]>(['0-0-0', '0-0-1']);
|
const selectedKeys = ref<string[]>(['0-0-0', '0-0-1']);
|
||||||
const checkedKeys = ref<string[]>(['0-0-0', '0-0-1']);
|
const checkedKeys = ref<string[]>(['0-0-0', '0-0-1']);
|
||||||
@@ -177,7 +201,290 @@
|
|||||||
];
|
];
|
||||||
};
|
};
|
||||||
|
|
||||||
const getSelect = () => {};
|
interface PageData {
|
||||||
|
tableList: any[];
|
||||||
|
tableColumns: any[];
|
||||||
|
graphList: any[];
|
||||||
|
}
|
||||||
|
const pageData = inject<PageData>('pageData');
|
||||||
|
if (!pageData) {
|
||||||
|
throw new Error('pageData is not provided');
|
||||||
|
}
|
||||||
|
// 查询数据后放入pageData
|
||||||
|
const getSelect = () => {
|
||||||
|
pageData.tableList = [
|
||||||
|
{
|
||||||
|
key: '1',
|
||||||
|
name: 'AC_002(暖通电表)',
|
||||||
|
position: 'A 相电压',
|
||||||
|
unit: 'V',
|
||||||
|
date: '2023-12-01',
|
||||||
|
'1:00': '3626',
|
||||||
|
},
|
||||||
|
{
|
||||||
|
key: '1',
|
||||||
|
name: 'AC_002(暖通电表)',
|
||||||
|
position: 'A 相电压',
|
||||||
|
unit: 'V',
|
||||||
|
date: '2023-12-01',
|
||||||
|
'1:00': '3626',
|
||||||
|
},
|
||||||
|
{
|
||||||
|
key: '2',
|
||||||
|
name: 'AC_003(照明电表)',
|
||||||
|
position: 'A 相电压',
|
||||||
|
unit: 'V',
|
||||||
|
date: '2023-12-01',
|
||||||
|
'1:00': '3626',
|
||||||
|
},
|
||||||
|
{
|
||||||
|
key: '2',
|
||||||
|
name: 'AC_003(照明电表)',
|
||||||
|
position: 'A 相电压',
|
||||||
|
unit: 'V',
|
||||||
|
date: '2023-12-01',
|
||||||
|
'1:00': '3626',
|
||||||
|
},
|
||||||
|
{
|
||||||
|
key: '3',
|
||||||
|
name: 'AC_004(给排水电表)',
|
||||||
|
position: 'A 相电压',
|
||||||
|
unit: 'V',
|
||||||
|
date: '2023-12-01',
|
||||||
|
'1:00': '3626',
|
||||||
|
},
|
||||||
|
];
|
||||||
|
pageData.tableColumns = [
|
||||||
|
{
|
||||||
|
title: '日期',
|
||||||
|
dataIndex: 'date',
|
||||||
|
},
|
||||||
|
{
|
||||||
|
title: '1:00',
|
||||||
|
dataIndex: '1:00',
|
||||||
|
},
|
||||||
|
];
|
||||||
|
pageData.graphList = [
|
||||||
|
{
|
||||||
|
date: '2023-12-01 0:00',
|
||||||
|
unit: 'V',
|
||||||
|
data: [
|
||||||
|
{
|
||||||
|
name: 'AC_002(暖通电表)',
|
||||||
|
value: '21',
|
||||||
|
},
|
||||||
|
{
|
||||||
|
name: 'AC_003(照明电表)',
|
||||||
|
value: '36',
|
||||||
|
},
|
||||||
|
{
|
||||||
|
name: 'AC_004(给排水电表)',
|
||||||
|
value: '5',
|
||||||
|
},
|
||||||
|
],
|
||||||
|
},
|
||||||
|
{
|
||||||
|
date: '2023-12-02 0:00',
|
||||||
|
unit: 'V',
|
||||||
|
data: [
|
||||||
|
{
|
||||||
|
name: 'AC_002(暖通电表)',
|
||||||
|
value: '26',
|
||||||
|
},
|
||||||
|
{
|
||||||
|
name: 'AC_003(照明电表)',
|
||||||
|
value: '25',
|
||||||
|
},
|
||||||
|
{
|
||||||
|
name: 'AC_004(给排水电表)',
|
||||||
|
value: '47',
|
||||||
|
},
|
||||||
|
],
|
||||||
|
},
|
||||||
|
{
|
||||||
|
date: '2023-12-03 0:00',
|
||||||
|
unit: 'V',
|
||||||
|
data: [
|
||||||
|
{
|
||||||
|
name: 'AC_002(暖通电表)',
|
||||||
|
value: '18',
|
||||||
|
},
|
||||||
|
{
|
||||||
|
name: 'AC_003(照明电表)',
|
||||||
|
value: '22',
|
||||||
|
},
|
||||||
|
{
|
||||||
|
name: 'AC_004(给排水电表)',
|
||||||
|
value: '26',
|
||||||
|
},
|
||||||
|
],
|
||||||
|
},
|
||||||
|
{
|
||||||
|
date: '2023-12-04 0:00',
|
||||||
|
unit: 'V',
|
||||||
|
data: [
|
||||||
|
{
|
||||||
|
name: 'AC_002(暖通电表)',
|
||||||
|
value: '40',
|
||||||
|
},
|
||||||
|
{
|
||||||
|
name: 'AC_003(照明电表)',
|
||||||
|
value: '15',
|
||||||
|
},
|
||||||
|
{
|
||||||
|
name: 'AC_004(给排水电表)',
|
||||||
|
value: '12',
|
||||||
|
},
|
||||||
|
],
|
||||||
|
},
|
||||||
|
{
|
||||||
|
date: '2023-12-05 0:00',
|
||||||
|
unit: 'V',
|
||||||
|
data: [
|
||||||
|
{
|
||||||
|
name: 'AC_002(暖通电表)',
|
||||||
|
value: '15',
|
||||||
|
},
|
||||||
|
{
|
||||||
|
name: 'AC_003(照明电表)',
|
||||||
|
value: '18',
|
||||||
|
},
|
||||||
|
{
|
||||||
|
name: 'AC_004(给排水电表)',
|
||||||
|
value: '15',
|
||||||
|
},
|
||||||
|
],
|
||||||
|
},
|
||||||
|
{
|
||||||
|
date: '2023-12-06 0:00',
|
||||||
|
unit: 'V',
|
||||||
|
data: [
|
||||||
|
{
|
||||||
|
name: 'AC_002(暖通电表)',
|
||||||
|
value: '15',
|
||||||
|
},
|
||||||
|
{
|
||||||
|
name: 'AC_003(照明电表)',
|
||||||
|
value: '18',
|
||||||
|
},
|
||||||
|
{
|
||||||
|
name: 'AC_004(给排水电表)',
|
||||||
|
value: '15',
|
||||||
|
},
|
||||||
|
],
|
||||||
|
},
|
||||||
|
];
|
||||||
|
};
|
||||||
|
// 测试查询 模拟不同数据
|
||||||
|
const getSelect11 = () => {
|
||||||
|
pageData.tableList = [
|
||||||
|
{
|
||||||
|
key: '1',
|
||||||
|
name: 'AC_002(暖通电表)',
|
||||||
|
position: 'A 相电压',
|
||||||
|
unit: 'V',
|
||||||
|
date: '2023-12-01',
|
||||||
|
'1:00': '3626',
|
||||||
|
'2:00': '2222',
|
||||||
|
},
|
||||||
|
{
|
||||||
|
key: '1',
|
||||||
|
name: 'AC_002(暖通电表)',
|
||||||
|
position: 'A 相电压',
|
||||||
|
unit: 'V',
|
||||||
|
date: '2023-12-01',
|
||||||
|
'1:00': '3626',
|
||||||
|
'2:00': '2222',
|
||||||
|
},
|
||||||
|
{
|
||||||
|
key: '2',
|
||||||
|
name: 'AC_003(照明电表)',
|
||||||
|
position: 'A 相电压',
|
||||||
|
unit: 'V',
|
||||||
|
date: '2023-12-01',
|
||||||
|
'1:00': '3626',
|
||||||
|
'2:00': '2222',
|
||||||
|
},
|
||||||
|
{
|
||||||
|
key: '2',
|
||||||
|
name: 'AC_003(照明电表)',
|
||||||
|
position: 'A 相电压',
|
||||||
|
unit: 'V',
|
||||||
|
date: '2023-12-01',
|
||||||
|
'1:00': '3626',
|
||||||
|
'2:00': '2222',
|
||||||
|
},
|
||||||
|
{
|
||||||
|
key: '3',
|
||||||
|
name: 'AC_004(给排水电表)',
|
||||||
|
position: 'A 相电压',
|
||||||
|
unit: 'V',
|
||||||
|
date: '2023-12-01',
|
||||||
|
'1:00': '3626',
|
||||||
|
'2:00': '2222',
|
||||||
|
},
|
||||||
|
];
|
||||||
|
pageData.tableColumns = [
|
||||||
|
{
|
||||||
|
title: '日期',
|
||||||
|
dataIndex: 'date',
|
||||||
|
},
|
||||||
|
{
|
||||||
|
title: '1:00',
|
||||||
|
dataIndex: '1:00',
|
||||||
|
},
|
||||||
|
{
|
||||||
|
title: '2:00',
|
||||||
|
dataIndex: '2:00',
|
||||||
|
},
|
||||||
|
];
|
||||||
|
pageData.graphList = [
|
||||||
|
{
|
||||||
|
date: '2023-12-01 0:00',
|
||||||
|
unit: 'V',
|
||||||
|
data: [
|
||||||
|
{
|
||||||
|
name: 'AC_002(暖通电表)',
|
||||||
|
value: '21',
|
||||||
|
},
|
||||||
|
{
|
||||||
|
name: 'AC_003(照明电表)',
|
||||||
|
value: '36',
|
||||||
|
},
|
||||||
|
{
|
||||||
|
name: 'AC_004(给排水电表)',
|
||||||
|
value: '5',
|
||||||
|
},
|
||||||
|
{
|
||||||
|
name: 'AC_005(1111111)',
|
||||||
|
value: '14',
|
||||||
|
},
|
||||||
|
],
|
||||||
|
},
|
||||||
|
{
|
||||||
|
date: '2023-12-02 0:00',
|
||||||
|
unit: 'V',
|
||||||
|
data: [
|
||||||
|
{
|
||||||
|
name: 'AC_002(暖通电表)',
|
||||||
|
value: '26',
|
||||||
|
},
|
||||||
|
{
|
||||||
|
name: 'AC_003(照明电表)',
|
||||||
|
value: '25',
|
||||||
|
},
|
||||||
|
{
|
||||||
|
name: 'AC_004(给排水电表)',
|
||||||
|
value: '47',
|
||||||
|
},
|
||||||
|
{
|
||||||
|
name: 'AC_005(1111111)',
|
||||||
|
value: '28',
|
||||||
|
},
|
||||||
|
],
|
||||||
|
},
|
||||||
|
];
|
||||||
|
};
|
||||||
|
|
||||||
type RangeValue = [Dayjs, Dayjs];
|
type RangeValue = [Dayjs, Dayjs];
|
||||||
const dates = ref<RangeValue>();
|
const dates = ref<RangeValue>();
|
||||||
@@ -210,7 +517,7 @@
|
|||||||
getDianWeiList();
|
getDianWeiList();
|
||||||
});
|
});
|
||||||
|
|
||||||
const dateFormat = 'YYYY-MM-DD';
|
// const dateFormat = 'YYYY-MM-DD';
|
||||||
|
|
||||||
return {
|
return {
|
||||||
treeLine,
|
treeLine,
|
||||||
@@ -228,11 +535,13 @@
|
|||||||
dateRange,
|
dateRange,
|
||||||
getDianWeiList,
|
getDianWeiList,
|
||||||
getSelect,
|
getSelect,
|
||||||
|
getSelect11,
|
||||||
disabledDate,
|
disabledDate,
|
||||||
onCalendarChange,
|
onCalendarChange,
|
||||||
onOpenChange,
|
onOpenChange,
|
||||||
onChange,
|
onChange,
|
||||||
hackValue,
|
hackValue,
|
||||||
|
pageData,
|
||||||
};
|
};
|
||||||
},
|
},
|
||||||
});
|
});
|
||||||
|
|||||||
Reference in New Issue
Block a user