HQ_yueYue/展示端/src/components/MyPopconfirm.tsx

import React, { useMemo } from 'react'
import { Button, Popconfirm } from 'antd'

type Props = {
  txtK: '删除' | '取消' | '重置密码' | '退出登录' | '撤回'
  onConfirm: () => void
  Dom?: React.ReactNode
  loc?: 'bottom'
}

function MyPopconfirm({ txtK, onConfirm, Dom, loc }: Props) {
  const txt = useMemo(() => {
    const obj = {
      删除: ['删除后无法恢复，是否删除?', '删除'],
      取消: ['放弃编辑后，信息将不会保存!', '放弃'],
      重置密码: ['密码重制后为123456，是否重置?', '重置'],
      退出登录: ['确定退出吗?', '确定'],
      撤回: ['确定撤回吗?', '确定']
    }
    return Reflect.get(obj, txtK) || ['', '']
  }, [txtK])

  return (
    <Popconfirm
      placement={loc}
      title={txt[0]}
      okText={txt[1]}
      cancelText='取消'
      onConfirm={onConfirm}
      okButtonProps={{ loading: false }}
    >
      {Dom ? (
        Dom
      ) : txtK === '删除' ? (
        <Button size='small' type='text' danger>
          {txtK}
        </Button>
      ) : (
        <Button>{txtK}</Button>
      )}
    </Popconfirm>
  )
}

const MemoMyPopconfirm = React.memo(MyPopconfirm)

export default MemoMyPopconfirm