IOT平台的后端管理前端
You can not select more than 25 topics Topics must start with a letter or number, can include dashes ('-') and can be up to 35 characters long.
 
 
 
 
 

297 lines
9.0 KiB

<template>
<div class="app-container">
<el-form :model="queryParams" ref="queryRef" :inline="true" v-show="showSearch" label-width="120px">
<el-form-item label="中台设备编码" prop="deviceUuid">
<el-input
v-model="queryParams.deviceUuid"
placeholder="请输入中台设备编码"
:disabled="uuidDisabled"
@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 label="参数编码" prop="paramCode">
<el-input
v-model="queryParams.paramCode"
placeholder="请输入参数编码"
clearable
@keyup.enter="handleQuery"
/>
</el-form-item>
<el-form-item label="数据类型" prop="paramType">
<el-select v-model="queryParams.paramType" placeholder="请选择数据类型" clearable>
<el-option
v-for="dict in dc_param_value_type"
:key="dict.value"
:label="dict.label"
:value="dict.value"
/>
</el-select>
</el-form-item>
<el-collapse-transition>
<div v-show="collapseVisible">
<el-form-item label="是否可控" prop="contrlFlag">
<el-select v-model="queryParams.contrlFlag" placeholder="请选择是否可控" clearable>
<el-option
v-for="dict in contrlFlag"
:key="dict.value"
:label="dict.label"
:value="dict.value"
/>
</el-select>
</el-form-item>
</div>
</el-collapse-transition>
<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-button @click="toggleCollapse">{{editName}}</el-button>
</el-form-item>
</el-form>
<el-row :gutter="10" class="mb8">
<right-toolbar v-model:showSearch="showSearch" @queryTable="getList">
</right-toolbar>
</el-row>
<el-table ref="addAlertTable" v-loading="loading" :data="paramsList" @selection-change="handleSelectionChange">
<el-table-column type="selection" width="55" align="center" fixed="left"/>
<el-table-column label="中台设备ID" align="center" prop="deviceUuid" :width="120"/>
<el-table-column label="中台设备" align="center" prop="deviceName" :width="120"/>
<el-table-column label="参数名称" align="center" prop="paramName" :width="120"/>
<el-table-column label="参数编码" align="center" prop="paramCode" :width="120"/>
<el-table-column label="参数模版" align="center" prop="paramModelId" :width="120">
<template #default="scope">
<span>{{ getParamModelName(scope.row.paramModelId) }}</span>
</template>
</el-table-column>
<el-table-column label="分区(字典)" align="center" prop="partion" :width="120">
<template #default="scope">
<dict-tag :options="dc_device_partion" :value="scope.row.partion"/>
</template>
</el-table-column>
<el-table-column label="plc地址" align="center" prop="plcAdr" :width="120"/>
</el-table>
<pagination
class="sundivright10percent"
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-dialog>
</div>
</template>
<style lang="scss" >
@import "@/assets/styles/self-defined.scss";
</style>
<script setup name="paramalert">
import { getParamsAlert, getParamsNoAlert, listAlert, getAlert, delAlert, addAlert, updateAlert } from "@/api/model/alert";
import { listParamclass } from "@/api/model/paramclass";
const { proxy } = getCurrentInstance();
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 paramsList = 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 noAlertTotal = ref(0);
const title = ref("");
const paramClassList = ref([]);
const collapseVisible = ref(false);
const uuidDisabled = ref(false);
const deviceUuid = ref("");
const editName = ref("更多筛选项");
let paramalert = ref(null);
const contrlFlag = ref([
{label: '可控', value: true, elTagType: 'default', elTagClass: null},
{label: '不可控', value: false, elTagType: 'default', elTagClass: null}
]);
const enabled = ref([
{label: '有效', value: true, elTagType: 'default', elTagClass: null},
{label: '无效', value: false, elTagType: 'default', elTagClass: null}
]);
const contrlFlagTable = ref([
{label: '可控', value: 'true', elTagType: 'default', elTagClass: null},
{label: '不可控', value: 'false', elTagType: 'default', elTagClass: null}
]);
const enabledTable = ref([
{label: '有效', value: 'true', elTagType: 'default', elTagClass: null},
{label: '无效', value: 'false', elTagType: 'default', elTagClass: null}
]);
const data = reactive({
form: {
contrlFlag:contrlFlag,
enabled:enabled,
},
queryParams: {
pageNum: 1,
pageSize: 10,
deviceUuid: null,
paramName: null,
paramCode: null,
paramType: null,
contrlFlag: null,
contrlType: null,
enabled: null,
setDefautvalue: null,
setAdjustvalue: null,
validateScope: null,
globalCode: null,
paramModelId: null,
partion: null,
plcAdr: null,
controllab: null
},
rules: {
},
});
const { queryParams, form, rules } = toRefs(data);
/** 查询告警设备参数列表 */
function getList() {
loading.value = true;
if(deviceUuid != null && deviceUuid != undefined && deviceUuid != ""){
queryParams.value.deviceUuid = deviceUuid;
getParamsAlert(queryParams.value).then(response => {
paramsList.value = response.rows;
total.value = response.total;
loading.value = false;
});
}else{
getParamsAlert(queryParams.value).then(response => {
paramsList.value = response.rows;
total.value = response.total;
loading.value = false;
});
}
}
// 表单重置
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,
deviceUuid: null,
paramName: null,
paramCode: null,
paramType: null,
contrlFlag: null,
contrlType: null,
enabled: null,
setDefautvalue: null,
setAdjustvalue: null,
validateScope: null,
globalCode: null,
paramModelId: null,
partion: null,
plcAdr: null,
controllab: null
};
proxy.resetForm("paramsRef");
}
/** 搜索按钮操作 */
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 handleDelete(row) {
const _ids = row.id || ids.value;
proxy.$modal.confirm('是否确认删除设备参数明细编号为"' + _ids + '"的数据项?').then(function() {
return delParams(_ids);
}).then(() => {
getList();
proxy.$modal.msgSuccess("删除成功");
}).catch(() => {});
}
function getParamModel() {
listParamclass({}).then(response => {
paramClassList.value = response.rows;
});
}
function toggleCollapse() {
collapseVisible.value = !collapseVisible.value;
if(collapseVisible.value){
editName.value = "折叠筛选项";
}else{
editName.value = "更多筛选项"
}
}
function getParamModelName(id){
paramClassList.value.forEach(item=>{
if(item.id == id){
return item.getParamModelName;
}
})
}
const getParamsNoAlertData = function getParamsNoAlertList() {
loading.value = true;
if(deviceUuid != null && deviceUuid != undefined && deviceUuid != ""){
queryParams.value.deviceUuid = deviceUuid;
getParamsNoAlert(queryParams.value).then(response => {
paramsList.value = response.rows;
total.value = response.total;
loading.value = false;
});
}else{
getParamsNoAlert(queryParams.value).then(response => {
paramsList.value = response.rows;
total.value = response.total;
loading.value = false;
});
}
}
getParamModel();
</script>