<template>
  <div class="block">
    <h3 class="v-title mb-12">练习统计</h3>
    <div class="flex-h">
      <OrgUserChart class="chart" @change="(user)=>(curUser=user)" />
      <div class="flex-h flex-wrap flex-1">
        <template v-if="$store.statistic_tab_active === 0">
          <ExercuseTimesPercent :user="curUser" />
          <ExerciseQuestionTypePercent :user="curUser" />
          <ExerciseQuestionIsPassPercent :user="curUser" />
        </template>
        <template v-else>
          <ExerciseDetailsTable  :user="curUser" />
        </template>
      </div>
    </div>
  </div>
</template>

<script>
import OrgUserChart from '@/views/statistic/components/OrgUserChart.vue'
import ExerciseQuestionIsPassPercent from './ExerciseQuestionIsPassPercent.vue'
import ExercuseTimesPercent from './ExercuseTimesPercent.vue'
import ExerciseQuestionTypePercent from './ExerciseQuestionTypePercent.vue'
import ExerciseDetailsTable from './ExerciseDetailsTable.vue'
export default {
  data: (_) => ({
    curUser: null
  }),
  components: {
    OrgUserChart,
    ExerciseQuestionIsPassPercent,
    ExercuseTimesPercent,
    ExerciseQuestionTypePercent,
    ExerciseDetailsTable
  },
  methods: {
    userChange (user) {
      this.curUser = user
    }
  }
}
</script>
