From b6851e039d0edb72878dee4c86ea97553d6c2f03 Mon Sep 17 00:00:00 2001
From: gaoshp <291585735@qq.com>
Date: 星期二, 12 十一月 2024 19:53:30 +0800
Subject: [PATCH] update
---
src/views/mdc/components/StationLiveSpeed.vue | 56 +++++++++++++++++++++++++++++++-------------------------
1 files changed, 31 insertions(+), 25 deletions(-)
diff --git a/src/views/mdc/components/StationLiveSpeed.vue b/src/views/mdc/components/StationLiveSpeed.vue
index 38eb9d7..d14a7bf 100644
--- a/src/views/mdc/components/StationLiveSpeed.vue
+++ b/src/views/mdc/components/StationLiveSpeed.vue
@@ -1,24 +1,26 @@
<!--
* @Date: 2024-04-18 21:52:18
- * @LastEditors: lzhe lzhe@example.com
- * @LastEditTime: 2024-11-12 18:29:09
- * @FilePath: /belleson-frontend/Users/mache/Documents/demo/cps-web/src/views/mdc/components/TimeAlarm.vue
+ * @LastEditors: gaoshp
+ * @LastEditTime: 2024-11-12 19:53:16
+ * @FilePath: /cps-web/src/views/mdc/components/StationLiveSpeed.vue
-->
<template>
<div class="speed">
- <div id="c" style="width: 30%;height:200px;"></div>
- <div id="d" style="width: 30%;height:200px;"></div>
- <div id="e" style="width: 30%;height:200px;"></div>
+ <div ref="c" style="width: 30%;height:200px;"></div>
+ <div ref="d" style="width: 30%;height:200px;"></div>
+ <div ref="e" style="width: 30%;height:200px;"></div>
</div>
<div class="dataHr">鍔犲伐鏁版嵁</div>
<el-row :gutter="20" style="padding-right: 12px;padding-left: 12px;">
<!-- 涓昏酱璐熻浇(SpindleLoad),涓昏酱鍊嶇巼(SpindleRate),杩涚粰鍊嶇巼(FeedRate) 涓嶅湪杩欓噷灞曠ず -->
- <el-col :span="12" v-for="item in dmpList" style="margin-bottom: 12px;" v-show="item.dpName != 'SpindleLoad' && item.dpName != 'SpindleRate' && item.dpName != 'FeedRate'">
+ <el-col :span="12" v-for="item in dmpList" style="margin-bottom: 12px;"
+ v-show="item.dpName != 'SpindleLoad' && item.dpName != 'SpindleRate' && item.dpName != 'FeedRate'">
<div>
- <div class="inlineDiv">{{item.dpLabel}}</div>
- <el-input v-model="item.codeName" :disabled="true" class="inlineInput" :title="item.codeName"></el-input>
+ <div class="inlineDiv">{{ item.dpLabel }}</div>
+ <el-input v-model="item.codeName" :disabled="true" class="inlineInput"
+ :title="item.codeName"></el-input>
</div>
-
+
</el-col>
</el-row>
</template>
@@ -38,7 +40,7 @@
}
},
components: {
-
+
},
data() {
return {
@@ -50,7 +52,7 @@
style: { opacity: 0 }// 娣″叆
},
enterAnimation: {
- duration: 1300//鍔ㄧ敾鏃堕暱
+ duration: 1300//鍔ㄧ敾鏃堕暱
},
left: 'center',
top: 'bottom',
@@ -80,7 +82,7 @@
},
pointer: {
itemStyle: {
- color: 'auto'
+ color: 'auto'
}
},
axisTick: { //鍒诲害
@@ -95,8 +97,8 @@
distance: -14, //鍒诲害璺濈琛ㄧ洏鐨勮窛绂�
length: 10,
lineStyle: {
- color: '#fff',
- width: 2 //姣忎釜閿娇绾垮
+ color: '#fff',
+ width: 2 //姣忎釜閿娇绾垮
}
},
axisLabel: { //琛ㄧ洏鍐呭埢搴�
@@ -109,7 +111,7 @@
}
}
]
- }
+ }
}
},
methods: {
@@ -127,26 +129,26 @@
// })
// this.showCharts(a,b,c);
},
- showCharts(a,b,c) {
+ showCharts(a, b, c) {
var myChartA = echarts.init(document.getElementById('c'));
var myChartB = echarts.init(document.getElementById('d'));
var myChartC = echarts.init(document.getElementById('e'));
var optionA = JSON.parse(JSON.stringify(this.option));
var optionB = JSON.parse(JSON.stringify(this.option));
var optionC = JSON.parse(JSON.stringify(this.option));
- optionA.graphic.style.text= ['涓昏酱璐熻浇'+a+'%',].join('\n');
- optionB.graphic.style.text= ['涓昏酱鍊嶇巼'+b+'%',].join('\n');
- optionC.graphic.style.text= ['缁欒繘鍊嶇巼'+c+'%',].join('\n');
- optionA.series[0].data = [{value: a}];
- optionB.series[0].data = [{value: b}];
- optionC.series[0].data = [{value: c}];
+ optionA.graphic.style.text = ['涓昏酱璐熻浇' + a + '%',].join('\n');
+ optionB.graphic.style.text = ['涓昏酱鍊嶇巼' + b + '%',].join('\n');
+ optionC.graphic.style.text = ['缁欒繘鍊嶇巼' + c + '%',].join('\n');
+ optionA.series[0].data = [{ value: a }];
+ optionB.series[0].data = [{ value: b }];
+ optionC.series[0].data = [{ value: c }];
myChartA.setOption(optionA);
myChartB.setOption(optionB);
myChartC.setOption(optionC);
}
},
mounted() {
- this.showCharts(0,0,0);
+ this.showCharts(0, 0, 0);
}
}
</script>
@@ -156,9 +158,11 @@
display: flex;
justify-content: center;
}
-.speed > div {
+
+.speed>div {
flex: 1;
}
+
.dataHr {
background-color: #48ACF8;
height: 30px;
@@ -171,11 +175,13 @@
margin-top: 12px;
margin-bottom: 12px;
}
+
.inlineDiv {
display: inline-block;
width: 70px;
text-align: left;
}
+
.inlineInput {
width: calc(100% - 76px);
margin-left: 6px;
--
Gitblit v1.9.3