Browse Source
Feat/cancel event (#2593)
* feat(excel): add cancel event for import excel
* feat(excel): add cancel emits
pull/2599/head
yx lin
4 years ago
committed by
GitHub
No known key found for this signature in database
GPG Key ID: 4AEE18F83AFDEB23
1 changed files with
21 additions and
2 deletions
-
src/components/Excel/src/ImportExcel.vue
|
|
|
@ -37,10 +37,11 @@ |
|
|
|
default: false, |
|
|
|
}, |
|
|
|
}, |
|
|
|
emits: ['success', 'error'], |
|
|
|
emits: ['success', 'error', 'cancel'], |
|
|
|
setup(props, { emit }) { |
|
|
|
const inputRef = ref<HTMLInputElement | null>(null); |
|
|
|
const loadingRef = ref<Boolean>(false); |
|
|
|
const cancelRef = ref<Boolean>(true); |
|
|
|
|
|
|
|
function shapeWorkSheel(sheet: XLSX.WorkSheet, range: XLSX.Range) { |
|
|
|
let str = ' ', |
|
|
|
@ -184,6 +185,7 @@ |
|
|
|
|
|
|
|
if (!rawFile) return; |
|
|
|
|
|
|
|
cancelRef.value = false; |
|
|
|
if (props.isReturnFile) { |
|
|
|
emit('success', rawFile); |
|
|
|
return; |
|
|
|
@ -191,12 +193,29 @@ |
|
|
|
upload(rawFile); |
|
|
|
} |
|
|
|
|
|
|
|
/** |
|
|
|
* @description 文件选择器关闭后,判断取消状态 |
|
|
|
*/ |
|
|
|
function handleFocusChange() { |
|
|
|
const timeId = setInterval(() => { |
|
|
|
if (cancelRef.value === true) { |
|
|
|
emit('cancel'); |
|
|
|
} |
|
|
|
clearInterval(timeId); |
|
|
|
window.removeEventListener('focus', handleFocusChange); |
|
|
|
}, 1000); |
|
|
|
} |
|
|
|
|
|
|
|
/** |
|
|
|
* @description: 点击上传按钮 |
|
|
|
*/ |
|
|
|
function handleUpload() { |
|
|
|
const inputRefDom = unref(inputRef); |
|
|
|
inputRefDom && inputRefDom.click(); |
|
|
|
if (inputRefDom) { |
|
|
|
cancelRef.value = true; |
|
|
|
inputRefDom.click(); |
|
|
|
window.addEventListener('focus', handleFocusChange); |
|
|
|
} |
|
|
|
} |
|
|
|
|
|
|
|
return { handleUpload, handleInputClick, inputRef }; |
|
|
|
|