<!-- 
    filename: KilnDataBoard.vue
    author: liubin
    date: 2023-12-04 16:51:00
    description: 
-->

<template>
	<div
		class="KilnDataBoard"
		style="
			position: absolute;
			top: -8px;
			left: -16px;
			width: calc(100% + 28px);
			height: calc(100% + 38px);
			display: flex;
			flex-direction: column;
			gap: 16px;
		">
		<KHeader />
		<div
			class="main-body"
			style="flex: 1; display: flex; gap: 16px; padding: 8px 16px">
			<div class="left-side" style="flex: 2">
				<LeftFour />
			</div>
			<div class="right-side" style="flex: 1">
				<RightTwo />
			</div>
		</div>
	</div> 
</template>

<script>
import KHeader from '../components/Header.vue';
import LeftFour from './LeftFour.vue';
import RightTwo from './RightTwo.vue';

export default {
	name: 'KilnDataBoard',
	components: {
		KHeader,
		LeftFour,
		RightTwo,
	},
	data() {
		return {};
	},
};
</script>

<style scoped lang="scss">
.KilnDataBoard {
	background: url(../assets/bg.png) no-repeat;
	background-size: cover;
	background-position: 0 0;
}
</style>
