<template>
  <div style="flex: 1;">
    <Container name="产线缺陷统计" size="small">
        <SelectorBtnGroup class="timeToggle" :options="['日', '周', '月', '年']" @emitFun='toggleDate' :active='chartTime' />
        <div class="chart" style="height: 238px; margin-top: 8px;">
          <DefectChart :chartTime='chartTime'/>
        </div>
      </Container>
  </div>
</template>
<script>
import Container from '../components/Container';
import SelectorBtnGroup from '../components/SelectorBtnGroup';
import DefectChart from '../components/DefectChart';
export default {
  name: 'DefectStatistics',
  components: { Container, SelectorBtnGroup, DefectChart },
  data() {
    return {
      chartTime:'日'
    }
  },
  methods: {
    // 切换时间
		toggleDate(val) {
			console.log('时间' + val)
			this.chartTime = val
		}
  }
}
</script>
<style lang='scss' scoped>
.timeToggle {
  position: absolute;
  right: 20px;
  top: 20px;
}
</style>