lianmei
/
dc-ui
mirror of https://gitee.com/lmlz_0/dc-ui.git
3
0
Fork 0
Code Issues Projects Releases Wiki Activity
Browse Source

告警配置功能

pull/1/head
ljlong_2630 1 year ago
parent
6f87d3b56d
commit
3c436d6496
8 changed files with 1334 additions and 2 deletions
Whitespace
Show all changes Ignore whitespace when comparing lines Ignore changes in amount of whitespace Ignore changes in whitespace at EOL
Unified View
Diff Options
Show Stats Download Patch File Download Diff File
  1. 9
      src/api/model/alert.js
  2. 53
      src/api/model/method.js
  3. 53
      src/api/model/policy.js
  4. 6
      src/assets/styles/self-defined.scss
  5. 530
      src/views/model/alert/deviceparamalert.vue
  6. 275
      src/views/model/alert/method.vue
  7. 407
      src/views/model/alert/policy.vue
  8. 1
      src/views/model/params/index.vue

9
src/api/model/alert.js
View File

@ -87,3 +87,12 @@ export function getParamsNoAlert(query) {
params: query params: query
}) })
} }
// 查询告警设备信息
export function getDeviceParamsAlertInfo(query) {
return request({
url:'/model/dcBusiAlertDevcie/selectDeviceParamsAlert',
method: 'post',
params: query
})
}

53
src/api/model/method.js
View File

@ -0,0 +1,53 @@
import request from '@/utils/request'
// 查询告警方式列表
export function listMethod(query) {
return request({
url: '/model/dcBusiAlertMethod/list',
method: 'get',
params: query
})
}
// 查询告警方式详细
export function getMethod(id) {
return request({
url: '/model/dcBusiAlertMethod/' + id,
method: 'get'
})
}
// 新增告警方式
export function addMethod(data) {
return request({
url: '/model/dcBusiAlertMethod',
method: 'post',
data: data
})
}
// 修改告警方式
export function updateMethod(data) {
return request({
url: '/model/dcBusiAlertMethod',
method: 'put',
data: data
})
}
// 删除告警方式
export function delMethod(id) {
return request({
url: '/model/dcBusiAlertMethod/' + id,
method: 'delete'
})
}
// 导出告警方式
export function exportMethod(query) {
return request({
url: '/${baseUrl}/export',
method: 'get',
params: query
})
}

53
src/api/model/policy.js
View File

@ -0,0 +1,53 @@
import request from '@/utils/request'
// 查询参数值状态策略列表
export function listPolicy(query) {
return request({
url: '/model/dcBusiAlertParamPolicy/list',
method: 'get',
params: query
})
}
// 查询参数值状态策略详细
export function getPolicy(id) {
return request({
url: '/model/dcBusiAlertParamPolicy/' + id,
method: 'get'
})
}
// 新增参数值状态策略
export function addPolicy(data) {
return request({
url: '/model/dcBusiAlertParamPolicy',
method: 'post',
data: data
})
}
// 修改参数值状态策略
export function updatePolicy(data) {
return request({
url: '/model/dcBusiAlertParamPolicy',
method: 'put',
data: data
})
}
// 删除参数值状态策略
export function delPolicy(id) {
return request({
url: '/model/dcBusiAlertParamPolicy/' + id,
method: 'delete'
})
}
// 导出参数值状态策略
export function exportPolicy(query) {
return request({
url: '/${baseUrl}/export',
method: 'get',
params: query
})
}

6
src/assets/styles/self-defined.scss
View File

@ -142,6 +142,7 @@
.childTextAlignCenter{ .childTextAlignCenter{
display: block!important; display: block!important;
text-align: center!important;
div{ div{
display: block!important; display: block!important;
text-align: center!important; text-align: center!important;
@ -170,3 +171,8 @@
right:10%!important; right:10%!important;
} }
} }
.displayblock{
display: block;
}

530
src/views/model/alert/deviceparamalert.vue
View File

