yudao-init/src/views/copilot/efficiency/index.vue
2024-04-29 16:06:59 +08:00

83 lines
1.7 KiB
Vue

<!--
filename: index.vue
author: liubin
date: 2024-04-16 14:40:15
description: 效率驾驶舱
-->
<template>
<div class="efficiency-copilot">
<Container title="芯片良率" icon="chip2">
<ChipRate />
</Container>
<Container title="标准组件良率" icon="std">
<StdRate />
</Container>
<Container title="芯片OEE" icon="chip">
<ChipOee :period="period" />
</Container>
<Container title="转化效率" icon="cube">
<TransformRate :period="period" />
</Container>
</div>
</template>
<script>
import Container from "@/views/copilot/components/Container.vue";
import ChipOeeVue from "./components/ChipOee.vue";
import ChipRateVue from "./components/ChipRate.vue";
import StdRateVue from "./components/StdRate.vue";
import TransformRateVue from "./components/TransformRate.vue";
export default {
name: "EfficiencyCopilot",
components: {
Container,
ChipOee: ChipOeeVue,
ChipRate: ChipRateVue,
StdRate: StdRateVue,
TransformRate: TransformRateVue,
},
props: {
period: {
type: String,
default: "日",
},
},
data() {
return {};
},
watch: {
period: {
handler(val) {
val && this.fetchData(val);
},
immediate: true,
},
},
methods: {
fetchData(period = "日") {
console.log(`效率驾驶舱,获取${period}数据`);
this.$store.dispatch("copilot/initCopilot", {
period,
source: "efficiency",
});
},
},
};
</script>
<style scoped>
.efficiency-copilot {
flex: 1;
display: grid;
gap: 16px;
grid-template-columns: 1fr 1fr;
grid-template-rows: 1fr 1fr;
}
.efficiency-copilot > div {
height: 100%;
}
</style>