<template>
	<!-- 窑底温度 -->
	<Container usage="Charts">
		<SubContainer title="窑底温度" icon="oil" padding="34px">
			<div class="tables flex" style="height: 100%">
				<LineChart key="1" id="line-chart-7" class="flex-1" :config="chartConfig" />
				<div class="vertical-line"></div>
				<LineChart key="2" id="line-chart-8" class="flex-1" :config="chartConfig" />
			</div>
		</SubContainer>
	</Container>
</template>

<script>
import LineChart from "../charts/LineChart.vue";
import Container from "../layout/Container.vue";
import SubContainer from "../layout/SubContainer.vue";

export default {
	name: "BottomTemp",
	props: {},
	components: { Container, SubContainer, LineChart },
	data() {
		return {
			chartConfig: {},
		};
	},
};
</script>

<style scoped lang="scss">
@import "../../assets/styles/functions";

.flex-1 {
	flex: 1;
	// background: #eee;
}

.vertical-line {
	margin: 0 adjust(3px);
	width: adjust(3px);
	background: radial-gradient(
		ellipse at center,
		#6fe2ff,
		#52cbef80,
		transparent,
		transparent
	);
}
</style>
