import { deleteListData } from '@/utils/tableFC';
import { useIntl } from '@umijs/max';
import { Button, Popconfirm } from 'antd';
import './index.less';

type BubbleType = {
  url: string;
  idObj: any;
  onSave: () => void;
  delTypeTitle: any;
  disable?: boolean;
  hidden?: boolean;
};

const CueBubble = ({
  url,
  idObj,
  onSave,
  delTypeTitle,
  disable,
  hidden,
}: BubbleType) => {
  const intl = useIntl();
  return (
    <>
      <Popconfirm
        disabled={!!disable}
        key="del"
        title={
          <div className="hint-del">
            {intl.formatMessage({ id: 'modal.text.delete' })}
            {delTypeTitle}
            {intl.formatMessage({ id: 'modal.info.text.affirmDelAfter' })}
          </div>
        }
        onConfirm={() => {
          deleteListData(url, idObj, () => onSave());
        }}
        okText={intl.formatMessage({ id: 'modal.handel.yes' })}
        cancelText={intl.formatMessage({ id: 'modal.handel.cancel' })}
      >
        <Button
          type="link"
          size="small"
          disabled={!!disable}
          hidden={hidden || false}
          // id="btn-more"
        >
          {intl.formatMessage({ id: 'columns.handel.delete' })}
        </Button>
      </Popconfirm>
    </>
  );
};
export default CueBubble;