|
|
|
const lineDetail = () => {
|
|
|
|
let showLineDialog = Vue.ref(false);
|
|
|
|
|
|
|
|
let closeLineDialog = (flg) =>{
|
|
|
|
let closeLineDialog = (flg) => {
|
|
|
|
showLineDialog.value = flg;
|
|
|
|
}
|
|
|
|
return {
|
|
...
|
...
|
@@ -9,6 +9,118 @@ const lineDetail = () => { |
|
|
|
closeLineDialog
|
|
|
|
}
|
|
|
|
}
|
|
|
|
|
|
|
|
const colTypes = (props,list) => {
|
|
|
|
/**
|
|
|
|
* KPI数据处理方式
|
|
|
|
* <p>
|
|
|
|
* 作者： Wang
|
|
|
|
* 时间：2021/12/15 16:12
|
|
|
|
*/
|
|
|
|
let dataTypeByKpi = (data) => {
|
|
|
|
let dataList = [];
|
|
|
|
let col = [{
|
|
|
|
prop: 'kpiName',
|
|
|
|
label: props.itemName,
|
|
|
|
width: 120,
|
|
|
|
click: function (row) {
|
|
|
|
closeLineDialog(true);
|
|
|
|
}
|
|
|
|
}];
|
|
|
|
|
|
|
|
let index = 0;
|
|
|
|
for (let resId in data) {
|
|
|
|
let list = data[resId];
|
|
|
|
|
|
|
|
let item = {};
|
|
|
|
item.resId = list[0].resId;
|
|
|
|
item.resName = list[0].resName;
|
|
|
|
item.bizId = list[0].bizId;
|
|
|
|
item.bizName = list[0].bizName;
|
|
|
|
|
|
|
|
list.forEach(function (v) {
|
|
|
|
item[v.kpiId] = v.kpiValue;
|
|
|
|
item.kpiName = v.kpiName;
|
|
|
|
if (index == 0) {
|
|
|
|
col.push({
|
|
|
|
prop: v.kpiId,
|
|
|
|
label: v.kpiName,
|
|
|
|
width: 80
|
|
|
|
})
|
|
|
|
}
|
|
|
|
});
|
|
|
|
dataList.push(item);
|
|
|
|
index++;
|
|
|
|
}
|
|
|
|
// 设置数据
|
|
|
|
list.value.dataList = dataList;
|
|
|
|
list.value.columns = col;
|
|
|
|
}
|
|
|
|
|
|
|
|
/**
|
|
|
|
* KPI数据处理方式
|
|
|
|
* <p>
|
|
|
|
* 作者： Wang
|
|
|
|
* 时间：2021/12/15 16:12
|
|
|
|
*/
|
|
|
|
let dataTypeByFlag = (data) => {
|
|
|
|
let flags = [{
|
|
|
|
prop: "count",
|
|
|
|
label: "检测项目数",
|
|
|
|
}, {
|
|
|
|
prop: "normal",
|
|
|
|
label: "正常数"
|
|
|
|
}, {
|
|
|
|
prop: "abnormal",
|
|
|
|
label: "异常出",
|
|
|
|
}, {
|
|
|
|
prop: "alarm",
|
|
|
|
label: "告警",
|
|
|
|
}];
|
|
|
|
|
|
|
|
let dataList = [];
|
|
|
|
let col = [{
|
|
|
|
prop: 'kpiName',
|
|
|
|
label: props.itemName,
|
|
|
|
width: 100,
|
|
|
|
click: function (row) {
|
|
|
|
closeLineDialog(true);
|
|
|
|
}
|
|
|
|
}];
|
|
|
|
|
|
|
|
flags.forEach(function ({prop, label}) {
|
|
|
|
col.push({
|
|
|
|
prop: prop,
|
|
|
|
label: label,
|
|
|
|
width: 80
|
|
|
|
})
|
|
|
|
})
|
|
|
|
|
|
|
|
let index = 0;
|
|
|
|
for (let resId in data) {
|
|
|
|
let list = data[resId];
|
|
|
|
|
|
|
|
let item = {};
|
|
|
|
item.resId = list[0].resId;
|
|
|
|
item.resName = list[0].resName;
|
|
|
|
item.bizId = list[0].bizId;
|
|
|
|
item.bizName = list[0].bizName;
|
|
|
|
item.kpiName = list[0].kpiName;
|
|
|
|
|
|
|
|
list.forEach(function (v) {
|
|
|
|
item[v.flag] = v.kpiValue;
|
|
|
|
});
|
|
|
|
|
|
|
|
dataList.push(item);
|
|
|
|
index++;
|
|
|
|
}
|
|
|
|
// 设置数据
|
|
|
|
list.value.dataList = dataList;
|
|
|
|
list.value.columns = col;
|
|
|
|
}
|
|
|
|
|
|
|
|
return {dataTypeByKpi, dataTypeByFlag}
|
|
|
|
}
|
|
|
|
export default {
|
|
|
|
name: 'resultItemIndex',
|
|
|
|
template: '',
|
|
...
|
...
|
@@ -21,22 +133,31 @@ export default { |
|
|
|
return {}
|
|
|
|
},
|
|
|
|
props: {
|
|
|
|
faultType:{
|
|
|
|
targeType: {
|
|
|
|
type: String,
|
|
|
|
default: ''
|
|
|
|
},
|
|
|
|
faultNo: {
|
|
|
|
type: String,
|
|
|
|
default:''
|
|
|
|
default: ''
|
|
|
|
},
|
|
|
|
faultNo:{
|
|
|
|
itemName: {
|
|
|
|
type: String,
|
|
|
|
default:''
|
|
|
|
default: ''
|
|
|
|
},
|
|
|
|
// 展示详情页
|
|
|
|
showDetail:{
|
|
|
|
showDetail: {
|
|
|
|
type: String,
|
|
|
|
default:''
|
|
|
|
}
|
|
|
|
default: ''
|
|
|
|
},
|
|
|
|
// 数据转行方式
|
|
|
|
colType: {
|
|
|
|
type: String,
|
|
|
|
default: 'kpi'
|
|
|
|
},
|
|
|
|
},
|
|
|
|
setup(props, {attrs, slots, emit}) {
|
|
|
|
let width = Vue.ref(window.innerWidth*0.8 - 190);
|
|
|
|
let width = Vue.ref(window.innerWidth * 0.8 - 190);
|
|
|
|
const {proxy} = Vue.getCurrentInstance();
|
|
|
|
let list = Vue.ref({
|
|
|
|
columns: [],
|
|
...
|
...
|
@@ -44,48 +165,66 @@ export default { |
|
|
|
total: 0
|
|
|
|
});
|
|
|
|
|
|
|
|
let detailInfo = Vue.ref({
|
|
|
|
rate:0,
|
|
|
|
info:''
|
|
|
|
});
|
|
|
|
|
|
|
|
let getPage = () =>{
|
|
|
|
let data = {};
|
|
|
|
// 数据统计方式
|
|
|
|
const {dataTypeByKpi, dataTypeByFlag} = colTypes(props,list);
|
|
|
|
|
|
|
|
let dataList = [];
|
|
|
|
let col = [{
|
|
|
|
prop: 'resName',
|
|
|
|
label: '检测指标',
|
|
|
|
width: 100,
|
|
|
|
click: function (row) {
|
|
|
|
closeLineDialog(true);
|
|
|
|
}
|
|
|
|
}];
|
|
|
|
|
|
|
|
|
|
|
|
let index = 0;
|
|
|
|
for (let resId in data) {
|
|
|
|
let list = data[resId];
|
|
|
|
|
|
|
|
let item = {};
|
|
|
|
item.resId = list[0].resId;
|
|
|
|
item.resName = list[0].resName;
|
|
|
|
item.bizId = list[0].bizId;
|
|
|
|
item.bizName = list[0].bizName;
|
|
|
|
|
|
|
|
list.forEach(function (v){
|
|
|
|
item[v.kpiId] = v.kpiValue;
|
|
|
|
if(index == 0){
|
|
|
|
col.push({
|
|
|
|
prop: v.kpiId,
|
|
|
|
label: v.kpiName,
|
|
|
|
width: 80
|
|
|
|
})
|
|
|
|
/**
|
|
|
|
* 获取表格数据
|
|
|
|
* <p>
|
|
|
|
* 作者： Wang
|
|
|
|
* 时间：2021/12/15 17:26
|
|
|
|
*/
|
|
|
|
let getPage = () => {
|
|
|
|
let params = {
|
|
|
|
faultNo: props.faultNo,
|
|
|
|
targeType: props.targeType
|
|
|
|
}
|
|
|
|
proxy.$http.get('/api-web/fault/result/findResult', params, function (res) {
|
|
|
|
if (res && res.success) {
|
|
|
|
if(res.map){
|
|
|
|
callback(res.map);
|
|
|
|
}
|
|
|
|
});
|
|
|
|
} else {
|
|
|
|
proxy.$global.showMsg(res.msg,"warning");
|
|
|
|
}
|
|
|
|
});
|
|
|
|
|
|
|
|
dataList.push(item);
|
|
|
|
index ++;
|
|
|
|
}
|
|
|
|
// 设置数据
|
|
|
|
list.value.dataList = dataList;
|
|
|
|
list.value.columns = col;
|
|
|
|
let callback = (data) => {
|
|
|
|
|
|
|
|
switch (props.colType) {
|
|
|
|
case 'kpi':
|
|
|
|
dataTypeByKpi(data);
|
|
|
|
break;
|
|
|
|
case 'flag':
|
|
|
|
dataTypeByFlag(data);
|
|
|
|
break;
|
|
|
|
}
|
|
|
|
}
|
|
|
|
}
|
|
|
|
|
|
|
|
/**
|
|
|
|
* 获取统计信息
|
|
|
|
*/
|
|
|
|
let findCountInfo = () =>{
|
|
|
|
let params = {
|
|
|
|
faultNo: props.faultNo,
|
|
|
|
targeType: props.targeType
|
|
|
|
}
|
|
|
|
proxy.$http.get('/api-web/fault/result/findCountInfo', params, function (res) {
|
|
|
|
if (res && res.success) {
|
|
|
|
if( res.map){
|
|
|
|
detailInfo.value = res.map;
|
|
|
|
}
|
|
|
|
} else {
|
|
|
|
proxy.$global.showMsg(res.msg,"warning");
|
|
|
|
}
|
|
|
|
});
|
|
|
|
}
|
|
|
|
|
|
|
|
const {
|
|
...
|
...
|
@@ -101,11 +240,13 @@ export default { |
|
|
|
// 挂载完
|
|
|
|
Vue.onMounted(() => {
|
|
|
|
getPage();
|
|
|
|
findCountInfo();
|
|
|
|
})
|
|
|
|
|
|
|
|
return {
|
|
|
|
width,
|
|
|
|
list,
|
|
|
|
detailInfo,
|
|
|
|
|
|
|
|
showLineDialog,
|
|
|
|
closeLineDialog
|
...
|
...
|
|
