<template>
    <a-tabs v-model:activeKey="otherParam.activeKey" size="large" :tabBarGutter="otherParam.tabBarGutter" @change="switchTabs">
      <a-tab-pane key="1" :tab="'合规要求['+counts.compliane+']'" forceRender="true"><StComplianceTabs ref="tabs1" /></a-tab-pane>
      <a-tab-pane key="2" :tab="'内控要求['+counts.innerControl+']'" forceRender="true"><StInnerOrderTabs ref="tabs2"/></a-tab-pane>
      <a-tab-pane key="3" :tab="'存在问题['+counts.problem+']'" forceRender="true"><StProblemTabs ref="tabs3" /></a-tab-pane>
      <a-tab-pane key="4" :tab="'常见风险['+counts.event+']'" forceRender="true"><StRiskTabs ref="tabs4" /></a-tab-pane>
      <a-tab-pane key="5" :tab="'检查方法['+counts.check+']'" forceRender="true"><StCheckTabs ref="tabs5" /></a-tab-pane>
      <a-tab-pane key="6" :tab="'度量指标['+counts.metric+']'"><StMetricTabs :actInfo="actInfo"  ref="tabs6" /></a-tab-pane>
      <a-tab-pane key="7" :tab="'行业实践['+counts.best+']'" forceRender="true"><StBestPracticesTabs ref="tabs7" /></a-tab-pane>
    </a-tabs>
</template>

<script lang="ts" setup>
import { reactive, ref, watch,nextTick } from 'vue';
import StBestPracticesTabs from './tabs/StBestPracticesTabs.vue';
import StCheckTabs from './tabs/StCheckTabs.vue';
import StComplianceTabs from './tabs/StComplianceTabs.vue';
import StInnerOrderTabs from './tabs/StInnerOrderTabs.vue';
import StMetricTabs from './tabs/StMetricTabs.vue';
import StProblemTabs from './tabs/StProblemTabs.vue';
import StRiskTabs from './tabs/StRiskTabs.vue';
import { statisticsByCaNo } from '/@/views/standardlib/index.api';

const otherParam = reactive({
  activeKey: '1',
  tabBarGutter: (window.innerWidth-(7*85)) / 7,
})
//const tabs0 = ref(null)
const tabs1 = ref(null)
const tabs2 = ref(null)
const tabs3 = ref(null)
const tabs4 = ref(null)
const tabs5 = ref(null)
const tabs6 = ref(null)
const tabs7 = ref(null)
const clickRecord = ref([false,false,false,false,false,false,false])
const props = defineProps({
  actInfo: Map,
});
const counts = ref({
  metric: 0,
  compliane: 0,
  innerControl: 0,
  best: 0,
  check: 0,
  problem: 0,
  event: 0,
})
watch(
    ()=>props.actInfo,
    (newVal,oldVla)=>{
      let params = {caNo:newVal.caNo}
   
      statisticsByCaNo(params).then(rep=>{
        counts.value = rep
      })
      // 重新初始化
      clickRecord.value = [false,false,false,false,false,false,false]
    }
)

function initActiveKey() {
  otherParam.activeKey = '1'
  nextTick(() => {
    switchTabs(1)
  })
}

function switchTabs(activeKey){
  let index = parseInt(activeKey)
  if(clickRecord.value[index]){
    return
  }
 clickRecord.value[index] = true
  let parm = {caNo:props.actInfo.caNo,caName:props.actInfo.caName}

  switch(index){
    case 1:
      tabs1.value?.setProps({searchInfo:parm});
      tabs1.value?.reload()
      break;
    case 2:
      tabs2.value?.setProps({searchInfo:parm});
      tabs2.value?.reload()
      break;
    case 3:
      tabs3.value?.setProps({searchInfo:parm});
      tabs3.value?.reload()
      break;
    case 4:
      tabs4.value?.setProps({searchInfo:parm});
      tabs4.value?.reload()
      break;
    case 5:
      tabs5.value?.setProps({searchInfo:parm});
      tabs5.value?.reload()
      break;
    case 6:
      tabs6.value?.setProps({searchInfo:parm});
      tabs6.value?.reload()
      break;
    case 7:
      tabs7.value?.setProps({searchInfo:parm});
      tabs7.value?.reload()
      break;
  }
}
defineExpose({initActiveKey})
</script>