@ -0,0 +1,530 @@
<template>
<div class="app-container">
<el-form :model="queryParams" ref="queryRef" :inline="true" v-show="showSearch" label-width="120px">
<el-form-item label="中台设备ID" prop="deviceUuid">
<el-input
v-model="queryParams.deviceUuid"
placeholder="请输入中台设备ID"
clearable
@keyup.enter="handleQuery"
/>
</el-form-item>
<el-form-item label="设备名称" prop="deviceName">
<el-input
v-model="queryParams.deviceName"
placeholder="请输入设备名称"
clearable
@keyup.enter="handleQuery"
/>
</el-form-item>
<el-form-item label="参数编码" prop="paramCode">
<el-input
v-model="queryParams.paramCode"
placeholder="请输入参数编码"
clearable
@keyup.enter="handleQuery"
/>
</el-form-item>
<el-form-item label="参数名称" prop="paramName">
<el-input
v-model="queryParams.paramName"
placeholder="请输入参数名称"
clearable
@keyup.enter="handleQuery"
/>
</el-form-item>
<el-form-item class="childTextAlignCenter">
<el-button type="primary" icon="Search" @click="handleQuery">搜索</el-button>
<el-button type="info" plain icon="Refresh" @click="resetQuery">重置</el-button>
</el-form-item>
</el-form>
<el-row :gutter="10" class="mb8">
<el-col :span="1.5">
<el-button
type="success"
icon="Plus"
@click="handleAdd"
>新增</el-button>
</el-col>
<!-- <el-col :span="1.5">
<el-button
type="success"
icon="Edit"
@click="handleUpdate"
>修改</el-button>
</el-col> -->
<el-col :span="1.5">
<el-button
type="success"
icon="Delete"
@click="handleDelete"
>删除</el-button>
</el-col>
<el-col :span="1.5">
<el-button
type="warning"
icon="Download"
@click="handleExport"
>导出</el-button>
</el-col>
<right-toolbar v-model:showSearch="showSearch" @queryTable="getList"></right-toolbar>
</el-row>
<el-table v-loading="loading" :data="alertList" @selection-change="handleSelectionChange">
<el-table-column type="selection" width="55" align="center" />
<!-- <el-table-column label="主键" align="center" prop="id" /> -->
<el-table-column label="中台设备ID" align="center" prop="deviceUuid" />
<el-table-column label="设备名称" align="center" prop="deviceName" :width="120"/>
<el-table-column label="通讯来源类型" align="center" prop="deviceSource" :width="120"/>
<el-table-column label="是否可用" align="center" prop="enabledFlag" :width="120">
<template #default="scope">
<dict-tag :options="enabledFlagTable" :value="scope.row.enabledFlag"/>
</template>
</el-table-column>
<el-table-column label="参数编码" align="center" prop="paramCode" />
<el-table-column label="参数名称" align="center" prop="paramName" :width="120"/>
<el-table-column label="操作" align="center" class-name="small-padding fixed-width">
<template #default="scope">
<!-- <el-button
type="text"
icon="Edit"
@click="handleUpdate(scope.row)"
>修改</el-button> -->
<el-button
type="text"
icon="Delete"
@click="handlePolicy(scope.row)"
>维护告警策略</el-button>
<el-button
type="text"
icon="Delete"
@click="handleDelete(scope.row)"
>删除</el-button>
</template>
</el-table-column>
</el-table>
<pagination
v-show="total>0"
:total="total"
v-model:page="queryParams.pageNum"
v-model:limit="queryParams.pageSize"
@pagination="getList"
/>
<!-- 添加或修改设备告警对话框 -->
<el-dialog :title="title" v-model="open" width="500px" append-to-body>
<el-form ref="alertRef" :model="form" :rules="rules" label-width="80px">
<el-row>
<el-col :span="12">
<el-form-item label="中台设备" prop="deviceUuid">
<el-select v-model="form.deviceUuid" placeholder="请选择中台设备" @change="getParamsList" clearable>
<el-option
v-for="item in deviceList"
:key="item.uuid"
:label="item.deviceName"
:value="item.uuid"
/>
</el-select>
</el-form-item>
</el-col>
<el-col :span="12">
<el-form-item label="参数" prop="paramCode">
<el-select v-model="form.paramCode" placeholder="请选择参数" clearable>
<el-option
v-for="item in paramsList"
:key="item.paramCode"
:label="item.paramName"
:value="item.paramCode"
/>
</el-select>
</el-form-item>
</el-col>
</el-row>
</el-form>
<template #footer>
<div class="dialog-footer">
<el-button type="primary" @click="submitForm">确 定</el-button>
<el-button @click="cancel">取 消</el-button>
</div>
</template>
</el-dialog>
<!-- 添加或修改参数值状态策略对话框 -->
<el-dialog :title="titlePolicy" v-model="openPolicy" width="800px" append-to-body>
<el-form ref="policyRef" :model="formPolicy" :rules="rulesPolicy" label-width="120px">
<el-row>
<el-col :span="12">
<el-form-item label="开始值" prop="beginValue">
<el-input v-model="formPolicy.beginValue" placeholder="请输入开始值" />
</el-form-item>
</el-col>
<el-col :span="12">
<el-form-item label="结束值" prop="endValue">
<el-input v-model="formPolicy.endValue" placeholder="请输入结束值" />
</el-form-item>
</el-col>
<el-col :span="12">
<el-form-item label="是否告警" prop="alertFlag">
<el-select v-model="formPolicy.alertFlag" placeholder="请选择是否告警">
<el-option
v-for="item in alertFlag"
:key="item.value"
:label="item.label"
:value="item.value"
/>
</el-select>
</el-form-item>
</el-col>
<!-- <el-col :span="12">
<el-form-item label="策略ID" prop="alertId" hidden>
<el-input v-model="formPolicy.alertId" placeholder="请输入策略ID" />
</el-form-item>
</el-col> -->
<el-col :span="12">
<el-form-item label="状态值" prop="statusValue">
<el-input v-model="formPolicy.statusValue" placeholder="请输入状态值" />
</el-form-item>
</el-col>
<el-col :span="12">
<el-form-item label="状态类型" prop="statusType">
<el-select v-model="formPolicy.statusType" placeholder="请选择状态类型">
<el-option
v-for="item in status"
:key="item.value"
:label="item.label"
:value="item.value"
/>
</el-select>
</el-form-item>
</el-col>
<el-col :span="12">
<el-form-item label="中台设备ID" prop="deviceId">
<el-input v-model="formPolicy.deviceId" placeholder="请输入中台设备ID" />
</el-form-item>
</el-col>
<el-col :span="12">
<el-form-item label="排序" prop="sortId">
<el-input-number v-model="formPolicy.sortId" :min="1" :max="1000" />
</el-form-item>
</el-col>
<el-col :span="12">
<el-form-item label="告警方式ID" prop="methodId">
<el-select v-model="formPolicy.methodId" placeholder="请选择告警方式ID">
<el-option
v-for="item in methodList"
:key="item.id"
:label="item.methodName"
:value="item.id"
/>
</el-select>
</el-form-item>
</el-col>
</el-row>
</el-form>
<template #footer>
<div class="dialog-footer">
<el-button type="primary" @click="submitFormPolicy">确 定</el-button>
<el-button @click="cancelPolicy">取 消</el-button>
</div>
</template>
</el-dialog>
</div>
</template>
<style lang="scss" >
@import "@/assets/styles/self-defined.scss";
</style>
<script setup name="Alert">
import { getDeviceParamsAlertInfo, listAlert, getAlert, delAlert, addAlert, updateAlert } from "@/api/model/alert";
import { listDevice } from "@/api/model/device";
import { listParams } from "@/api/model/params";
import { listMethod } from "@/api/model/method";
import { listPolicy,updatePolicy,addPolicy } from "@/api/model/policy";
const { proxy } = getCurrentInstance();
const router = useRouter();
const alertList = ref([]);
const open = ref(false);
const openPolicy = ref(false);
const loading = ref(true);
const showSearch = ref(true);
const ids = ref([]);
const single = ref(true);
const multiple = ref(true);
const total = ref(0);
const title = ref("");
const deviceList = ref([]);
const paramsList = ref([]);
const methodList = ref([]);
const enabledFlagTable = ref([
{label: '可用', value: 'true', elTagType: 'default', elTagClass: null},
{label: '不可用', value: 'false', elTagType: 'default', elTagClass: null}
]);
const alertFlag = ref([
{label: '告警', value: true, elTagType: 'default', elTagClass: null},
{label: '不告警', value: false, elTagType: 'default', elTagClass: null}
]);
const status = ref([
{label: '状态1', value: 1, elTagType: 'default', elTagClass: null},
{label: '状态2', value: 2, elTagType: 'default', elTagClass: null}
]);
const data = reactive({
form: {},
formPolicy: {},
queryParams: {
pageNum: 1,
pageSize: 10,
deviceUuid: null,
paramCode: null,
note: null
},
queryParamsPolicy:{
pageNum: 1,
pageSize: 10,
beginValue: null,
endValue: null,
alertFlag: null,
alertId: null,
statusValue: null,
statusType: null,
deviceId: null,
sortId: null,
methodId: null
},
rules: {
deviceUuid: [
{ required: true, message: "中台设备UUID不能为空", trigger: "blur" }
],
paramCode: [
{ required: true, message: "参数编码不能为空", trigger: "blur" }
],
},
rulesPolicy: {
deviceUuid: [
{ required: true, message: "中台设备UUID不能为空", trigger: "blur" }
],
paramCode: [
{ required: true, message: "参数编码不能为空", trigger: "blur" }
],
}
});
const { queryParams, form, rules,queryParamsPolicy, formPolicy, rulesPolicy } = toRefs(data);
/** 查询设备告警列表 */
function getList() {
loading.value = true;
getDeviceParamsAlertInfo(queryParams.value).then(response => {
alertList.value = response.rows;
total.value = response.total;
loading.value = false;
});
}
// 取消按钮
function cancel() {
open.value = false;
reset();
}
// 表单重置
function reset() {
form.value = {
id: null,
tentantId: null,
version: null,
createBy: null,
createTime: null,
updateBy: null,
updateTime: null,
deptId: null,
userId: null,
deleteBy: null,
deleteTime: null,
deviceUuid: null,
paramCode: null,
note: null
};
proxy.resetForm("alertRef");
}
// 表单重置
function resetPolicy() {
formPolicy.value = {
tentantId: null,
version: null,
createBy: null,
createTime: null,
updateBy: null,
updateTime: null,
deptId: null,
userId: null,
deleteBy: null,
deleteTime: null,
id: null,
beginValue: null,
endValue: null,
alertFlag: null,
alertId: null,
statusValue: null,
statusType: null,
deviceId: null,
sortId: null,
methodId: null
};
proxy.resetForm("policyRef");
}
/** 搜索按钮操作 */
function handleQuery() {
queryParams.value.pageNum = 1;
getList();
}
/** 重置按钮操作 */
function resetQuery() {
proxy.resetForm("queryRef");
handleQuery();
}
// 多选框选中数据
function handleSelectionChange(selection) {
ids.value = selection.map(item => item.id);
single.value = selection.length != 1;
multiple.value = !selection.length;
}
/** 新增按钮操作 */
function handleAdd() {
reset();
getDeviceList();
open.value = true;
title.value = "添加设备告警";
}
/** 修改按钮操作 */
function handleUpdate(row) {
reset();
const _id = row.id || ids.value
getAlert(_id).then(response => {
form.value = response.data;
open.value = true;
title.value = "修改设备告警";
});
}
/** 维护告警策略 */
function handlePolicy(row) {
resetPolicy();
getMethodList();
queryParamsPolicy.value.alertId = row.id;
listPolicy(queryParamsPolicy.value).then(response => {
if(response.total != 0){
formPolicy.value = response.rows[0];
}else{
formPolicy.value.alertId = row.id;
formPolicy.value.deviceId = row.deviceUuid;
}
openPolicy.value = true;
title.value = "维护告警策略";
});
// router.push({
// path:'policy',
// query:{
// id:row.id,
// deviceUuid:row.deviceUuid,
// paramCode:row.paramCode
// }
// })
}
/** 提交按钮 */
function submitForm() {
proxy.$refs["alertRef"].validate(valid => {
if (valid) {
if (form.value.id != null) {
updateAlert(form.value).then(response => {
proxy.$modal.msgSuccess("修改成功");
open.value = false;
getList();
});
} else {
addAlert(form.value).then(response => {
proxy.$modal.msgSuccess("新增成功");
open.value = false;
getList();
});
}
}
});
}
/** 删除按钮操作 */
function handleDelete(row) {
const _ids = row.id || ids.value;
proxy.$modal.confirm('是否确认删除设备告警编号为"' + _ids + '"的数据项？').then(function() {
return delAlert(_ids);
}).then(() => {
getList();
proxy.$modal.msgSuccess("删除成功");
}).catch(() => {});
}
/** 导出按钮操作 */
function handleExport() {
proxy.download('model/alert/export', {
...queryParams.value
}, `alert_${new Date().getTime()}.xlsx`)
}
function getDeviceList(){
listDevice(queryParams.value).then(response => {
deviceList.value = response.rows;
total.value = response.total;
loading.value = false;
});
}
function getParamsList(deviceUuid){
queryParams.value.deviceUuid = deviceUuid;
listParams(queryParams.value).then(response => {
paramsList.value = response.rows;
total.value = response.total;
loading.value = false;
});
}
function getMethodList(){
listMethod().then(response => {
methodList.value = response.rows;
});
}
function submitFormPolicy() {
proxy.$refs["policyRef"].validate(valid => {
if (valid) {
if (formPolicy.value.id != null) {
updatePolicy(formPolicy.value).then(response => {
proxy.$modal.msgSuccess("修改成功");
open.value = false;
getList();
});
} else {
addPolicy(formPolicy.value).then(response => {
proxy.$modal.msgSuccess("新增成功");
open.value = false;
getList();
});
}
}
});
}
function cancelPolicy() {
openPolicy.value = false;
resetPolicy();
}
getList();
</script>

