<template>
  <div class="st_coolection_cont">
    <div class="st_coolection">
    <a-form>
      <a-button type="link" @click="returnJh">{{complianeInfoRecord.complianeNo}}</a-button>
     {{ complianeInfoRecord.fileName }}
      <a-button type="link" @click="returnUpper">上一级</a-button>
    </a-form>
    <StComplianeItemList v-show="onlyFlay==1" :complianeInfoRecord="complianeInfoRecord" ref="defaultCitemRef" @success="doUpdateCount"></StComplianeItemList>
    <a-tabs v-show="onlyFlay==2" v-model:activeKey="activeKey" tabBarGutter="24" style="padding: 12px;" @change="switchTabs">
      <a-tab-pane key="1" :tab="'存在的问题['+counts.problem+']'" forceRender="true">
        <StComplianceProblem :complianeInfoRecord="complianeInfoRecord" ref="cProblemRef0" @success="doUpdateCount"/>
      </a-tab-pane>
      <a-tab-pane key="2" :tab="'合规要求['+counts.item+']'" forceRender="true">
        <StComplianeItemList :complianeInfoRecord="complianeInfoRecord" ref="citemRef1" @success="doUpdateCount"></StComplianeItemList>
      </a-tab-pane>
      <!--<a-tab-pane key="3" tab="Tab 3">Content of Tab Pane 3</a-tab-pane>-->
    </a-tabs>
    <a-tabs v-show="onlyFlay==3" v-model:activeKey="activeKey" tabBarGutter="24" style="padding: 12px;" @change="switchTabs">
      <a-tab-pane key="1" :tab="'风险提示['+counts.risk+']'" forceRender="true">
        <StComplianceRiskEventList :complianeInfoRecord="complianeInfoRecord" ref="criskRef" @success="doUpdateCount"/>
      </a-tab-pane>
      <a-tab-pane key="2" :tab="'存在的问题['+counts.problem+']'" forceRender="true">
        <StComplianceProblem :complianeInfoRecord="complianeInfoRecord" ref="cProblemRef1" @success="doUpdateCount"/>
      </a-tab-pane>
      <a-tab-pane key="3" :tab="'合规要求['+counts.item+']'" forceRender="true">
        <StComplianeItemList :complianeInfoRecord="complianeInfoRecord" ref="citemRef2" @success="doUpdateCount"/>
      </a-tab-pane>
      <!--<a-tab-pane key="3" tab="Tab 3">Content of Tab Pane 3</a-tab-pane>-->
    </a-tabs>
    <StComplianePunishList  v-show="onlyFlay==4" :complianeInfoRecord="complianeInfoRecord" ref="punishref" @success="doUpdateCount"/>
   </div>
  </div> 
</template>
<script lang="ts" setup>
  import { ref } from 'vue';
import StComplianceProblem from './StComplianceProblem.vue';
import StComplianceRiskEventList from './StComplianceRiskEventList.vue';
import StComplianeItemList from './StComplianeItemList.vue';
import StComplianePunishList from './StComplianePunishList.vue';
import { statisticsByComplianceNo } from '/@/views/standardlib/index.api';
  const onlyFlay = ref(1)
  const activeKey = ref('1')
  const defaultCitemRef = ref(null)
  const citemRef1 = ref(null)
  const citemRef2 = ref(null)
  const cProblemRef0 = ref(null)
  const cProblemRef1 = ref(null)
  const criskRef = ref(null)
  const punishref = ref(null)
  const tabsCheckArr = ref([false,false,false,false])
  const props = defineProps({
    complianeInfoRecord: {}
  });
  const counts = ref({
    risk: 0,
    problem: 0,
    item: 0,
  })
  const emit = defineEmits(['callBack']);
  function returnJh() {
    emit('callBack',props.complianeInfoRecord)
   }
   function returnUpper() {
    emit('callBack')
   }
   function doUpdateCount(){
    initCount(props.complianeInfoRecord.complianeNo)
   }
   function initCount(complianeNo){
    statisticsByComplianceNo({complianeNo:complianeNo}).then(rep=>{
          counts.value = rep
        })
   }
   function initActiveKey(complianeNo,complianeClass) {
      activeKey.value = '1'
      // 初始化数据
      tabsCheckArr.value = [false,false,false,false]
      if(complianeClass == 3){
        onlyFlay.value = 2
        initCount(complianeNo)
      }else if(complianeClass == 4) {
        onlyFlay.value = 3
        initCount(complianeNo)
      }else if(complianeClass == 5){
        onlyFlay.value = 4
      }
      initItemList(complianeNo)
   }
   function switchTabs(activeKey){
    if(tabsCheckArr.value[activeKey]){
      return;
    }
    tabsCheckArr.value[activeKey] = true
    if(onlyFlay.value == 2){
      if(activeKey==2){
        console.log(citemRef1)
        console.log(props.complianeInfoRecord   )
        citemRef1.value?.setProps({searchInfo:{complianeNo:props.complianeInfoRecord.complianeNo}});
        citemRef1.value?.reload()
      }
    }
    if(onlyFlay.value == 3){
      if(activeKey==2){
        cProblemRef1.value?.setProps({searchInfo:{complianeNo:props.complianeInfoRecord.complianeNo}});
        cProblemRef1.value?.reload()
      }else if(activeKey==3){
        citemRef2.value?.setProps({searchInfo:{complianeNo:props.complianeInfoRecord.complianeNo}});
        citemRef2.value?.reload()
      }
    }
   }
   function initItemList(complianeNo){
    console.log(complianeNo)
    console.log(onlyFlay)
    if(onlyFlay.value==1){
      defaultCitemRef.value?.setProps({searchInfo:{complianeNo:complianeNo}});
      defaultCitemRef.value?.reload()
    }else if(onlyFlay.value==2){
      cProblemRef0.value?.setProps({searchInfo:{complianeNo:complianeNo}});
      cProblemRef0.value?.reload()
    }else if(onlyFlay.value==3){
      criskRef.value?.setProps({searchInfo:{complianeNo:complianeNo}});
      criskRef.value?.reload()
    }else if(onlyFlay.value==4) {
      punishref.value?.setProps({searchInfo:{complianeNo:complianeNo}});
      punishref.value?.reload()
    }
   }
  //  watch(
  //   ()=>props.complianeInfoRecord,
  //   (newVal,oldVla)=>{
  //     console.log("item")
  //     console.log(newVal)
  //     // 监管处理
  //     if(newVal.complianeClass == 3){
  //       onlyFlay.value = 2
  //     }else if(newVal.complianeClass == 4) {
  //       onlyFlay.value = 3
  //     }
  //     console.log(oldVla)
  //     console.log("item")
  //   },
  // )
  defineExpose({initActiveKey})
</script>
<style scoped>
.st_coolection_cont {
  padding: 10px;
}
.st_coolection {
  padding: 12px 10px 6px 10px;
  margin-bottom: 8px;
  background-color: #fff;
  border-radius: 2px;
}
</style>