import React, { useCallback, useEffect, useMemo, useState } from 'react'
import styles from './index.module.scss'
import { API_getGoodsLog } from '@/store/action/B1ledger'
import MyTable from '@/components/MyTable'
import { B1listType } from '@/pages/B1ledger/data'
import { goodsLogTableC } from '@/utils/tableData'
import { Button } from 'antd'
import tabLeftArr from '@/pages/Layout/data'
import { openLink } from '@/utils/history'
import { authorityFu } from '@/utils/authority'
import { MessageFu } from '@/utils/message'

type Props = {
  sId: number
}

function Tab2log({ sId }: Props) {
  const [loding, setLoding] = useState(false)

  const [list, setList] = useState<B1listType[]>([])

  const getListFu = useCallback(async () => {
    const res = await API_getGoodsLog(sId)
    if (res.code === 0) {
      setLoding(true)
      setList(res.data)
    }
  }, [sId])

  useEffect(() => {
    getListFu()
  }, [getListFu])

  const dataChange = useCallback((item: B1listType) => {
    const arr = tabLeftArr[1].son
    const obj = arr.find(v => v.pageType === item.type)
    return obj
  }, [])

  const staBtn = useMemo(() => {
    return [
      {
        title: '订单编号',
        render: (item: B1listType) => item.num
      },
      {
        title: '申请类型',
        render: (item: B1listType) => {
          const obj = dataChange(item)

          return obj ? obj.name : '（空）'
        }
      }
    ]
  }, [dataChange])

  const tableLastBtn = useMemo(() => {
    return [
      {
        title: '操作',
        render: (item: B1listType) => {
          return (
            <Button
              size='small'
              type='text'
              onClick={() => {
                const obj = dataChange(item)
                if (obj) {
                  authorityFu(obj.id, `您没有${obj.name}页面权限`, () => {
                    openLink(`${obj.path}_look/1/${item.id}`)
                  })
                } else MessageFu.warning(`type字段：${item.type} 错误`)
              }}
            >
              查看
            </Button>
          )
        }
      }
    ]
  }, [dataChange])

  return (
    <div className={styles.Tab2log}>
      {loding ? (
        <MyTable
          yHeight={690}
          list={list}
          columnsTemp={goodsLogTableC}
          staBtn={staBtn}
          lastBtn={tableLastBtn}
          pagingInfo={false}
        />
      ) : null}
    </div>
  )
}

const MemoTab2log = React.memo(Tab2log)

export default MemoTab2log
