import { Modal } from 'ant-design-vue'
import { saveAs } from 'file-saver'

/**
 * 弹窗填入文件名保存文件
 * @param {Blob} data 数据
 * @param {string} ext 扩展名，不带.
 */
export const showSaveFileModal = (data, ext) => {
  let fileName = ''
  const handleClick = event => {
    fileName = event.target.value
  }

  Modal.confirm({
    title: 'Please enter file name',
    content: h => <a-input onChange={handleClick} />,
    okText: 'Cancle',
    cancelText: 'Save',
    okButtonProps: { style: { backgroundColor: '#b98326', color: '#fff', borderColor: 'transparent' } },
    cancelButtonProps: { style: { color: '#fff', backgroundColor: '#31aab0', borderColor: 'transparent' } },
    onOk() {
      console.log('Cancel')
    },
    onCancel() {
      if (fileName) {
        saveAs(data, `${fileName}.${ext}`)
      } else {
        throw new Error()
      }
    }
  })
}