275
src/views/model/alert/method.vue
View File

@ -0,0 +1,275 @@
<template>
<div class="app-container">
<el-form :model="queryParams" ref="queryRef" :inline="true" v-show="showSearch" label-width="100px">
<el-form-item label="策略名称" prop="methodName">
<el-input
v-model="queryParams.methodName"
placeholder="请输入策略名称"
clearable
@keyup.enter="handleQuery"
/>
</el-form-item>
<el-form-item label="是否有效" prop="flagEnabled">
<el-select v-model="queryParams.flagEnabled" placeholder="请选择是否有效" clearable>
<el-option
v-for="item in flagEnabled"
:key="item.value"
:label="item.label"
:value="item.value"
/>
</el-select>
</el-form-item>
<el-form-item class="childTextAlignCenter">
<el-button type="primary" icon="Search" @click="handleQuery">搜索</el-button>
<el-button type="info" plain icon="Refresh" @click="resetQuery">重置</el-button>
</el-form-item>
</el-form>
<el-row :gutter="10" class="mb8">
<el-col :span="1.5">
<el-button
type="success"
icon="Plus"
@click="handleAdd"
>新增</el-button>
</el-col>
<el-col :span="1.5">
<el-button
type="success"
icon="Edit"
@click="handleUpdate"
>修改</el-button>
</el-col>
<el-col :span="1.5">
<el-button
type="success"
icon="Delete"
@click="handleDelete"
>删除</el-button>
</el-col>
<el-col :span="1.5">
<el-button
type="warning"
icon="Download"
@click="handleExport"
>导出</el-button>
</el-col>
<right-toolbar v-model:showSearch="showSearch" @queryTable="getList"></right-toolbar>
</el-row>
<el-table v-loading="loading" :data="methodList" @selection-change="handleSelectionChange">
<el-table-column type="selection" width="55" align="center" />
<el-table-column label="主键" align="center" prop="id" />
<el-table-column label="策略名称" align="center" prop="methodName" />
<el-table-column label="是否有效" align="center" prop="flagEnabled" />
<el-table-column label="操作" align="center" class-name="small-padding fixed-width">
<template #default="scope">
<el-button
type="text"
icon="Edit"
@click="handleUpdate(scope.row)"
>修改</el-button>
<el-button
type="text"
icon="Delete"
@click="handleDelete(scope.row)"
>删除</el-button>
</template>
</el-table-column>
</el-table>
<pagination
v-show="total>0"
:total="total"
v-model:page="queryParams.pageNum"
v-model:limit="queryParams.pageSize"
@pagination="getList"
/>
<!-- 添加或修改告警方式对话框 -->
<el-dialog :title="title" v-model="open" width="500px" append-to-body>
<el-form ref="methodRef" :model="form" :rules="rules" label-width="80px">
<el-row>
<el-col :span="12">
<el-form-item label="策略名称" prop="methodName">
<el-input v-model="form.methodName" placeholder="请输入策略名称" />
</el-form-item>
</el-col>
<el-col :span="12">
<el-form-item label="是否有效" prop="flagEnabled">
<el-select v-model="form.flagEnabled" placeholder="请选择是否有效">
<el-option
v-for="item in flagEnabled"
:key="item.value"
:label="item.label"
:value="item.value"
/>
</el-select>
</el-form-item>
</el-col>
</el-row>
</el-form>
<template #footer>
<div class="dialog-footer">
<el-button type="primary" @click="submitForm">确 定</el-button>
<el-button @click="cancel">取 消</el-button>
</div>
</template>
</el-dialog>
</div>
</template>
<style lang="scss" >
@import "@/assets/styles/self-defined.scss";
</style>
<script setup name="Method">
import { listMethod, getMethod, delMethod, addMethod, updateMethod } from "@/api/model/method";
const { proxy } = getCurrentInstance();
const methodList = ref([]);
const open = ref(false);
const loading = ref(true);
const showSearch = ref(true);
const ids = ref([]);
const single = ref(true);
const multiple = ref(true);
const total = ref(0);
const title = ref("");
const flagEnabledTable = ref([
{label: '可用', value: 'true', elTagType: 'default', elTagClass: null},
{label: '不可用', value: 'false', elTagType: 'default', elTagClass: null}
]);
const flagEnabled = ref([
{label: '有效', value: true, elTagType: 'default', elTagClass: null},
{label: '无效', value: false, elTagType: 'default', elTagClass: null}
]);
const data = reactive({
form: {},
queryParams: {
pageNum: 1,
pageSize: 10,
methodName: null,
flagEnabled: null
},
rules: {
}
});
const { queryParams, form, rules } = toRefs(data);
/** 查询告警方式列表 */
function getList() {
loading.value = true;
listMethod(queryParams.value).then(response => {
methodList.value = response.rows;
total.value = response.total;
loading.value = false;
});
}
// 取消按钮
function cancel() {
open.value = false;
reset();
}
// 表单重置
function reset() {
form.value = {
tentantId: null,
version: null,
createBy: null,
createTime: null,
updateBy: null,
updateTime: null,
deptId: null,
userId: null,
deleteBy: null,
deleteTime: null,
id: null,
methodName: null,
flagEnabled: null
};
proxy.resetForm("methodRef");
}
/** 搜索按钮操作 */
function handleQuery() {
queryParams.value.pageNum = 1;
getList();
}
/** 重置按钮操作 */
function resetQuery() {
proxy.resetForm("queryRef");
handleQuery();
}
// 多选框选中数据
function handleSelectionChange(selection) {
ids.value = selection.map(item => item.id);
single.value = selection.length != 1;
multiple.value = !selection.length;
}
/** 新增按钮操作 */
function handleAdd() {
reset();
open.value = true;
title.value = "添加告警方式";
}
/** 修改按钮操作 */
function handleUpdate(row) {
reset();
const _id = row.id || ids.value
getMethod(_id).then(response => {
form.value = response.data;
open.value = true;
title.value = "修改告警方式";
});
}
/** 提交按钮 */
function submitForm() {
proxy.$refs["methodRef"].validate(valid => {
if (valid) {
if (form.value.id != null) {
updateMethod(form.value).then(response => {
proxy.$modal.msgSuccess("修改成功");
open.value = false;
getList();
});
} else {
addMethod(form.value).then(response => {
proxy.$modal.msgSuccess("新增成功");
open.value = false;
getList();
});
}
}
});
}
/** 删除按钮操作 */
function handleDelete(row) {
const _ids = row.id || ids.value;
proxy.$modal.confirm('是否确认删除告警方式编号为"' + _ids + '"的数据项？').then(function() {
return delMethod(_ids);
}).then(() => {
getList();
proxy.$modal.msgSuccess("删除成功");
}).catch(() => {});
}
/** 导出按钮操作 */
function handleExport() {
proxy.download('model/method/export', {
...queryParams.value
}, `method_${new Date().getTime()}.xlsx`)
}
getList();
</script>

