<template>
  <HcTabsSimple :cur="tabsKey" :datas="tabsData" @tabClick="tabsClick">
      <template #tab-month-static>
          <MonthStatic :cur="tabsKey" :type="1"/>
      </template>
      <template #tab-original-record>
          <originalRecord :cur="tabsKey" :type="2"/>
      </template>
      <template #tab-clock-time>
          <clockTime :cur="tabsKey" :type="3"/>
      </template>

  </HcTabsSimple>
</template>

<script setup>
import {ref, watch, onMounted} from "vue";
import MonthStatic from "./components/tab-month-static.vue";
import originalRecord from "./components/tab-original-record.vue";
import clockTime from "./components/tab-clock-time.vue";



//类型处理
const tabsKey = ref('month-static')
const tabsData = ref([
  {icon: 'bar-chart-box', label: '月度统计', key: 'month-static'},
  {icon: 'tools', label: '原始记录', key: 'original-record'},
  {icon: 'time', label: '打卡时间', key: 'clock-time'},

 
])
//渲染完成
onMounted(() => {

})
const tabsClick = (key) => {
  tabsKey.value = key
}


</script>

<style lang="scss" scoped>

</style>

<style lang="scss">

</style>
