<template>
    <HcTabsSimple :cur="tabsKey" :datas="tabsData" @tabClick="tabsClick">
        <template #tab-base>
            <baseTabCard :datas="infoData" :disabled="dataType === 'view'" v-if="tabsKey === 'base'"/>
        </template>
        <template #tab-file>
            <fileTabCard :datas="infoDataFile" :disabled="dataType === 'view'" v-if="tabsKey === 'file'"/>
        </template>
        <template #tab-milestone>
            <milestoneTab :datas="milestoneData" :disabled="dataType === 'view'" v-if="tabsKey === 'milestone'"/>
        </template>
        <template #tab-record>
            <recordTabCard :datas="infoData" v-if="tabsKey === 'record'"/>
        </template>
    </HcTabsSimple>
</template>

<script setup>
import {onActivated, ref} from "vue";
import {useRouter, useRoute} from 'vue-router'
import baseTabCard from "./components/base.vue";
import fileTabCard from "./components/file.vue";
import milestoneTab from "./components/milestone.vue";
import recordTabCard from "./components/record.vue";
import {arrIndex,getObjValue} from "js-fast-way";
import contractApi from '~api/project/project-contract.js';

//初始变量
const router = useRouter()
const useRoutes = useRoute()
const dataId = ref(useRoutes?.query?.id ?? '')
const dataType = ref(useRoutes?.query?.type ?? '')

//缓存页面被激活时
onActivated(() => {
    dataId.value = useRoutes?.query?.id ?? ''
    dataType.value = useRoutes?.query?.type ?? ''
    setTabsData()
    if(dataType.value!=='add'){
        getContractInfoById()
    }else{
        infoData.value={}
    }
})
const infoDataFile=ref({pdfUrl:''})
//获取详情
const getContractInfoById=async()=>{
    const {error, code, data} = await contractApi.getContractInfoById({id: dataId.value})
    if (!error && code === 200) {
        infoData.value=getObjValue(data)
        infoDataFile.value.pdfUrl=infoData.contractAccessory

    } else {
        infoData.value={}
    }
}
//设置选项卡数据
const setTabsData = () => {
    const index = arrIndex(tabsData.value, 'key', 'record')
    if (dataType.value === 'view') {
        //预览模式下，索引不存在，就添加此选项
        if (index === -1)  {
            tabsData.value.push({
                icon: 'file-history',
                label: '合同开票记录',
                key: 'record'
            })
        }
    } else {
        //编辑模式下，索引存在，就删除此选项
        if (index !== -1) {
            tabsData.value.splice(index, 1)
        }
    }
}

//选项卡
const tabsKey = ref('base')
const tabsData = ref([
    {icon: 'file-list-3', label: '合同基础信息', key: 'base'},
    {icon: 'file-word', label: '合同附件', key: 'file'},
    {icon: 'creative-commons-sa', label: '合同回款里程碑', key: 'milestone'},
])
const tabsClick = (key) => {
    tabsKey.value = key
    if(key=='milestone'){
        getListByContractId()
    }
}

const infoData = ref({})
const isNoDropShadow = ref(false)
//合同里程碑
const milestoneData=ref([])
const getListByContractId=async()=>{
    const {error, code, data} = await contractApi.getListByContractId({id: dataId.value})
    if (!error && code === 200) {
        milestoneData.value=getObjValue(data)
       

    } else {
        milestoneData.value=[]
    }
}

</script>