407
src/views/model/alert/policy.vue
View File

@ -0,0 +1,407 @@
<template>
<div class="app-container">
<el-form :model="queryParams" ref="queryRef" :inline="true" v-show="showSearch" label-width="100px">
<el-form-item label="开始值" prop="beginValue">
<el-input
v-model="queryParams.beginValue"
placeholder="请输入开始值"
clearable
@keyup.enter="handleQuery"
/>
</el-form-item>
<el-form-item label="结束值" prop="endValue">
<el-input
v-model="queryParams.endValue"
placeholder="请输入结束值"
clearable
@keyup.enter="handleQuery"
/>
</el-form-item>
<el-form-item label="是否告警" prop="alertFlag">
<el-select v-model="queryParams.alertFlag" placeholder="请选择是否告警" clearable>
<el-option
v-for="item in alertFlag"
:key="item.value"
:label="item.label"
:value="item.value"
/>
</el-select>
</el-form-item>
<el-form-item label="策略ID" prop="alertId">
<el-input
v-model="queryParams.alertId"
placeholder="请输入策略ID"
clearable
@keyup.enter="handleQuery"
/>
</el-form-item>
<el-form-item label="状态值" prop="statusValue">
<el-input
v-model="queryParams.statusValue"
placeholder="请输入状态值"
clearable
@keyup.enter="handleQuery"
/>
</el-form-item>
<el-form-item label="状态类型" prop="statusType">
<el-select v-model="queryParams.statusType" placeholder="请选择状态类型" clearable>
<el-option label="请选择字典生成" value="" />
</el-select>
</el-form-item>
<el-form-item label="中台设备ID" prop="deviceId">
<el-input
v-model="queryParams.deviceId"
placeholder="请输入中台设备ID"
clearable
@keyup.enter="handleQuery"
/>
</el-form-item>
<el-form-item label="排序" prop="sortId">
<el-input-number v-model="queryParams.sortId" :min="1" :max="1000" />
</el-form-item>
<el-form-item label="告警方式" prop="methodId">
<el-select v-model="queryParams.methodId" placeholder="请选择告警方式ID" clearable>
<el-option
v-for="item in methodList"
:key="item.id"
:label="item.methodName"
:value="item.id"
/>
</el-select>
</el-form-item>
<el-form-item>
<el-button type="primary" icon="Search" @click="handleQuery">搜索</el-button>
<el-button type="info" plain icon="Refresh" @click="resetQuery">重置</el-button>
</el-form-item>
</el-form>
<el-row :gutter="10" class="mb8">
<el-col :span="1.5">
<el-button
type="success"
icon="Plus"
@click="handleAdd"
>新增</el-button>
</el-col>
<el-col :span="1.5">
<el-button
type="success"
icon="Edit"
@click="handleUpdate"
>修改</el-button>
</el-col>
<el-col :span="1.5">
<el-button
type="success"
icon="Delete"
@click="handleDelete"
>删除</el-button>
</el-col>
<el-col :span="1.5">
<el-button
type="warning"
icon="Download"
@click="handleExport"
>导出</el-button>
</el-col>
<right-toolbar v-model:showSearch="showSearch" @queryTable="getList"></right-toolbar>
</el-row>
<el-table v-loading="loading" :data="policyList" @selection-change="handleSelectionChange">
<el-table-column type="selection" width="55" align="center" />
<el-table-column label="主键" align="center" prop="id" />
<el-table-column label="中台设备ID" align="center" prop="deviceUuid" />
<el-table-column label="设备名称" align="center" prop="deviceName" :width="120"/>
<el-table-column label="参数编码" align="center" prop="paramCode" />
<el-table-column label="参数名称" align="center" prop="paramName" :width="120"/>
<el-table-column label="开始值" align="center" prop="beginValue" />
<el-table-column label="结束值" align="center" prop="endValue" />
<el-table-column label="是否告警" align="center" prop="alertFlag" />
<el-table-column label="策略ID" align="center" prop="alertId" />
<el-table-column label="状态值" align="center" prop="statusValue" />
<el-table-column label="状态类型" align="center" prop="statusType" />
<el-table-column label="中台设备ID" align="center" prop="deviceId" />
<el-table-column label="排序" align="center" prop="sortId" />
<el-table-column label="告警方式ID" align="center" prop="methodId" />
<el-table-column label="操作" align="center" class-name="small-padding fixed-width">
<template #default="scope">
<el-button
type="text"
icon="Edit"
@click="handleUpdate(scope.row)"
>修改</el-button>
<el-button
type="text"
icon="Delete"
@click="handleDelete(scope.row)"
>删除</el-button>
</template>
</el-table-column>
</el-table>
<pagination
v-show="total>0"
:total="total"
v-model:page="queryParams.pageNum"
v-model:limit="queryParams.pageSize"
@pagination="getList"
/>
<!-- 添加或修改参数值状态策略对话框 -->
<el-dialog :title="title" v-model="open" width="800px" append-to-body>
<el-form ref="policyRef" :model="form" :rules="rules" label-width="120px">
<el-row>
<el-col :span="12">
<el-form-item label="开始值" prop="beginValue">
<el-input v-model="form.beginValue" placeholder="请输入开始值" />
</el-form-item>
</el-col>
<el-col :span="12">
<el-form-item label="结束值" prop="endValue">
<el-input v-model="form.endValue" placeholder="请输入结束值" />
</el-form-item>
</el-col>
<el-col :span="12">
<el-form-item label="是否告警" prop="alertFlag">
<el-select v-model="form.alertFlag" placeholder="请选择是否告警">
<el-option
v-for="item in alertFlag"
:key="item.value"
:label="item.label"
:value="item.value"
/>
</el-select>
</el-form-item>
</el-col>
<el-col :span="12">
<el-form-item label="策略ID" prop="alertId">
<el-input v-model="form.alertId" placeholder="请输入策略ID" />
</el-form-item>
</el-col>
<el-col :span="12">
<el-form-item label="状态值" prop="statusValue">
<el-input v-model="form.statusValue" placeholder="请输入状态值" />
</el-form-item>
</el-col>
<el-col :span="12">
<el-form-item label="状态类型" prop="statusType">
<el-select v-model="form.statusType" placeholder="请选择状态类型">
<el-option label="请选择字典生成" value="" />
</el-select>
</el-form-item>
</el-col>
<el-col :span="12">
<el-form-item label="中台设备ID" prop="deviceId">
<el-input v-model="form.deviceId" placeholder="请输入中台设备ID" />
</el-form-item>
</el-col>
<el-col :span="12">
<el-form-item label="排序" prop="sortId">
<el-input-number v-model="form.sortId" :min="1" :max="1000" />
</el-form-item>
</el-col>
<el-col :span="12">
<el-form-item label="告警方式ID" prop="methodId">
<el-select v-model="form.methodId" placeholder="请选择告警方式ID">
<el-option
v-for="item in methodList"
:key="item.id"
:label="item.methodName"
:value="item.id"
/>
</el-select>
</el-form-item>
</el-col>
</el-row>
</el-form>
<template #footer>
<div class="dialog-footer">
<el-button type="primary" @click="submitForm">确 定</el-button>
<el-button @click="cancel">取 消</el-button>
</div>
</template>
</el-dialog>
</div>
</template>
<script setup name="Policy">
import { listPolicy, getPolicy, delPolicy, addPolicy, updatePolicy } from "@/api/model/policy";
import { listMethod } from "@/api/model/method";
const { proxy } = getCurrentInstance();
const router = useRouter();
const policyList = ref([]);
const open = ref(false);
const loading = ref(true);
const showSearch = ref(true);
const ids = ref([]);
const single = ref(true);
const multiple = ref(true);
const total = ref(0);
const title = ref("");
const methodList = ref([]);
const deviceUuid = ref("");
const alertFlag = ref([
{label: '告警', value: true, elTagType: 'default', elTagClass: null},
{label: '不告警', value: false, elTagType: 'default', elTagClass: null}
]);
const alertFlagTable = ref([
{label: '告警', value: 'true', elTagType: 'default', elTagClass: null},
{label: '不告警', value: 'false', elTagType: 'default', elTagClass: null}
]);
const data = reactive({
form: {},
queryParams: {
pageNum: 1,
pageSize: 10,
beginValue: null,
endValue: null,
alertFlag: null,
alertId: null,
statusValue: null,
statusType: null,
deviceId: null,
sortId: null,
methodId: null
},
rules: {
}
});
const { queryParams, form, rules } = toRefs(data);
/** 查询参数值状态策略列表 */
function getList() {
loading.value = true;
queryParams.value.deviceId = deviceUuid;
listPolicy(queryParams.value).then(response => {
policyList.value = response.rows;
total.value = response.total;
loading.value = false;
});
}
// 取消按钮
function cancel() {
open.value = false;
reset();
}
// 表单重置
function reset() {
form.value = {
tentantId: null,
version: null,
createBy: null,
createTime: null,
updateBy: null,
updateTime: null,
deptId: null,
userId: null,
deleteBy: null,
deleteTime: null,
id: null,
beginValue: null,
endValue: null,
alertFlag: null,
alertId: null,
statusValue: null,
statusType: null,
deviceId: null,
sortId: null,
methodId: null
};
proxy.resetForm("policyRef");
}
/** 搜索按钮操作 */
function handleQuery() {
queryParams.value.pageNum = 1;
getList();
}
/** 重置按钮操作 */
function resetQuery() {
proxy.resetForm("queryRef");
handleQuery();
}
// 多选框选中数据
function handleSelectionChange(selection) {
ids.value = selection.map(item => item.id);
single.value = selection.length != 1;
multiple.value = !selection.length;
}
/** 新增按钮操作 */
function handleAdd() {
reset();
open.value = true;
title.value = "添加参数值状态策略";
}
/** 修改按钮操作 */
function handleUpdate(row) {
reset();
const _id = row.id || ids.value
getPolicy(_id).then(response => {
form.value = response.data;
open.value = true;
title.value = "修改参数值状态策略";
});
}
/** 提交按钮 */
function submitForm() {
proxy.$refs["policyRef"].validate(valid => {
if (valid) {
if (form.value.id != null) {
updatePolicy(form.value).then(response => {
proxy.$modal.msgSuccess("修改成功");
open.value = false;
getList();
});
} else {
addPolicy(form.value).then(response => {
proxy.$modal.msgSuccess("新增成功");
open.value = false;
getList();
});
}
}
});
}
/** 删除按钮操作 */
function handleDelete(row) {
const _ids = row.id || ids.value;
proxy.$modal.confirm('是否确认删除参数值状态策略编号为"' + _ids + '"的数据项？').then(function() {
return delPolicy(_ids);
}).then(() => {
getList();
proxy.$modal.msgSuccess("删除成功");
}).catch(() => {});
}
/** 导出按钮操作 */
function handleExport() {
proxy.download('model/policy/export', {
...queryParams.value
}, `policy_${new Date().getTime()}.xlsx`)
}
function getMethodList(){
listMethod().then(response => {
methodList.value = response.rows;
});
}
function initializeDeviceUuid(){
deviceUuid.value = router.currentRoute._value.query.deviceUuid;
form.value.alertId = router.currentRoute._value.query.id;
}
initializeDeviceUuid();
getList();
getMethodList();
</script>

1
src/views/model/params/index.vue
View File

@ -348,7 +348,6 @@ import { listParamclass } from "@/api/model/paramclass";
const { proxy } = getCurrentInstance(); const { proxy } = getCurrentInstance();
const router = useRouter(); const router = useRouter();
const { dc_param_uint_type, dc_param_value_type, dc_device_partion } = proxy.useDict('dc_param_uint_type', 'dc_param_value_type', 'dc_device_partion'); const { dc_param_uint_type, dc_param_value_type, dc_device_partion } = proxy.useDict('dc_param_uint_type', 'dc_param_value_type', 'dc_device_partion');
const paramsList = ref([]); const paramsList = ref([]);
const open = ref(false); const open = ref(false);
const loading = ref(true); const loading = ref(true);

Write Preview
Loading…
Cancel
Save