|
@@ -9,7 +9,7 @@
|
|
|
<template>
|
|
|
<div class="all-page">
|
|
|
<div class="left">
|
|
|
- <!-- {{machineImgParamsRef}} -->
|
|
|
+ <!-- {{machineImgParamsRef}} -->
|
|
|
<div class="left-top">
|
|
|
<s-title titleText="系统数据监测"></s-title>
|
|
|
<div class="machine-all">
|
|
@@ -22,7 +22,9 @@
|
|
|
<!-- 添加注释和标签 -->
|
|
|
<div class="annotation" style="top: 25%; left: 10%">左DE活塞</div>
|
|
|
<div class="annotation" style="top: 24%; left: 24%">左DE燃油齿条</div>
|
|
|
- <div class="annotation" style="top: 15.5%; left: 35.5%">左DE冷却水</div>
|
|
|
+ <div class="annotation" style="top: 15.5%; left: 35.5%">
|
|
|
+ 左DE冷却水
|
|
|
+ </div>
|
|
|
<div class="annotation" style="top: 24%; left: 38%">左DE箱装体</div>
|
|
|
<div class="annotation" style="top: 19%; left: 44%">左DE燃油齿条</div>
|
|
|
<div class="annotation" style="top: 14%; left: 54.5%">右齿轮箱</div>
|
|
@@ -41,20 +43,32 @@
|
|
|
<div class="annotation" style="bottom: 12%; left: 25%">
|
|
|
右DE箱装体冷却风机
|
|
|
</div>
|
|
|
- <div class="annotation" style="bottom: 14%; left: 42.5%">右DE滑油</div>
|
|
|
+ <div class="annotation" style="bottom: 14%; left: 42.5%">
|
|
|
+ 右DE滑油
|
|
|
+ </div>
|
|
|
<!-- 带有小边框的注释 -->
|
|
|
<div class="annotation bordered-box" style="top: 12%; left: 0.5%">
|
|
|
<div>
|
|
|
<div>压力A排</div>
|
|
|
-
|
|
|
+
|
|
|
<div class="value">
|
|
|
- {{formatPressure( machineImgParamsRef?.left_de_cooling_water_pressure_a) }} Mpa
|
|
|
+ {{
|
|
|
+ formatPressure(
|
|
|
+ machineImgParamsRef?.left_de_cooling_water_pressure_a
|
|
|
+ )
|
|
|
+ }}
|
|
|
+ Mpa
|
|
|
</div>
|
|
|
</div>
|
|
|
<div>
|
|
|
<div>压力B排</div>
|
|
|
<div class="value">
|
|
|
- {{ formatPressure(machineImgParamsRef?.left_de_cooling_water_pressure_b ) }} Mpa
|
|
|
+ {{
|
|
|
+ formatPressure(
|
|
|
+ machineImgParamsRef?.left_de_cooling_water_pressure_b
|
|
|
+ )
|
|
|
+ }}
|
|
|
+ Mpa
|
|
|
</div>
|
|
|
</div>
|
|
|
</div>
|
|
@@ -62,22 +76,37 @@
|
|
|
<div>
|
|
|
<div>海水压力</div>
|
|
|
<div class="value">
|
|
|
- {{formatPressure( machineImgParamsRef?.right_gearbox_seawater_pressure ) }} Mpa
|
|
|
+ {{
|
|
|
+ formatPressure(
|
|
|
+ machineImgParamsRef?.right_gearbox_seawater_pressure
|
|
|
+ )
|
|
|
+ }}
|
|
|
+ Mpa
|
|
|
</div>
|
|
|
</div>
|
|
|
<div>
|
|
|
<div>海水温度</div>
|
|
|
<div class="value">
|
|
|
- {{ formatPressure(machineImgParamsRef?.right_gearbox_seawater_temp) }} °C
|
|
|
+ {{
|
|
|
+ formatPressure(
|
|
|
+ machineImgParamsRef?.right_gearbox_seawater_temp
|
|
|
+ )
|
|
|
+ }}
|
|
|
+ °C
|
|
|
</div>
|
|
|
</div>
|
|
|
</div>
|
|
|
- <div class="annotation bordered-box" style="bottom: 13.5%; left: -4.2%">
|
|
|
+ <div
|
|
|
+ class="annotation bordered-box"
|
|
|
+ style="bottom: 13.5%; left: -4.2%"
|
|
|
+ >
|
|
|
<div>
|
|
|
<div>后气压PP030</div>
|
|
|
<div class="value">
|
|
|
{{
|
|
|
- formatPressure(machineImgParamsRef?.right_gt_high_pressure_compressor_air_pressure_pp030)
|
|
|
+ formatPressure(
|
|
|
+ machineImgParamsRef?.right_gt_high_pressure_compressor_air_pressure_pp030
|
|
|
+ )
|
|
|
}}
|
|
|
Mpa
|
|
|
</div>
|
|
@@ -86,7 +115,9 @@
|
|
|
<div>后气压PP040</div>
|
|
|
<div class="value">
|
|
|
{{
|
|
|
- formatPressure( machineImgParamsRef?.right_gt_high_pressure_compressor_air_pressure_pp040)
|
|
|
+ formatPressure(
|
|
|
+ machineImgParamsRef?.right_gt_high_pressure_compressor_air_pressure_pp040
|
|
|
+ )
|
|
|
}}
|
|
|
Mpa
|
|
|
</div>
|
|
@@ -97,13 +128,19 @@
|
|
|
<div>
|
|
|
<div>压力(1)</div>
|
|
|
<div class="value">
|
|
|
- {{ formatPressure(machineImgParamsRef?.right_de_oil_pressure_1) }} Mpa
|
|
|
+ {{
|
|
|
+ formatPressure(machineImgParamsRef?.right_de_oil_pressure_1)
|
|
|
+ }}
|
|
|
+ Mpa
|
|
|
</div>
|
|
|
</div>
|
|
|
<div>
|
|
|
<div>压力(2)</div>
|
|
|
<div class="value">
|
|
|
- {{ formatPressure(machineImgParamsRef?.right_de_oil_pressure_2) }} Mpa
|
|
|
+ {{
|
|
|
+ formatPressure(machineImgParamsRef?.right_de_oil_pressure_2)
|
|
|
+ }}
|
|
|
+ Mpa
|
|
|
</div>
|
|
|
</div>
|
|
|
</div>
|
|
@@ -111,13 +148,23 @@
|
|
|
<div>
|
|
|
<div>压力A排</div>
|
|
|
<div class="value">
|
|
|
- {{ formatPressure(machineImgParamsRef?.right_de_boost_air_pressure_a) }} Mpa
|
|
|
+ {{
|
|
|
+ formatPressure(
|
|
|
+ machineImgParamsRef?.right_de_boost_air_pressure_a
|
|
|
+ )
|
|
|
+ }}
|
|
|
+ Mpa
|
|
|
</div>
|
|
|
</div>
|
|
|
<div>
|
|
|
<div>压力B排</div>
|
|
|
<div class="value">
|
|
|
- {{ formatPressure(machineImgParamsRef?.right_de_boost_air_pressure_b) }} Mpa
|
|
|
+ {{
|
|
|
+ formatPressure(
|
|
|
+ machineImgParamsRef?.right_de_boost_air_pressure_b
|
|
|
+ )
|
|
|
+ }}
|
|
|
+ Mpa
|
|
|
</div>
|
|
|
</div>
|
|
|
</div>
|
|
@@ -140,11 +187,11 @@
|
|
|
<div class="right">
|
|
|
<div class="right-top">
|
|
|
<s-title :type="2" titleText="运行工况分析"></s-title>
|
|
|
- <div class="run-status fullClass" >
|
|
|
- <div class="run-status-body">
|
|
|
- <div class="status-text">运行状态</div>
|
|
|
- <img src="@/assets/img/4.png" alt="" srcset="" />
|
|
|
- </div>
|
|
|
+ <div class="run-status fullClass">
|
|
|
+ <div class="run-status-body">
|
|
|
+ <div class="status-text">运行状态</div>
|
|
|
+ <img src="@/assets/img/4.png" alt="" srcset="" />
|
|
|
+ </div>
|
|
|
<div :class="['status-result', 'status-result' + runStatusColor]">
|
|
|
{{ runStatusText }}
|
|
|
</div>
|
|
@@ -218,16 +265,18 @@
|
|
|
style="width: 600px"
|
|
|
class="custom-table blackTable"
|
|
|
>
|
|
|
- <el-table-column width="200" property="deviation_value" label="偏离值" />
|
|
|
+ <el-table-column
|
|
|
+ width="200"
|
|
|
+ property="deviation_value"
|
|
|
+ label="偏离值"
|
|
|
+ />
|
|
|
<el-table-column
|
|
|
width="200"
|
|
|
property="deviation_percentage"
|
|
|
- label="偏离百分比">
|
|
|
- <template #default="scope">
|
|
|
-
|
|
|
- <div >
|
|
|
- {{ scope.row.deviation_percentage }}%
|
|
|
- </div>
|
|
|
+ label="偏离百分比"
|
|
|
+ >
|
|
|
+ <template #default="scope">
|
|
|
+ <div>{{ scope.row.deviation_percentage }}%</div>
|
|
|
</template>
|
|
|
</el-table-column>
|
|
|
<el-table-column
|
|
@@ -236,12 +285,12 @@
|
|
|
label="健康程度"
|
|
|
>
|
|
|
<template #default="scope">
|
|
|
- <el-button
|
|
|
- link
|
|
|
- type="primary"
|
|
|
- size="small"
|
|
|
- >
|
|
|
- <div :style="{ color: healthColor(scope.row.health_status) }">
|
|
|
+ <el-button link type="primary" size="small">
|
|
|
+ <div
|
|
|
+ :style="{
|
|
|
+ color: healthColor(scope.row.health_status),
|
|
|
+ }"
|
|
|
+ >
|
|
|
{{ scope.row.health_status }}
|
|
|
</div>
|
|
|
</el-button>
|
|
@@ -251,8 +300,14 @@
|
|
|
</el-popover>
|
|
|
</div>
|
|
|
<img src="@/assets/img/4.png" alt="" srcset="" />
|
|
|
- <div :class="['health-result','health-result-'+healthyStatusText.color]" @click="getTip()">
|
|
|
- {{healthyStatusText.name}}
|
|
|
+ <div
|
|
|
+ :class="[
|
|
|
+ 'health-result',
|
|
|
+ 'health-result-' + healthyStatusText.color,
|
|
|
+ ]"
|
|
|
+ @click="getTip()"
|
|
|
+ >
|
|
|
+ {{ healthyStatusText.name }}
|
|
|
</div>
|
|
|
</div>
|
|
|
<div class="status-btn" @click="goResult">记录评估结果</div>
|
|
@@ -330,20 +385,27 @@
|
|
|
>
|
|
|
<!-- 模态框内容插槽 -->
|
|
|
<div class="custom-warn-box">
|
|
|
- <div
|
|
|
- :key="item.id"
|
|
|
- :class="[
|
|
|
- 'warn-list',
|
|
|
- item.type == 3||item.type == 1
|
|
|
- ? 'warn-list-d-bac'
|
|
|
- : item.type == 2
|
|
|
- ? 'warn-list-w-bac'
|
|
|
- : '',
|
|
|
- ]"
|
|
|
+ <el-tooltip
|
|
|
v-for="item in warnList"
|
|
|
+ :key="item.id"
|
|
|
+ class="item"
|
|
|
+ effect="dark"
|
|
|
+ :content="tag"
|
|
|
+ placement="top"
|
|
|
>
|
|
|
- {{ item.text }}
|
|
|
- </div>
|
|
|
+ <div
|
|
|
+ :class="[
|
|
|
+ 'warn-list',
|
|
|
+ item.type == 3 || item.type == 1
|
|
|
+ ? 'warn-list-d-bac'
|
|
|
+ : item.type == 2
|
|
|
+ ? 'warn-list-w-bac'
|
|
|
+ : '',
|
|
|
+ ]"
|
|
|
+ >
|
|
|
+ {{ item.text }}
|
|
|
+ </div>
|
|
|
+ </el-tooltip>
|
|
|
</div>
|
|
|
</ModalComponent>
|
|
|
</template>
|
|
@@ -359,7 +421,8 @@ import {
|
|
|
nextTick,
|
|
|
computed,
|
|
|
watch,
|
|
|
- Ref,getCurrentInstance
|
|
|
+ Ref,
|
|
|
+ getCurrentInstance,
|
|
|
} from "vue";
|
|
|
import { useRoute, useRouter } from "vue-router";
|
|
|
import { ElTimeSelect, ElMessage } from "element-plus";
|
|
@@ -371,17 +434,28 @@ import ModalComponent from "@/components/ModalComponent/index.vue";
|
|
|
import WebSocketClient from "@/utils/webSocketClient";
|
|
|
import { Interface } from "readline";
|
|
|
import { time } from "console";
|
|
|
-import {recordAssessmentResult,healthStatusTip,healthySetList} from '@/api/index'
|
|
|
+import {
|
|
|
+ recordAssessmentResult,
|
|
|
+ healthStatusTip,
|
|
|
+ healthySetList,
|
|
|
+} from "@/api/index";
|
|
|
const wsUrl = import.meta.env.VITE_WS_URL as string;
|
|
|
const wsClient = new WebSocketClient(wsUrl);
|
|
|
const { proxy } = getCurrentInstance()!;
|
|
|
-let gridData=ref(null)
|
|
|
-const getHStatus=async ()=>{
|
|
|
- let result=await healthySetList({})
|
|
|
-gridData.value=result.data
|
|
|
-}
|
|
|
+let gridData = ref(null);
|
|
|
+const getHStatus = async () => {
|
|
|
+ let result = await healthySetList({});
|
|
|
+ gridData.value = result.data;
|
|
|
+};
|
|
|
onMounted(() => {
|
|
|
- getHStatus()
|
|
|
+ getHStatus();
|
|
|
+ if (!!sessionStorage.getItem("runStatus")) {
|
|
|
+ runstatusMessage(JSON.parse(sessionStorage.getItem("runStatus")));
|
|
|
+ }
|
|
|
+ if (!!sessionStorage.getItem("healthyStatusText")) {
|
|
|
+ healthyMessage(JSON.parse(sessionStorage.getItem("healthyStatusText")));
|
|
|
+ }
|
|
|
+
|
|
|
nextTick(() => {});
|
|
|
|
|
|
wsClient.connect();
|
|
@@ -406,8 +480,8 @@ onMounted(() => {
|
|
|
|
|
|
break;
|
|
|
case "3":
|
|
|
- if (Object.keys(newData.data).length > 0) {
|
|
|
- healthyMessage(newData.data);
|
|
|
+ if (Object.keys(newData.data).length > 0) {
|
|
|
+ healthyMessage(newData.data);
|
|
|
}
|
|
|
break;
|
|
|
case "4":
|
|
@@ -424,31 +498,31 @@ onUnmounted(() => {
|
|
|
wsClient.onClose();
|
|
|
});
|
|
|
// 获取警告提示
|
|
|
-const getTip=()=>{
|
|
|
-
|
|
|
- proxy.$loading.start();
|
|
|
- showWarningModal.value=true
|
|
|
- healthStatusTip({}).then((res:any)=>{
|
|
|
- proxy.$loading.stop();
|
|
|
- let arr:any=[]
|
|
|
- res.data.map((its:any,index:number)=>{
|
|
|
- let rst=its.split('|')
|
|
|
- arr.push({
|
|
|
- id: index+1, type: rst[0], text: rst[1]
|
|
|
- })
|
|
|
- })
|
|
|
- warnList.value=arr
|
|
|
-
|
|
|
-
|
|
|
- })
|
|
|
+const getTip = () => {
|
|
|
+ proxy.$loading.start();
|
|
|
+ showWarningModal.value = true;
|
|
|
+ healthStatusTip({})
|
|
|
+ .then((res: any) => {
|
|
|
+ proxy.$loading.stop();
|
|
|
+ let arr: any = [];
|
|
|
+ res.data.map((its: any, index: number) => {
|
|
|
+ let rst = its.split("|");
|
|
|
+ arr.push({
|
|
|
+ id: index + 1,
|
|
|
+ type: rst[0],
|
|
|
+ text: rst[1],
|
|
|
+ });
|
|
|
+ });
|
|
|
+ warnList.value = arr;
|
|
|
+ })
|
|
|
.catch((error: any) => {
|
|
|
proxy.$loading.stop();
|
|
|
ElMessage({
|
|
|
- message: `获取警告提示失败: ${error.message || '未知错误'}`,
|
|
|
- type: 'error',
|
|
|
+ message: `获取警告提示失败: ${error.message || "未知错误"}`,
|
|
|
+ type: "error",
|
|
|
});
|
|
|
});
|
|
|
-}
|
|
|
+};
|
|
|
// 获取所有显示参数
|
|
|
let lineParamsAllRef = ref([]);
|
|
|
const dealMessage = (data: string) => {
|
|
@@ -499,13 +573,15 @@ const setLineparames = (
|
|
|
selectData: Array<AnyObject>
|
|
|
) => {
|
|
|
// 横坐标时间点
|
|
|
- xAxisParamsData.value = dataAll.map((its) => moment(its.data._ts).format('HH:mm:ss') ).slice(-30);
|
|
|
+ xAxisParamsData.value = dataAll
|
|
|
+ .map((its) => moment(its.data._ts).format("HH:mm:ss"))
|
|
|
+ .slice(-30);
|
|
|
// 折线图数据
|
|
|
seriesParamsData.value = selectData.map((its) => {
|
|
|
- return {
|
|
|
+ return {
|
|
|
...its,
|
|
|
- data:its.data.slice(-30)
|
|
|
- }
|
|
|
+ data: its.data.slice(-30),
|
|
|
+ };
|
|
|
});
|
|
|
// 图例
|
|
|
legendPramsData.value = selectData.map((its) => its.name);
|
|
@@ -534,7 +610,7 @@ const convertToChartData = (
|
|
|
};
|
|
|
const formatPressure = (value: number | string) => {
|
|
|
// console.log(typeof value,'------');
|
|
|
-
|
|
|
+
|
|
|
// if (typeof value == 'string') {
|
|
|
// return Number(value).toFixed(2);
|
|
|
// }
|
|
@@ -555,9 +631,10 @@ let machineImgParamsRef = ref({
|
|
|
watch(
|
|
|
() => lineParamsAllRef.value,
|
|
|
(newdata: any) => {
|
|
|
- machineImgParamsRef.value = lineParamsAllRef.value[lineParamsAllRef.value.length - 1].data;
|
|
|
- console.log('machineImgParamsRef.value',machineImgParamsRef.value);
|
|
|
-
|
|
|
+ machineImgParamsRef.value =
|
|
|
+ lineParamsAllRef.value[lineParamsAllRef.value.length - 1].data;
|
|
|
+ console.log("machineImgParamsRef.value", machineImgParamsRef.value);
|
|
|
+
|
|
|
const result: Array<AnyObject> = convertToChartData(
|
|
|
newdata,
|
|
|
checkedParams.value
|
|
@@ -575,8 +652,7 @@ const changeAttr = (val: string[]) => {
|
|
|
type: "error",
|
|
|
});
|
|
|
checkedParams.value = checkedParams.value.slice(0, 5);
|
|
|
- console.log(checkedParams.value );
|
|
|
-
|
|
|
+ console.log(checkedParams.value);
|
|
|
}
|
|
|
};
|
|
|
// 健康状态评估结果(模态框)
|
|
@@ -622,7 +698,8 @@ const generatePastWeekData = (
|
|
|
// 获取所有显示参数
|
|
|
let workParamsAllRef: Ref<DataPoint[]> = ref([]);
|
|
|
// 历史工况记录 chartData 实际图表展示的
|
|
|
-const chartData: Ref<DataPoint[]> = ref([]
|
|
|
+const chartData: Ref<DataPoint[]> = ref(
|
|
|
+ []
|
|
|
// [
|
|
|
// { x: 0, y: 0, value: 5, type: "p" },
|
|
|
// ].concat(generatePastWeekData(0, 3))
|
|
@@ -649,6 +726,7 @@ const runstatusMessage = (data: { label: string; state: 0 | 1 | 2 }) => {
|
|
|
// 获取工况状态
|
|
|
runStatusText.value = enumParasm[data.state].text + `(${data.label})`;
|
|
|
runStatusColor.value = enumParasm[data.state].color;
|
|
|
+ sessionStorage.setItem("runStatus", JSON.stringify(data));
|
|
|
};
|
|
|
const workMessage = (data: Object) => {
|
|
|
// 获取工况数据 一小时来一次
|
|
@@ -659,7 +737,7 @@ const workMessage = (data: Object) => {
|
|
|
// let currentValue=workParamsAllRef.value
|
|
|
// workParamsAllRef.value = currentValue.concat(data);
|
|
|
workParamsAllRef.value = data;
|
|
|
- workChange()
|
|
|
+ workChange();
|
|
|
};
|
|
|
const statusGk = ref([
|
|
|
{
|
|
@@ -695,64 +773,72 @@ const convertTo24Hour = (timeStr: string) => {
|
|
|
*/
|
|
|
const convertTo12HourFormat = (hour: number): string => {
|
|
|
if (hour === 0 || hour === 24) {
|
|
|
- return '12a';
|
|
|
+ return "12a";
|
|
|
} else if (hour === 12) {
|
|
|
- return '12p';
|
|
|
+ return "12p";
|
|
|
} else if (hour > 12) {
|
|
|
return `${hour - 12}p`;
|
|
|
} else {
|
|
|
return `${hour}a`;
|
|
|
}
|
|
|
-}
|
|
|
+};
|
|
|
// { x: 0, y: 0, value: 5, type: "p" }
|
|
|
-const transformData= (data:DataPoint[]) => {
|
|
|
+const transformData = (data: DataPoint[]) => {
|
|
|
const weekDayMap = {
|
|
|
- "星期一": '周一',
|
|
|
- "星期二": '周二',
|
|
|
- "星期三": '周三',
|
|
|
- "星期四": '周四',
|
|
|
- "星期五": '周五',
|
|
|
- "星期六": '周六',
|
|
|
- "星期日": '周日'
|
|
|
+ 星期一: "周一",
|
|
|
+ 星期二: "周二",
|
|
|
+ 星期三: "周三",
|
|
|
+ 星期四: "周四",
|
|
|
+ 星期五: "周五",
|
|
|
+ 星期六: "周六",
|
|
|
+ 星期日: "周日",
|
|
|
};
|
|
|
- return data.map(item => {
|
|
|
+ return data.map((item) => {
|
|
|
const { x, y, type, ...rest } = item;
|
|
|
let valueArray = [];
|
|
|
|
|
|
// 遍历剩余的键,将它们转换为所需的格式
|
|
|
for (const key in rest) {
|
|
|
const entry = rest[key];
|
|
|
-
|
|
|
+
|
|
|
if (Array.isArray(entry)) {
|
|
|
- valueArray.push({ name: key, value: entry });
|
|
|
+ valueArray.push({ name: key, value: entry });
|
|
|
}
|
|
|
}
|
|
|
return {
|
|
|
x: convertTo12HourFormat(x),
|
|
|
y: weekDayMap[y],
|
|
|
- value:valueArray,
|
|
|
- type: `${type}`
|
|
|
+ value: valueArray,
|
|
|
+ type: `${type}`,
|
|
|
};
|
|
|
});
|
|
|
};
|
|
|
// 筛选 如果条件都有数值 在进行查询
|
|
|
const workChange = () => {
|
|
|
- let lastResult=[]
|
|
|
+ let lastResult = [];
|
|
|
if (hlQueryParams.value.sDate && hlQueryParams.value.eDate) {
|
|
|
const sDate: string = convertTo24Hour(hlQueryParams.value.sDate);
|
|
|
const eDate: string = convertTo24Hour(hlQueryParams.value.eDate);
|
|
|
let result = workParamsAllRef.value.filter((obj: DataPoint) => {
|
|
|
- return obj.x >= Number(sDate) && obj.x <= Number(eDate)&&(hlQueryParams.value.tStatus=='all'?true:obj.type==hlQueryParams.value.tStatus);
|
|
|
+ return (
|
|
|
+ obj.x >= Number(sDate) &&
|
|
|
+ obj.x <= Number(eDate) &&
|
|
|
+ (hlQueryParams.value.tStatus == "all"
|
|
|
+ ? true
|
|
|
+ : obj.type == hlQueryParams.value.tStatus)
|
|
|
+ );
|
|
|
});
|
|
|
- lastResult=result
|
|
|
+ lastResult = result;
|
|
|
}
|
|
|
if (!!!hlQueryParams.value.sDate || !!!hlQueryParams.value.eDate) {
|
|
|
- let result = workParamsAllRef.value.filter((obj: DataPoint) => {
|
|
|
- return (hlQueryParams.value.tStatus=='all'?true:obj.type==hlQueryParams.value.tStatus);
|
|
|
+ let result = workParamsAllRef.value.filter((obj: DataPoint) => {
|
|
|
+ return hlQueryParams.value.tStatus == "all"
|
|
|
+ ? true
|
|
|
+ : obj.type == hlQueryParams.value.tStatus;
|
|
|
});
|
|
|
- lastResult=result
|
|
|
- }
|
|
|
- chartData.value=transformData(lastResult)
|
|
|
+ lastResult = result;
|
|
|
+ }
|
|
|
+ chartData.value = transformData(lastResult);
|
|
|
};
|
|
|
|
|
|
// 健康状态
|
|
@@ -761,12 +847,12 @@ const goResult = () => {
|
|
|
// path: "/OperationalReliabilityPrediction",
|
|
|
// query: {},
|
|
|
// });
|
|
|
- recordAssessmentResult({source:1}).then((res:any)=>{
|
|
|
- ElMessage({
|
|
|
+ recordAssessmentResult({ source: 1 }).then((res: any) => {
|
|
|
+ ElMessage({
|
|
|
message: `操作成功`,
|
|
|
type: "success",
|
|
|
});
|
|
|
- })
|
|
|
+ });
|
|
|
};
|
|
|
const xAxisData = ref([]);
|
|
|
const seriesData = ref([
|
|
@@ -778,10 +864,10 @@ const seriesData = ref([
|
|
|
const showLegend = ref(false);
|
|
|
const legendData = ref(["趋势"]);
|
|
|
const healthyStatusText = ref({
|
|
|
- name:'',
|
|
|
- color:''
|
|
|
+ name: "",
|
|
|
+ color: "",
|
|
|
});
|
|
|
-let flag = false
|
|
|
+let flag = false;
|
|
|
const healthyMessage = (data: Object) => {
|
|
|
// if (data.avg_num == 99) {
|
|
|
// if (flag) {
|
|
@@ -795,15 +881,18 @@ const healthyMessage = (data: Object) => {
|
|
|
|
|
|
// 获取健康数据
|
|
|
// let obj=determineHealthStatus(data.avg_num)
|
|
|
- let obj=determineHealthStatus(`${data.sha}(${data.avg_num}%)`)
|
|
|
- healthyStatusText.value=obj
|
|
|
- xAxisData.value.push(moment(data.date).format('HH:mm:ss'));
|
|
|
- seriesData.value[0].data.push(data.avg_num)
|
|
|
- let arr=seriesData.value[0].data
|
|
|
- seriesData.value=[{
|
|
|
- name: "趋势",
|
|
|
- data:arr
|
|
|
- }]
|
|
|
+ let obj = determineHealthStatus(`${data.sha}(${data.avg_num}%)`);
|
|
|
+ healthyStatusText.value = obj;
|
|
|
+ sessionStorage.setItem("healthyStatusText", JSON.stringify(data));
|
|
|
+ xAxisData.value.push(moment(data.date).format("HH:mm:ss"));
|
|
|
+ seriesData.value[0].data.push(data.avg_num);
|
|
|
+ let arr = seriesData.value[0].data;
|
|
|
+ seriesData.value = [
|
|
|
+ {
|
|
|
+ name: "趋势",
|
|
|
+ data: arr,
|
|
|
+ },
|
|
|
+ ];
|
|
|
};
|
|
|
interface HealthData {
|
|
|
id: number;
|
|
@@ -812,29 +901,28 @@ interface HealthData {
|
|
|
health_status: string;
|
|
|
}
|
|
|
const determineHealthStatus = (value: string) => {
|
|
|
- if (value.includes('健康')) {
|
|
|
- return {
|
|
|
- name:value,
|
|
|
- color:''
|
|
|
+ if (value.includes("健康")) {
|
|
|
+ return {
|
|
|
+ name: value,
|
|
|
+ color: "",
|
|
|
};
|
|
|
- } else if (value.includes('轻微')) {
|
|
|
+ } else if (value.includes("轻微")) {
|
|
|
return {
|
|
|
- name:value,
|
|
|
- color:'warn'
|
|
|
+ name: value,
|
|
|
+ color: "warn",
|
|
|
};
|
|
|
- } else if (value.includes('严重')) {
|
|
|
- return {
|
|
|
- name:value,
|
|
|
- color:'error'
|
|
|
+ } else if (value.includes("严重")) {
|
|
|
+ return {
|
|
|
+ name: value,
|
|
|
+ color: "error",
|
|
|
};
|
|
|
- } else if (value.includes('故障')) {
|
|
|
- return {
|
|
|
- name:value,
|
|
|
- color:'danger'
|
|
|
+ } else if (value.includes("故障")) {
|
|
|
+ return {
|
|
|
+ name: value,
|
|
|
+ color: "danger",
|
|
|
};
|
|
|
}
|
|
|
return "未知状态"; // 如果数据不在任何已定义的范围内
|
|
|
-
|
|
|
};
|
|
|
const healthColor = (status: string) => {
|
|
|
switch (status) {
|
|
@@ -853,10 +941,10 @@ const healthColor = (status: string) => {
|
|
|
</script>
|
|
|
|
|
|
<style scoped>
|
|
|
-.status-text{
|
|
|
- white-space: nowrap
|
|
|
+.status-text {
|
|
|
+ white-space: nowrap;
|
|
|
}
|
|
|
-.fullClass{
|
|
|
+.fullClass {
|
|
|
/* width: 100% !important; */
|
|
|
}
|
|
|
.all-page {
|
|
@@ -967,7 +1055,7 @@ const healthColor = (status: string) => {
|
|
|
.run-status {
|
|
|
margin-top: 20px;
|
|
|
display: flex;
|
|
|
- justify-content:flex-start;
|
|
|
+ justify-content: flex-start;
|
|
|
width: 100%;
|
|
|
align-items: center;
|
|
|
/* line-height: 60px; */
|
|
@@ -994,11 +1082,11 @@ const healthColor = (status: string) => {
|
|
|
text-align: left;
|
|
|
position: relative;
|
|
|
padding: 0 50px;
|
|
|
- white-space: pre-wrap; /* Allows wrapping */
|
|
|
- word-break: break-word; /* Breaks words at arbitrary points */
|
|
|
- max-width: 460px;
|
|
|
- display: inline-block;
|
|
|
- overflow-wrap: break-word; /* Ensures long words break */
|
|
|
+ white-space: pre-wrap; /* Allows wrapping */
|
|
|
+ word-break: break-word; /* Breaks words at arbitrary points */
|
|
|
+ max-width: 460px;
|
|
|
+ display: inline-block;
|
|
|
+ overflow-wrap: break-word; /* Ensures long words break */
|
|
|
}
|
|
|
.status-result-danger {
|
|
|
background: linear-gradient(
|
|
@@ -1069,22 +1157,22 @@ const healthColor = (status: string) => {
|
|
|
text-align: center;
|
|
|
position: relative;
|
|
|
}
|
|
|
-.health-result-warn{
|
|
|
- background: linear-gradient(180deg, rgb(227, 194, 70), rgb(255, 255, 255));
|
|
|
+.health-result-warn {
|
|
|
+ background: linear-gradient(180deg, rgb(227, 194, 70), rgb(255, 255, 255));
|
|
|
-webkit-background-clip: text;
|
|
|
-webkit-text-fill-color: transparent;
|
|
|
background-clip: text;
|
|
|
text-fill-color: transparent;
|
|
|
}
|
|
|
-.health-result-danger{
|
|
|
- background: linear-gradient(180deg, rgb(255, 97, 0), rgb(255, 255, 255));
|
|
|
+.health-result-danger {
|
|
|
+ background: linear-gradient(180deg, rgb(255, 97, 0), rgb(255, 255, 255));
|
|
|
-webkit-background-clip: text;
|
|
|
-webkit-text-fill-color: transparent;
|
|
|
background-clip: text;
|
|
|
text-fill-color: transparent;
|
|
|
}
|
|
|
-.health-result-error{
|
|
|
- background: linear-gradient(180deg, rgb(252, 63, 63), rgb(255, 255, 255));
|
|
|
+.health-result-error {
|
|
|
+ background: linear-gradient(180deg, rgb(252, 63, 63), rgb(255, 255, 255));
|
|
|
-webkit-background-clip: text;
|
|
|
-webkit-text-fill-color: transparent;
|
|
|
background-clip: text;
|
|
@@ -1181,6 +1269,9 @@ const healthColor = (status: string) => {
|
|
|
padding-left: 100px;
|
|
|
color: #fff;
|
|
|
font-size: 18px;
|
|
|
+ overflow: hidden;
|
|
|
+ text-overflow: ellipsis;
|
|
|
+ white-space: nowrap;
|
|
|
}
|
|
|
.warn-list-d-bac {
|
|
|
background: url(../../assets/img/danger.png);
|