添加时间

src/views/databoard/kiln/EnergeCost.vue

@@ -7,6 +7,7 @@
 
 <template>
 	<Container name="能耗" size="middle" style="">
+		<TimePrompt class="timeShow" :timestr="timestr" />
 		<EnergeTop />
 		<SplitLine :horizontal="true" />
 		<div class="" style="flex: 2; padding: 8px">
@@ -35,7 +36,7 @@
 				<SelectorBtnGroup :options="['周', '月', '年']" @emitFun='toggleDate' :active='chartTime'/>
 			</div>
 			<div class="chart" style="height: 200px; margin-top: 8px;">
-				<GasChart :chartType='chartType' :chartTime='chartTime'/>
+				<GasChart :chartType='chartType' :chartTime='chartTime' @emitFun='dateUpdate'/>
 			</div>
 		</div>
 	</Container>
@@ -49,6 +50,8 @@ import SplitLine from '../components/line';
 import EnergeTop from './EnergeTop';
 import GasChart from '../components/GasChart.vue';
 import SelectorBtnGroup from '../components/SelectorBtnGroup';
+import TimePrompt from '../components/TimePrompt';
+import { switchShowTime } from '../utils'
 export default {
 	name: 'EnergeCost',
 	components: {
@@ -58,14 +61,19 @@ export default {
 		EnergeTop,
 		GasChart,
 		SelectorBtnGroup,
+		TimePrompt
 	},
 	props: {},
 	data() {
 		return {
 			chartType:'电耗能',
-			chartTime:'周'
+			chartTime:'周',
+			timestr: ''
 		};
 	},
+	mounted() {
+    this.timestr = switchShowTime(this.chartTime)
+  },
 	computed: {
 		gasInfoMsg() {
 			return this.$store.state.websocket.gasInfo
@@ -74,37 +82,27 @@ export default {
 	methods: {
 		// 切换能源
 		toggleType(val) {
-			console.log('能源' + val)
 			this.chartType = val
-			// if (val === '天然气I' || val === '天然气II') {
-			// 	if (this.chartTime === '周') {
-			// 		this.chartType = val
-			// 	} else {
-			// 		this.$message.warning('暂无数据')
-			// 	}
-			// }else {
-			// 	this.chartType = val
-			// }
 		},
 		// 切换时间
 		toggleDate(val) {
-			console.log('时间' + val)
 			this.chartTime = val
-			// if (val === '月' || val === '年') {
-			// 	if (this.chartType === '电耗能') {
-			// 		this.chartTime = val
-			// 	} else {
-			// 		this.$message.warning('暂无数据')
-			// 	}
-			// }else{
-			// 	this.chartTime = val
-			// }
-		}
+			this.timestr = switchShowTime(val)
+		},
+		// 数据更新
+    dateUpdate() {
+      this.timestr = switchShowTime(this.chartTime)
+    }
 	},
 };
 </script>
 
 <style scoped lang="scss">
+.timeShow {
+  position: absolute;
+  top: 20px;
+  left: 120px;
+}
 .lgd {
 	color: #fff;
 

src/views/databoard/kiln/GasHandle.vue

@@ -1,6 +1,7 @@
 <template>
 	<div class="gas-handle" style="flex: 2">
 		<Container name="烟气处理" size="large" style="">
+			<TimePrompt class="timeShow" :timestr="timestr" />
 			<div
 				class=""
 				style="
@@ -99,7 +100,7 @@
 					<SelectorBtnGroup :options="['日', '周', '月', '年']" @emitFun='toggleDate' :active='chartTime' />
 				</div>
 				<div class="chart" style="height: 250px;margin-top: 10px;">
-					<FlueGasChart :chartType='chartType' :chartTime='chartTime'/>
+					<FlueGasChart :chartType='chartType' :chartTime='chartTime' @emitFun='dateUpdate'/>
 				</div>
 			</div>
 		</Container>
@@ -113,6 +114,8 @@ import KilnLine from '../components/line';
 // import Switcher from '../components/Switcher';
 import SelectorBtnGroup from '../components/SelectorBtnGroup';
 import FlueGasChart from '../components/FlueGasChart';
+import TimePrompt from '../components/TimePrompt';
+import { switchShowTime } from '../utils'
 
 export default {
 	name: 'GasHandle',
@@ -122,12 +125,14 @@ export default {
 		KilnLine,
 		SelectorBtnGroup,
 		FlueGasChart,
+		TimePrompt
 	},
 	props: {},
 	data() {
 		return {
 			chartType:'氧气含量',
-			chartTime:'日'
+			chartTime:'日',
+			timestr: ''
 		};
 	},
 	computed: {
@@ -135,6 +140,9 @@ export default {
 			return this.$store.state.websocket.exhaustGasInfo
 		}
 	},
+	mounted() {
+    this.timestr = switchShowTime(this.chartTime)
+  },
 	methods: {
 		// 烟气
 		toggleType(val) {
@@ -143,14 +151,23 @@ export default {
 		},
 		// 切换时间
 		toggleDate(val) {
-			console.log('时间' + val)
 			this.chartTime = val
-		}
+			this.timestr = switchShowTime(val)
+		},
+		// 数据更新
+    dateUpdate() {
+      this.timestr = switchShowTime(this.chartTime)
+    }
 	},
 };
 </script>
 
 <style scoped lang="scss">
+.timeShow {
+  position: absolute;
+  top: 20px;
+  left: 170px;
+}
 .gas-handle {
 }
 

src/views/databoard/kiln/IsraCheck.vue

@@ -1,34 +1,8 @@
-<!-- 
-    filename: IsraCheck.vue
-    author: liubin
-    date: 2023-12-06 09:50:13
-    description: 
--->
 
 <template>
 	<Container name="ISRA缺陷检测" size="middle" style="">
-		<ISRAChart />
-		<!-- <div style="padding: 12px; display: flex; flex-direction: column; gap: 8px; height: 100%;">
-			<div class="f" style="flex: 9;">
-				
-			</div>
-			<ul
-				class="legend"
-				style="
-					flex: 1;
-					padding: 8px;
-					display: flex;
-					justify-content: center;
-					gap: 20px;
-					color: #fff;
-					font-size: 14px;
-				">
-				<li class="fault-1">缺陷1</li>
-				<li class="fault-2">缺陷2</li>
-				<li class="fault-3">缺陷3</li>
-				<li class="fault-4">缺陷4</li>
-			</ul>
-		</div> -->
+		<TimePrompt class="timeShow" :timestr="timestr" />
+		<ISRAChart @emitFun='dateUpdate'/>
 	</Container>
 </template>
 
@@ -36,20 +10,36 @@
 import Container from '../components/Container';
 import ShadowRect from '../components/ShadowRect.vue';
 import ISRAChart from '../components/ISRAChart.vue';
-
+import TimePrompt from '../components/TimePrompt';
+import { switchShowTime } from '../utils'
 export default {
 	name: 'IsraCheck',
-	components: { Container, ShadowRect, ISRAChart },
+	components: { Container, ShadowRect, ISRAChart, TimePrompt },
 	props: {},
 	data() {
-		return {};
+		return {
+			timestr: ''
+		};
 	},
 	computed: {},
-	methods: {},
+	mounted() {
+		this.timestr = switchShowTime('日')
+	},
+	methods: {
+		// 数据更新
+    dateUpdate() {
+      this.timestr = switchShowTime('日')
+    }
+	},
 };
 </script>
 
 <style scoped lang="scss">
+.timeShow {
+  position: absolute;
+  top: 19px;
+  left: 210px;
+}
 ul,
 li {
 	margin: 0;