import React, { useCallback, useEffect, useMemo, useState } from 'react'
import styles from './index.module.scss'
import { useParams } from 'react-router-dom'
import { API_getGoodsInfo } from '@/store/action/B1ledger'
import { B1listType } from '../B1ledger/data'
import classNames from 'classnames'
import { Button, Dropdown, MenuProps } from 'antd'
import Tab1info from './Tab1info'
import Tab2log from './Tab2log'
import Tab3stock from './Tab3stock'
import { MessageFu } from '@/utils/message'
import A0addGoods from '../A0addGoods'
import history from '@/utils/history'
import { B4_APIcreate } from '@/store/action/B4delete'
import { authorityFu } from '@/utils/authority'
import MyPopconfirm from '@/components/MyPopconfirm'
import { storageSelect } from '@/utils/select'
const topBtnArr = ['藏品信息', '编辑记录', '库存状态']

function A0goodsInfo() {
  const { id } = useParams<any>()

  const getInfoFu = useCallback(async () => {
    const res = await API_getGoodsInfo(id)
    if (res.code === 0) {
      setGoodsInfo(res.data)
    }
  }, [id])

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

  // 所有藏品信息
  const [goodsInfo, setGoodsInfo] = useState({} as B1listType)

  // tab切换
  const [btnAc, setBtnAc] = useState('藏品信息')

  // 点击藏品编辑（修改）
  const [isEdit, setIsEdit] = useState(false)

  const items1 = useMemo(() => {
    let arr: MenuProps['items'] = [
      {
        key: '1',
        label: (
          <span
            className='AIdroRow'
            onClick={() => {
              authorityFu(500, '您没有藏品修改页面权限', () => {
                if (goodsInfo.status === 2) MessageFu.warning('该藏品修改审核中，无法重复修改')
                else if (goodsInfo.status === 3) MessageFu.warning('该藏品删除审核中，无法修改')
                else setIsEdit(true)
              })
            }}
          >
            修改
          </span>
        )
      },
      {
        key: '2',
        label: (
          <MyPopconfirm
            txtK='删除2'
            onConfirm={() => {
              authorityFu(600, '您没有藏品删除页面权限', async () => {
                if (goodsInfo.status === 3) MessageFu.warning('该藏品删除审核中，无法重复删除')
                else if (goodsInfo.status === 2) MessageFu.warning('该藏品修改审核中，无法删除')
                else {
                  // 创建订单
                  const res = await B4_APIcreate(goodsInfo)
                  if (res.code === 0) {
                    history.push(`/delete_look/1/${res.data.id}`)
                  }
                }
              })
            }}
            Dom={
              <span className='AIdroRow' style={{ color: '#ff4d4d' }}>
                删除
              </span>
            }
          />
        )
      }
    ]

    return arr
  }, [goodsInfo])

  const siteStatusTxt = useMemo(() => {
    return storageSelect.find(v => v.value === goodsInfo.siteStatus)?.label
  }, [goodsInfo.siteStatus])

  const items2 = useMemo(() => {
    let arr: MenuProps['items'] = [
      {
        key: '1',
        label: (
          <span
            className='AIdroRow'
            onClick={() => {
              authorityFu(800, '您没有藏品入库页面权限', () => {
                if ([1, 2, 3, 4].includes(goodsInfo.siteStatus)) {
                  MessageFu.warning(`该藏品${siteStatusTxt},无法入库`)
                } else history.push(`/storageIn_look/1/0?oldId=${goodsInfo.id}`)
              })
            }}
          >
            入库
          </span>
        )
      },
      {
        key: '2',
        label: (
          <span
            className='AIdroRow'
            onClick={() => {
              authorityFu(900, '您没有藏品移库库页面权限', () => {
                if ([0, 1, 3, 4, 5].includes(goodsInfo.siteStatus)) {
                  MessageFu.warning(`该藏品${siteStatusTxt},无法移库`)
                } else history.push(`/storageMove_look/1/0?oldId=${goodsInfo.id}`)
              })
            }}
          >
            移库
          </span>
        )
      },
      {
        key: '3',
        label: (
          <span
            className='AIdroRow'
            onClick={() => {
              authorityFu(1000, '您没有藏品出库页面权限', () => {
                if ([0, 1, 3, 4, 5].includes(goodsInfo.siteStatus)) {
                  MessageFu.warning(`该藏品${siteStatusTxt},无法出库`)
                } else history.push(`/storageOut_look/1/0?oldId=${goodsInfo.id}`)
              })
            }}
          >
            出库
          </span>
        )
      }
    ]

    return arr
  }, [goodsInfo.id, goodsInfo.siteStatus, siteStatusTxt])

  return (
    <div className={styles.A0goodsInfo}>
      <div className='pageTitle'>藏品详情</div>

      <div className='AItop'>
        <div className='AItop1'>
          {topBtnArr.map(v => (
            <div
              key={v}
              className={classNames('AItop1Row', btnAc === v ? 'AItop1RowAc' : '')}
              onClick={() => setBtnAc(v)}
            >
              {v}
            </div>
          ))}
        </div>

        <div className='AItop2'>
          <Dropdown menu={{ items: items1 }} placement='bottom' arrow>
            <Button type='primary'>档案管理</Button>
          </Dropdown>
          &emsp;
          <Dropdown menu={{ items: items2 }} placement='bottom' arrow>
            <Button type='primary'>库房管理</Button>
          </Dropdown>
        </div>
      </div>

      {goodsInfo.id ? (
        <div className='AImain'>
          {btnAc === '藏品信息' ? <Tab1info info={goodsInfo} /> : null}
          {btnAc === '编辑记录' ? <Tab2log sId={goodsInfo.id} /> : null}
          {btnAc === '库存状态' ? <Tab3stock info={goodsInfo} /> : null}
        </div>
      ) : null}

      {/* 点击藏品修改 */}
      {isEdit && goodsInfo.id ? (
        <A0addGoods sId={goodsInfo.id} closeFu={() => setIsEdit(false)} isEdit={true} />
      ) : null}
    </div>
  )
}

const MemoA0goodsInfo = React.memo(A0goodsInfo)

export default MemoA0goodsInfo
