/** 自定义hooks库 */
import { useState, useEffect } from 'react'
import { ContractListTree } from '@/types/contract'
import { ListModal } from '@/types/safe'

/** 合同树的自定义hook */
export const useContractTree = (): [ContractListTree, (newTree: ContractListTree) => void] => {
  const [ tree, setTree ] = useState<ContractListTree>({
    bidsectionId: '',
    children: [],
    childsTotal: 0,
    contracts: 0,
    contractsIncome: '',
    contractsIncomeProgress: '',
    contractsPaid: '',
    contractsPay: '',
    contractsPayProgress: '',
    contractsReturned: '',
    csrf: '',
    hasFolder: false,
    id: '',
    isBid: false,
    isEnd: false,
    isfolder: 0,
    name: '',
    parentId: '',
    projectId: '',
    qualityRectification: 0,
    qualityRectificationIn: 0,
    qualityRectificationFinish: 0,
    qualityTotal: 0,
    safeRectification: 0,
    safeRectificationIn: 0,
    safeRectificationFinish: 0,
    safeTotal: 0
  })
  const onChange = (newTree: ContractListTree) => {
    setTree({ ...tree, ...newTree })
  }
  return [ tree, onChange ]
}

/** 树列表展开收起自定义hook */
export const useTableExpand = (tree: ContractListTree[]): [string[], (expanded: boolean, record?: ContractListTree) => void] => {
  const [ ids, setIds ] = useState<Array<string>>([])
  useEffect(() => {
    const newIds = expandTree(tree as ContractListTree[])

    setIds(newIds)
  }, [ tree ])
  const onChange = (expanded: boolean, record?: ContractListTree) => {
    // 点击图标的展开收起
    if (record) {
      if (expanded) {
        const newIds = ids
        newIds.push(record.id)
        setIds(newIds)
      } else {
        setIds(ids.filter(item => item !== record.id))
      }
    } else {
      // 手动控制展开收起全部节点
      if (expanded && tree.length) {
        const newIds = expandTree(tree)
        setIds(newIds)
      } else {
        setIds([])
      }
    }
  }
  function expandTree(data: ContractListTree[]): string[] {
    let idArr: Array<string> = []

    data.forEach((item: ContractListTree) => {
      if (!!item.isfolder && item.children?.length) {
        idArr.push(item.id)
        const childIds = expandTree(item.children)
        idArr = [ ...idArr, ...childIds ]
      }
    })
    return idArr
  }

  return [ ids, onChange ]
}


/** 巡检列表页自定义hook*/
export const useListModal = (dataType: number): [ListModal, (newData: ListModal) => void] => {
  const [ state, setState ] = useState<ListModal>({
    ruleModal: {
      visible: false,
      loading: false
    },
    addModal: {
      visible: false,
      loading: false
    },
    fileModal: {
      visible: false,
      dataType,
      dataId: ''
    },
    dataList: [],
    total: 0
  })
  const onChange = (newData: ListModal) => {
    setState({ ...state, ...newData })
  }
  return [ state, onChange ]
}

export const useAutoTable = (needSubtractHeight: number) => {
  // console.log(collapsed)


  const [ scroll, setScroll ] = useState({ y: document.body.clientHeight - needSubtractHeight })

  useEffect(() => {
    const handleScroll = () => setScroll({ ...scroll, y: document.body.clientHeight - needSubtractHeight })
    window.addEventListener('resize', handleScroll)
    return () => {
      window.removeEventListener('resize', handleScroll)
    }
  }, [])

  // 实际返回的宽度要大一点让table出现滚动条，反正折叠菜单栏卡顿
  return [ scroll.y ]
}