|
@@ -30,7 +30,7 @@
|
|
placeholder=""
|
|
placeholder=""
|
|
>
|
|
>
|
|
</el-date-picker>
|
|
</el-date-picker>
|
|
-           速度控制: <el-input
|
|
|
|
|
|
+       速度控制: <el-input
|
|
style="width: 80px"
|
|
style="width: 80px"
|
|
max="60"
|
|
max="60"
|
|
min="1"
|
|
min="1"
|
|
@@ -69,34 +69,34 @@
|
|
srcset=""
|
|
srcset=""
|
|
/>
|
|
/>
|
|
<!-- 添加注释和标签 -->
|
|
<!-- 添加注释和标签 -->
|
|
- <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%">
|
|
|
|
|
|
+ <div class="annotation" style="top: 60px; left: 120px">左DE活塞</div>
|
|
|
|
+ <div class="annotation" style="top: 50px; left: 280px">左DE燃油齿条</div>
|
|
|
|
+ <div class="annotation" style="top: 10px; left: 380px">
|
|
左DE冷却水
|
|
左DE冷却水
|
|
</div>
|
|
</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>
|
|
|
|
- <div class="annotation" style="top: 22%; left: 55.2%">
|
|
|
|
|
|
+ <div class="annotation" style="top: 50px; left: 420px">左DE箱装体</div>
|
|
|
|
+ <div class="annotation" style="top: 30px; left: 480px">左DE燃油齿条</div>
|
|
|
|
+ <div class="annotation" style="top: 0px; left: 555px">右齿轮箱</div>
|
|
|
|
+ <div class="annotation" style="top: 40px; left: 600px">
|
|
右GT高压压气机
|
|
右GT高压压气机
|
|
</div>
|
|
</div>
|
|
- <div class="annotation" style="top: 28%; left: 66%">
|
|
|
|
|
|
+ <div class="annotation" style="top: 65px; left: 670px">
|
|
右GT脉冲温度调节器保护
|
|
右GT脉冲温度调节器保护
|
|
</div>
|
|
</div>
|
|
- <div class="annotation" style="bottom: 17%; left: 14.5%">
|
|
|
|
|
|
+ <div class="annotation" style="bottom: 15px; left: 190px">
|
|
右DE增压空气
|
|
右DE增压空气
|
|
</div>
|
|
</div>
|
|
- <div class="annotation" style="bottom: 18.4%; left: 26%">
|
|
|
|
|
|
+ <div class="annotation" style="bottom: 20px; left: 300px">
|
|
右DE海水泵
|
|
右DE海水泵
|
|
</div>
|
|
</div>
|
|
- <div class="annotation" style="bottom: 12%; left: 25%">
|
|
|
|
|
|
+ <div class="annotation" style="bottom: -10px; left: 295px">
|
|
右DE箱装体冷却风机
|
|
右DE箱装体冷却风机
|
|
</div>
|
|
</div>
|
|
- <div class="annotation" style="bottom: 14%; left: 42.5%">
|
|
|
|
|
|
+ <div class="annotation" style="bottom: 5px; left: 445px">
|
|
右DE滑油
|
|
右DE滑油
|
|
</div>
|
|
</div>
|
|
<!-- 带有小边框的注释 -->
|
|
<!-- 带有小边框的注释 -->
|
|
- <div class="annotation bordered-box" style="top: 12%; left: 0.5%">
|
|
|
|
|
|
+ <div class="annotation bordered-box" style="top: 0px; left: 85px">
|
|
<div>
|
|
<div>
|
|
<div>压力A排</div>
|
|
<div>压力A排</div>
|
|
|
|
|
|
@@ -121,7 +121,7 @@
|
|
</div>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
- <div class="annotation bordered-box" style="top: 10%; right: 10%">
|
|
|
|
|
|
+ <div class="annotation bordered-box" style="top: -10px; right: 180px">
|
|
<div>
|
|
<div>
|
|
<div>海水压力</div>
|
|
<div>海水压力</div>
|
|
<div class="value">
|
|
<div class="value">
|
|
@@ -147,7 +147,7 @@
|
|
</div>
|
|
</div>
|
|
<div
|
|
<div
|
|
class="annotation bordered-box"
|
|
class="annotation bordered-box"
|
|
- style="bottom: 13.5%; left: -4.2%"
|
|
|
|
|
|
+ style="bottom: 0px; left: 40px"
|
|
>
|
|
>
|
|
<div>
|
|
<div>
|
|
<div>后气压PP030</div>
|
|
<div>后气压PP030</div>
|
|
@@ -172,8 +172,7 @@
|
|
</div>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
-
|
|
|
|
- <div class="annotation bordered-box" style="top: 34.7%; right: 5%">
|
|
|
|
|
|
+ <div class="annotation bordered-box" style="top: 100px; right: 130px">
|
|
<div>
|
|
<div>
|
|
<div>压力(1)</div>
|
|
<div>压力(1)</div>
|
|
<div class="value">
|
|
<div class="value">
|
|
@@ -193,7 +192,7 @@
|
|
</div>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
- <div class="annotation bordered-box" style="top: 77.8%; right: 9.8%">
|
|
|
|
|
|
+ <div class="annotation bordered-box" style="bottom: -10px; right: 180px">
|
|
<div>
|
|
<div>
|
|
<div>压力A排</div>
|
|
<div>压力A排</div>
|
|
<div class="value">
|
|
<div class="value">
|
|
@@ -575,14 +574,14 @@ const queryParamsMock = ref({
|
|
sDate: null,
|
|
sDate: null,
|
|
count: 1,
|
|
count: 1,
|
|
});
|
|
});
|
|
-watch(
|
|
|
|
- () => queryParamsMock.value.sDate,
|
|
|
|
- (newSDate) => {
|
|
|
|
- if (newSDate) {
|
|
|
|
- queryParamsMock.value.eDate = moment(newSDate).add(1, "hour").toDate();
|
|
|
|
- }
|
|
|
|
- }
|
|
|
|
-);
|
|
|
|
|
|
+// watch(
|
|
|
|
+// () => queryParamsMock.value.sDate,
|
|
|
|
+// (newSDate) => {
|
|
|
|
+// if (newSDate) {
|
|
|
|
+// queryParamsMock.value.eDate = moment(newSDate).add(1, "hour").toDate();
|
|
|
|
+// }
|
|
|
|
+// }
|
|
|
|
+// );
|
|
const { proxy } = getCurrentInstance()!;
|
|
const { proxy } = getCurrentInstance()!;
|
|
let gridData = ref(null);
|
|
let gridData = ref(null);
|
|
const getHStatus = async () => {
|
|
const getHStatus = async () => {
|
|
@@ -599,6 +598,7 @@ const getQueryDataRangeSpeed = async () => {
|
|
count:Number(valueObj.batch_size),
|
|
count:Number(valueObj.batch_size),
|
|
time:Number(valueObj.interval)
|
|
time:Number(valueObj.interval)
|
|
}
|
|
}
|
|
|
|
+ mockStart(true)
|
|
};
|
|
};
|
|
onMounted(async () => {
|
|
onMounted(async () => {
|
|
getcateData();
|
|
getcateData();
|
|
@@ -714,7 +714,7 @@ const setParamsHl = (start: string, end: string) => {
|
|
];
|
|
];
|
|
setConditionTime({"min_time":hlQueryParams.value.eDate[0],"max_time":hlQueryParams.value.eDate[1]})
|
|
setConditionTime({"min_time":hlQueryParams.value.eDate[0],"max_time":hlQueryParams.value.eDate[1]})
|
|
};
|
|
};
|
|
-const mockStart = () => {
|
|
|
|
|
|
+const mockStart = async (state:boolean=false) => {
|
|
if (queryParamsMock.value.time > 60) {
|
|
if (queryParamsMock.value.time > 60) {
|
|
ElMessage({
|
|
ElMessage({
|
|
message: `最大不超过60s`,
|
|
message: `最大不超过60s`,
|
|
@@ -729,7 +729,19 @@ const mockStart = () => {
|
|
});
|
|
});
|
|
return false;
|
|
return false;
|
|
}
|
|
}
|
|
- lineParamsAllRef.value = [];
|
|
|
|
|
|
+ // mounted进来使用缓存接口数据
|
|
|
|
+ if (state) {
|
|
|
|
+ let resultCatch= await mockCacheData({})
|
|
|
|
+ lineParamsAllRef.value = resultCatch.data.map((its:any) => {
|
|
|
|
+ return {
|
|
|
|
+ data: its,
|
|
|
|
+ };
|
|
|
|
+ });
|
|
|
|
+ // debugger
|
|
|
|
+ }else{
|
|
|
|
+
|
|
|
|
+ lineParamsAllRef.value = [];
|
|
|
|
+ }
|
|
seriesData.value = [
|
|
seriesData.value = [
|
|
{
|
|
{
|
|
name: "趋势",
|
|
name: "趋势",
|
|
@@ -745,7 +757,8 @@ const mockStart = () => {
|
|
start: queryParamsMock.value.sDate,
|
|
start: queryParamsMock.value.sDate,
|
|
end: queryParamsMock.value.eDate,
|
|
end: queryParamsMock.value.eDate,
|
|
});
|
|
});
|
|
- updateDataRangeSpeed({
|
|
|
|
|
|
+ if (!state) {
|
|
|
|
+ updateDataRangeSpeed({
|
|
start_time: moment(queryParamsMock.value.sDate).format(
|
|
start_time: moment(queryParamsMock.value.sDate).format(
|
|
"YYYY-MM-DD HH:mm:ss"
|
|
"YYYY-MM-DD HH:mm:ss"
|
|
),
|
|
),
|
|
@@ -758,6 +771,8 @@ const mockStart = () => {
|
|
type: "success",
|
|
type: "success",
|
|
});
|
|
});
|
|
});
|
|
});
|
|
|
|
+ }
|
|
|
|
+
|
|
};
|
|
};
|
|
let cateBigRef = ref([]);
|
|
let cateBigRef = ref([]);
|
|
let cateSmallRef = ref([]);
|
|
let cateSmallRef = ref([]);
|
|
@@ -936,7 +951,7 @@ const setLineparames = (
|
|
seriesParamsData.value = selectData.map((its) => {
|
|
seriesParamsData.value = selectData.map((its) => {
|
|
return {
|
|
return {
|
|
...its,
|
|
...its,
|
|
- data: its.data.slice(-30),
|
|
|
|
|
|
+ data: its.data,
|
|
};
|
|
};
|
|
});
|
|
});
|
|
// 图例
|
|
// 图例
|
|
@@ -1352,7 +1367,7 @@ const healthColor = (status: string) => {
|
|
align-items: center;
|
|
align-items: center;
|
|
white-space: nowrap;
|
|
white-space: nowrap;
|
|
color: #fff;
|
|
color: #fff;
|
|
- padding-left: 50px;
|
|
|
|
|
|
+ /* padding-left: 50px; */
|
|
margin-bottom: 16px;
|
|
margin-bottom: 16px;
|
|
}
|
|
}
|
|
.mockDiv .btn {
|
|
.mockDiv .btn {
|
|
@@ -1368,7 +1383,7 @@ const healthColor = (status: string) => {
|
|
}
|
|
}
|
|
.all-page {
|
|
.all-page {
|
|
display: grid;
|
|
display: grid;
|
|
- grid-template-columns: 58% 1% 41%;
|
|
|
|
|
|
+ grid-template-columns: 56% 1% 41%;
|
|
/* 左边宽度,间隔,右边宽度 */
|
|
/* 左边宽度,间隔,右边宽度 */
|
|
height: calc(100vh - 98px);
|
|
height: calc(100vh - 98px);
|
|
/* 状态分析高度 */
|
|
/* 状态分析高度 */
|
|
@@ -1397,7 +1412,7 @@ const healthColor = (status: string) => {
|
|
background-color: rgba(0, 0, 0, 0.5);
|
|
background-color: rgba(0, 0, 0, 0.5);
|
|
padding: 2px 5px;
|
|
padding: 2px 5px;
|
|
border-radius: 3px;
|
|
border-radius: 3px;
|
|
- font-size: 16px;
|
|
|
|
|
|
+ font-size: 1rem;
|
|
}
|
|
}
|
|
.bordered-box div {
|
|
.bordered-box div {
|
|
font-size: 12px;
|
|
font-size: 12px;
|
|
@@ -1430,7 +1445,7 @@ const healthColor = (status: string) => {
|
|
|
|
|
|
.right {
|
|
.right {
|
|
display: grid;
|
|
display: grid;
|
|
- grid-template-rows: 50%;
|
|
|
|
|
|
+ grid-template-rows: 49%;
|
|
/* 默认情况下,子元素会自动分配空间 */
|
|
/* 默认情况下,子元素会自动分配空间 */
|
|
}
|
|
}
|
|
|
|
|