fast(型号，设备，项目): 型号添加数据格式化、实时状态和项目线路适配数据格式化、屏蔽告警配置控制类
This commit is contained in:
fhysy
parent
dd49517339
commit
f23a315e8f
|
|
@ -84,6 +84,7 @@
|
|||
<div class="device-children-center">
|
||||
<e-dynamic-table
|
||||
:border="true"
|
||||
:dataFormatType="filterList"
|
||||
:filterList="[
|
||||
...defaultFilterList,
|
||||
...filterList,
|
||||
|
|
@ -102,10 +103,10 @@
|
|||
@tableSelectionChange="handleTableChange"
|
||||
>
|
||||
<template v-slot:operate="scope" >
|
||||
<div class="children-device-operate">
|
||||
<div class="children-device-operate" >
|
||||
<span
|
||||
:class="
|
||||
scope.row.switch == 0 || scope.row.switch == undefined
|
||||
scope.row.switch != 1
|
||||
? 'span-disable'
|
||||
: ''
|
||||
"
|
||||
|
|
@ -116,7 +117,7 @@
|
|||
</span>
|
||||
|
||||
<span
|
||||
:class="scope.row.switch == 1 ? 'span-disable' : ''"
|
||||
:class="scope.row.switch != 0 ? 'span-disable' : ''"
|
||||
@click="handleSwitchOn(scope.row)"
|
||||
>
|
||||
<i class="iconfont iconhezha"></i>
|
||||
|
|
@ -149,6 +150,7 @@ import {
|
|||
} from "@/api/iot/project_new";
|
||||
import { setSwitchControl,searchDevControl } from "@/api/iot/device";
|
||||
import { webSocketProjectGatewayUrl } from "@/config/env";
|
||||
import moment from "moment";
|
||||
export default {
|
||||
name: "EDeviceChildren",
|
||||
components: {
|
||||
|
|
@ -225,6 +227,37 @@ export default {
|
|||
this.tableLoading = true;
|
||||
this.getProjectModelList();
|
||||
},
|
||||
watch: {
|
||||
tableList: {
|
||||
handler: function(list, oldVal) {
|
||||
// list.forEach(val=>{
|
||||
// // 创建设备定位的点
|
||||
// this.filterList.forEach(item=>{
|
||||
// if(item.dataFormatType){
|
||||
// if(item.dataFormatType == 'ENUM'){
|
||||
// try{
|
||||
// val[item.key] = item.dataFormatObj[val[item.key]]||val[item.key];
|
||||
// }catch(e){
|
||||
// }
|
||||
// }else if(item.dataFormatType == 'TIME'){
|
||||
// if (val[item.key].toString().length === 10) {
|
||||
// // 10 位时间戳
|
||||
// val[item.key] = moment(val[item.key] * 1000).format('YYYY-MM-DD HH:mm:ss');
|
||||
// } else if (val[item.key].toString().length === 13) {
|
||||
// // 13 位时间戳
|
||||
// val[item.key] = moment(val[item.key]).format('YYYY-MM-DD HH:mm:ss');
|
||||
// } else {
|
||||
// val[item.key] = val[item.key];
|
||||
// }
|
||||
// }
|
||||
// }
|
||||
// })
|
||||
// })
|
||||
|
||||
},
|
||||
deep: true
|
||||
}
|
||||
},
|
||||
methods: {
|
||||
handleLinkToHome() {
|
||||
this.$emit("handleLinkToHome");
|
||||
|
|
@ -234,11 +267,23 @@ export default {
|
|||
var resultList = [];
|
||||
if (list && list.length > 0) {
|
||||
list.forEach((v) => {
|
||||
if(v.dataFormat){
|
||||
let dataFormat = JSON.parse(v.dataFormat);
|
||||
v.dataFormatType = dataFormat.type;
|
||||
if(dataFormat.list && dataFormat.type == 'ENUM'){
|
||||
try{
|
||||
v.dataFormatObj = JSON.parse(dataFormat.list.replace(/\\/g, ''));
|
||||
}catch(e){
|
||||
v.dataFormatObj = {};
|
||||
}
|
||||
}
|
||||
}
|
||||
resultList.push({
|
||||
label: v["unitName"] ? `${v["name"]}(${v["unitName"]})` : v["name"],
|
||||
align: "center",
|
||||
prop: v["key"],
|
||||
width: list.length > 5 ? "200px" : "",
|
||||
...v
|
||||
});
|
||||
});
|
||||
}
|
||||
|
|
@ -392,6 +437,26 @@ export default {
|
|||
},
|
||||
// 处理 socket 数据返回 赋值问题
|
||||
handleDeviceInfo(param) {
|
||||
// this.filterList.forEach(item=>{
|
||||
// if(item.dataFormatType){
|
||||
// if(item.dataFormatType == 'ENUM'){
|
||||
// try{
|
||||
// param[item.key] = item.dataFormatObj[param[item.key]]||param[item.key];
|
||||
// }catch(e){
|
||||
// }
|
||||
// }else if(item.dataFormatType == 'TIME'){
|
||||
// if (param[item.key].toString().length === 10) {
|
||||
// // 10 位时间戳
|
||||
// param[item.key] = moment(param[item.key] * 1000).format('YYYY-MM-DD HH:mm:ss');
|
||||
// } else if (param[item.key].toString().length === 13) {
|
||||
// // 13 位时间戳
|
||||
// param[item.key] = moment(param[item.key]).format('YYYY-MM-DD HH:mm:ss');
|
||||
// } else {
|
||||
// param[item.key] = param[item.key];
|
||||
// }
|
||||
// }
|
||||
// }
|
||||
// })
|
||||
if (this.tableList && this.tableList.length > 0) {
|
||||
this.tableList = this.tableList.map((v) => {
|
||||
if (v["deviceKey"] === param["deviceId"] || v["deviceKey"] === param["deviceKey"]) {
|
||||
|
|
@ -421,7 +486,6 @@ export default {
|
|||
this.stompClient.onclose = this.socket_onclose;
|
||||
},
|
||||
socket_message(data) {
|
||||
console.log("socket-message:", data);
|
||||
const messagedata = JSON.parse(data.data);
|
||||
this.handleDeviceInfo(messagedata);
|
||||
this.$forceUpdate();
|
||||
|
|
@ -592,6 +656,7 @@ export default {
|
|||
font-weight: 300;
|
||||
color: #1890ff;
|
||||
align-items: center;
|
||||
cursor: pointer;
|
||||
> i {
|
||||
font-size: 16px;
|
||||
margin-right: 1px;
|
||||
|
|
|
|||
|
|
@ -46,6 +46,20 @@
|
|||
:name="tableItem.slotName"
|
||||
:row="scope.row"
|
||||
></slot>
|
||||
<span
|
||||
v-else-if="tableItem.dataFormatType == 'ENUM'"
|
||||
:title="scope.row[tableItem.prop || '']"
|
||||
class="lay-table-textarea"
|
||||
>
|
||||
{{ tableItem.dataFormatObj[scope.row[tableItem.prop]] || scope.row[tableItem.prop] }}
|
||||
</span>
|
||||
<span
|
||||
v-else-if="tableItem.dataFormatType == 'TIME'"
|
||||
:title="scope.row[tableItem.prop || '']"
|
||||
class="lay-table-textarea"
|
||||
>
|
||||
{{ formatTime(scope.row[tableItem.prop]) || scope.row[tableItem.prop] }}
|
||||
</span>
|
||||
<span
|
||||
v-else
|
||||
:title="scope.row[tableItem.prop || '']"
|
||||
|
|
@ -67,6 +81,8 @@
|
|||
</div>
|
||||
</template>
|
||||
<script>
|
||||
import moment from "moment";
|
||||
|
||||
export default {
|
||||
name: "EDynamicTable",
|
||||
props: {
|
||||
|
|
@ -107,6 +123,12 @@ export default {
|
|||
return [];
|
||||
},
|
||||
},
|
||||
dataFormatType: {
|
||||
type: Array,
|
||||
default: () => {
|
||||
return [];
|
||||
},
|
||||
},
|
||||
isIndex: {
|
||||
type: Boolean,
|
||||
default: false,
|
||||
|
|
@ -146,6 +168,23 @@ export default {
|
|||
},
|
||||
},
|
||||
methods: {
|
||||
formatTime(date){
|
||||
if(date){
|
||||
// 检查时间戳长度
|
||||
if (date.toString().length === 10) {
|
||||
// 10 位时间戳
|
||||
return moment(date * 1000).format('YYYY-MM-DD HH:mm:ss');
|
||||
} else if (date.toString().length === 13) {
|
||||
// 13 位时间戳
|
||||
return moment(date).format('YYYY-MM-DD HH:mm:ss');
|
||||
}else {
|
||||
return date;
|
||||
}
|
||||
}else {
|
||||
return date;
|
||||
}
|
||||
|
||||
},
|
||||
handleQuery2() {
|
||||
this.$emit("handleQuery", this.queryParams);
|
||||
},
|
||||
|
|
|
|||
|
|
@ -613,7 +613,7 @@ export default {
|
|||
flag = false;
|
||||
}
|
||||
})
|
||||
if(flag){
|
||||
if(flag && item.funcType!= 'c'){
|
||||
groupList.push({
|
||||
funcType: item.funcType,
|
||||
funcTypeName: item.funcTypeName,
|
||||
|
|
|
|||
|
|
@ -20,6 +20,19 @@
|
|||
<div class="value-info">
|
||||
<div class="value-wrap">
|
||||
<span
|
||||
v-if="doctItem.dataFormatType =='ENUM'"
|
||||
class="val-span"
|
||||
v-text="doctItem.dataFormatObj[doctItem.lastValue]||doctItem.lastValue"
|
||||
>
|
||||
</span>
|
||||
<span
|
||||
v-else-if="doctItem.dataFormatType =='TIME'"
|
||||
class="val-span"
|
||||
v-text="formatTime(doctItem.lastValue)"
|
||||
>
|
||||
</span>
|
||||
<span
|
||||
v-else
|
||||
class="val-span"
|
||||
v-text="
|
||||
doctItem.lastValue === null || doctItem.lastValue === undefined
|
||||
|
|
@ -69,6 +82,7 @@
|
|||
import { getDeviceFunList, getDeviceCmdList } from "@/api/iot/device";
|
||||
import { iotWebSocketBaseUrl } from "@/config/env";
|
||||
import RunStateTable from "./table";
|
||||
import moment from 'moment';
|
||||
export default {
|
||||
name: "RunStartsWrap",
|
||||
props: ["prodId", "sourceId", "deviceInfo", "wsUrl", "realTimeData"],
|
||||
|
|
@ -92,6 +106,18 @@ export default {
|
|||
// this.connection();
|
||||
},
|
||||
methods: {
|
||||
formatTime(date){
|
||||
// 检查时间戳长度
|
||||
if (date.toString().length === 10) {
|
||||
// 10 位时间戳
|
||||
return moment(date * 1000).format('YYYY-MM-DD HH:mm:ss');
|
||||
} else if (date.toString().length === 13) {
|
||||
// 13 位时间戳
|
||||
return moment(date).format('YYYY-MM-DD HH:mm:ss');
|
||||
} else {
|
||||
return date;
|
||||
}
|
||||
},
|
||||
// 查看数据
|
||||
handleShowData(row) {
|
||||
row.chartDate = new Date();
|
||||
|
|
@ -185,7 +211,27 @@ export default {
|
|||
deviceKey: this.deviceInfo.deviceKey
|
||||
};
|
||||
getDeviceFunList(param).then(res => {
|
||||
row["children"] = res.data.filter(item => item.show === true) || [];
|
||||
// row["children"] = res.data.filter(item => item.show === true) || [];
|
||||
if(res.data.length > 0){
|
||||
let list = res.data.filter(item => item.show == true) || [];
|
||||
row["children"] = list.map(item => {
|
||||
if(item.dataFormat){
|
||||
let dataFormat = JSON.parse(item.dataFormat);
|
||||
item.dataFormatType = dataFormat.type;
|
||||
if(dataFormat.list && dataFormat.type == 'ENUM'){
|
||||
try{
|
||||
item.dataFormatObj = JSON.parse(dataFormat.list.replace(/\\/g, ''));
|
||||
}catch(e){
|
||||
item.dataFormatObj = {};
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
return item;
|
||||
});
|
||||
}else{
|
||||
row["children"] = [];
|
||||
}
|
||||
this.$forceUpdate();
|
||||
});
|
||||
},
|
||||
|
|
|
|||
|
|
@ -50,6 +50,7 @@
|
|||
<el-input
|
||||
v-model="form.funValAcc"
|
||||
onkeyup="value=value.replace(/[^\d]/g,'')"
|
||||
type="number"
|
||||
@input="inputChange"
|
||||
></el-input>
|
||||
</el-form-item>
|
||||
|
|
@ -76,15 +77,44 @@
|
|||
<el-switch v-model="form.show" @change="inputChange"/>
|
||||
</el-form-item>
|
||||
|
||||
<div class="item-title-wrap">数据校验</div>
|
||||
<div class="custom-wrap">
|
||||
<div class="item-title-wrap">数据格式化</div>
|
||||
|
||||
<el-form-item label="类型:" prop="dataFormat">
|
||||
<el-select v-model="form.dataFormat.type" placeholder="请选择格式化类型" @change="dataFormatTypeChange">
|
||||
<el-option
|
||||
v-for="(dice, value) in dataFormatTypeOption"
|
||||
:key="value"
|
||||
:label="dice"
|
||||
:value="value"
|
||||
/>
|
||||
</el-select>
|
||||
</el-form-item>
|
||||
<div v-if="form.dataFormat.type === 'ENUM'" class="enum-box">
|
||||
<el-button
|
||||
v-if="form.funValidType === 'ENUM'"
|
||||
:style="`position: absolute; top: ${ form.funDataType === 'FLOAT' ? '585px ' : '530px' }; left: 40px`"
|
||||
size="mini"
|
||||
@click="addJsonObj"
|
||||
>添加数值</el-button
|
||||
>
|
||||
type="primary"
|
||||
@click="addEnumJsonObj"
|
||||
>添加数值</el-button>
|
||||
<div class="enumTypeDiv">
|
||||
<div class="enum-item">
|
||||
<json-editor
|
||||
ref="enumJsonEditors"
|
||||
:jsonString="form.dataFormat.list"
|
||||
@event="enumJsonEvent"
|
||||
/>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
|
||||
<div class="item-title-wrap">数据校验 <el-button
|
||||
v-if="form.funValidType === 'ENUM'"
|
||||
size="mini"
|
||||
@click="addJsonObj"
|
||||
>添加数值</el-button
|
||||
></div>
|
||||
<div class="custom-wrap">
|
||||
|
||||
<el-form-item
|
||||
:style="form.funValidType === 'ENUM' ? 'height: 80px;' : ''"
|
||||
label="校验方式:"
|
||||
|
|
@ -177,6 +207,12 @@ const funValidTypeOption = {
|
|||
NOT: "不校验",
|
||||
};
|
||||
|
||||
const dataFormatTypeOption = {
|
||||
null: "无",
|
||||
ENUM: "枚举",
|
||||
TIME: "时间戳格式化为yyyy-mm-dd hh:MM:ss",
|
||||
};
|
||||
|
||||
export default {
|
||||
name: "AttributeForm",
|
||||
components: { JsonEditor },
|
||||
|
|
@ -202,7 +238,15 @@ export default {
|
|||
funDataTypeOption,
|
||||
funRwTypeOption,
|
||||
funValidTypeOption,
|
||||
form: {show: true,sort: 100},
|
||||
dataFormatTypeOption,
|
||||
form: {
|
||||
show: true,
|
||||
sort: 100,
|
||||
dataFormat: {
|
||||
type: null,
|
||||
list: ""
|
||||
}
|
||||
},
|
||||
// 表单校验
|
||||
rules: {
|
||||
funName: [
|
||||
|
|
@ -248,7 +292,10 @@ export default {
|
|||
getParamIten(idx) {
|
||||
this.$store.dispatch("GetAttributeItem", idx).then((res) => {
|
||||
console.log("GetAttributeItem",res,idx);
|
||||
this.form = {show: true, sort: 100, ...JSON.parse(JSON.stringify(res))};
|
||||
this.form = {show: true, sort: 100,dataFormat: {
|
||||
type: null,
|
||||
list: {}
|
||||
}, ...JSON.parse(JSON.stringify(res))};
|
||||
});
|
||||
},
|
||||
/** 提交验证 */
|
||||
|
|
@ -280,6 +327,12 @@ export default {
|
|||
jsonEvent(data) {
|
||||
this.form.funObj = data;
|
||||
},
|
||||
addEnumJsonObj() {
|
||||
this.$refs["enumJsonEditors"].addHandel();
|
||||
},
|
||||
enumJsonEvent(data) {
|
||||
this.form.dataFormat.list = data;
|
||||
},
|
||||
// 校验方式发生变化的方法
|
||||
funValidTypeChange(val) {
|
||||
this.form.funValidType = val;
|
||||
|
|
@ -291,6 +344,14 @@ export default {
|
|||
}
|
||||
this.$forceUpdate()
|
||||
},
|
||||
dataFormatTypeChange(val) {
|
||||
this.form.dataFormat.type = val;
|
||||
this.form.dataFormat.list = '';
|
||||
if (val === "ENUM") {
|
||||
this.form.dataFormat.list = '{"0":""}';
|
||||
}
|
||||
this.$forceUpdate()
|
||||
},
|
||||
},
|
||||
};
|
||||
</script>
|
||||
|
|
@ -304,6 +365,7 @@ export default {
|
|||
.custom-wrap {
|
||||
border: 1px solid #d8d7d7;
|
||||
padding-top: 20px;
|
||||
margin-top: 10px;
|
||||
background: #f0f0f0;
|
||||
padding-right: 10px;
|
||||
.el-form-item {
|
||||
|
|
@ -343,6 +405,15 @@ export default {
|
|||
margin-left: 0px !important;
|
||||
}
|
||||
}
|
||||
|
||||
}
|
||||
.enum-box{
|
||||
border: 1px solid #d8d7d7;
|
||||
padding: 10px;
|
||||
margin-bottom: 10px;
|
||||
.enumTypeDiv{
|
||||
margin-top: 10px;
|
||||
}
|
||||
}
|
||||
.el-select {
|
||||
width: 100%;
|
||||
|
|
|
|||
Loading…
Reference in New Issue